Update /learn/tools_and_testing/client-side_javascript_frameworks/angular_building, zh-TW (#668)

* feat: change link from en-US to zh-TW

* feat(Angular_building): zh-TW - whole page

* feat(Angular_building): footer nav zh-TW

* fix: 檢查標點符號、中英夾雜的空白

* fix(Angular_building): 間隔空白修正

* fix: 破折號和中文間不需間隔、遺漏的中英間隔

Co-authored-by: Shawn Tseng <shawn.tseng@atgamescloud.net>

1 files changed, 63 insertions, 64 deletions

diff --git a/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/angular_building/index.html b/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/angular_building/index.html
index 69954c77dc..3dc1b1cd57 100644
--- a/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/angular_building/index.html
+++ b/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/angular_building/index.html
@@ -22,123 +22,122 @@ tags:
 
 <div>{{PreviousMenu("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_filtering", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
 
-<p>This final Angular article covers how to build an app ready for production, and provides further resources for you to continue your learning journey.</p>
+<p>這篇文章內容涵蓋，如何建立一個產品版本（production）的應用程式，以及提供後續的學習資源。</p>
 
 <table class="learn-box standard-table">
  <tbody>
   <tr>
    <th scope="row">預備知識：</th>
-   <td>Familiarity with the core <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, and <a href="/en-US/docs/Learn/JavaScript">JavaScript</a> languages, knowledge of the <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">terminal/command line</a>.
+   <td>熟悉 <a href="/zh-TW/docs/Learn/HTML">HTML</a>、<a href="/zh-TW/docs/Learn/CSS">CSS</a> 和 <a href="/zh-TW/docs/Learn/JavaScript">JavaScript</a> 的主要概念，以及 <a href="/zh-TW/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">終端機／命令列</a> 的知識。
    </td>
   </tr>
   <tr>
    <th scope="row">學習目標：</th>
-   <td>To learn how to build your Angular app.</td>
+   <td>學會如何編譯你的 Angular 應用程式</td>
   </tr>
  </tbody>
 </table>
 
-<h2 id="building_your_finished_application">Building your finished application</h2>
+<h2 id="building_your_finished_application">建立你的應用程式完成版</h2>
 
-<p>Now that you are finished developing your application, you can run the Angular CLI <code>build</code> command.
-When you run the <code>build</code> command in your <code>todo</code> directory, your application compiles into an output directory named <code>dist/</code>.</p>
+<p>現在你已經完成開發你的應用程式，接著執行 Angular CLI <code>build</code> 的指令。
+當你在 <code>todo</code> 的目錄底下執行 <code>build</code> 的指令，應用程式會編譯並且輸出到 <code>dist/</code> 的目錄下。</p>
 
-<p>In the <code>todo</code> directory, run the following command at the command line:</p>
+<p>在 <code>todo</code> 目錄底下，且在命令列執行以下的命令：</p>
 
-<pre class="brush: bash">ng  build --prod</pre>
+<pre class="brush: bash">ng build --prod</pre>
 
-<p>The CLI compiles the application and puts the output in a new <code>dist</code> directory.
-The <code>--prod</code> flag with <code>ng build</code> gets rid of stuff you don&#39;t need for production.</p>
+<p>命令列介面—— CLI（Command Line Interface），會將應用程式編譯並且輸出到新的目錄 <code>dist</code> 底下。
+  這個 <code>--prod</code> 尾隨在 <code>ng build</code> 的參數，會移除在正式產品版本上不需要的東西。</p>
 
-<h2 id="deploying_your_application">Deploying your application</h2>
+<h2 id="deploying_your_application">部署你的應用程式</h2>
 
-<p>To deploy your application, you can copy the contents of the <code>dist/my-project-name</code> folder to your web server.
-Because these files are static, you can host them on any web server capable of serving files, such as:</p>
+<p>為了部署你的應用程式，你可以複製 <code>dist/my-project-name</code> 資料夾底下的內容到你的伺服器上。
+因為這些都是靜態檔案，你可以將這些檔案放到任何能夠提供檔案的伺服器上，像是：</p>
 
 <ul>
-  <li>Node.js</li>
-  <li>Java</li>
-  <li>.NET</li>
+  <li><a href="https://nodejs.org">Node.js</a></li>
+  <li><a href="https://www.java.com">Java</a></li>
+  <li><a href="https://dotnet.microsoft.com">.NET</a></li>
 </ul>
 
-<p>You can use any backend such as <a href="https://firebase.google.com/docs/hosting">Firebase</a>, <a href="https://cloud.google.com/solutions/web-hosting">Google Cloud</a>, or <a href="https://cloud.google.com/appengine/docs/standard/python/getting-started/hosting-a-static-website">App Engine</a>.</p>
+<p>你可以使用任何後端，像是 <a href="https://firebase.google.com/docs/hosting">Firebase</a>、<a href="https://cloud.google.com/solutions/web-hosting">Google Cloud</a> 或 <a href="https://cloud.google.com/appengine/docs/standard/python/getting-started/hosting-a-static-website">App Engine</a>。</p>
 
-<h2 id="whats_next">What's next</h2>
+<h2 id="whats_next">接著要做什麼</h2>
 
-<p>At this point, you&#39;ve built a basic application, but your Angular journey is just beginning.
-You can learn more by exploring the Angular documentation, such as:</p>
+<p>現在你已經建立了基本的應用程式，但是你的Angular學習旅程才剛開始，你可以探索Angular文件學習更多，像是：</p>
 
 <ul>
-  <li><a href="https://angular.io/tutorial">Tour of Heroes</a>: An in-depth tutorial highlighting Angular features, such as using services, navigation, and getting data from a server.</li>
-  <li>The Angular <a href="https://angular.io/guide/component-overview">Components</a> guides: A series of articles that cover topics such as lifecycle, component interaction, and view encapsulation.</li>
-  <li>The <a href="https://angular.io/guide/forms-overview">Forms</a> guides: Articles that guide you through building reactive forms in Angular, validating input, and building dynamic forms.</li>
+  <li><a href="https://angular.io/tutorial">英雄之旅</a>：一個深入的 Angular 重點課程，像是使用服務（service）、導覽（navigation）以及從伺服器取得資料。</li>
+  <li>Angular <a href="https://angular.io/guide/component-overview">元件</a> 指南：一系列的文章，主題包括生命週期、元件互動以及檢視封裝。</li>
+  <li><a href="https://angular.io/guide/forms-overview">表單</a> 指南：文章內容包含建立Angular的響應式表單、輸入驗證以及建立動態表單。</li>
 </ul>
 
-<h2 id="summary">Summary</h2>
+<h2 id="summary">總結</h2>
 
-<p>That's it for now. We hope you had fun with Angular!</p>
+<p>以上。希望您喜歡 Angular！</p>
 
 <div>{{PreviousMenu("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_filtering", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
 
-<h2 id="In_this_module">In this module</h2>
+<h2 id="In_this_module">在這個模組中</h2>
 
 <ul>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introduction to client-side frameworks</a></li>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Framework main features</a></li>
+ <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introduction to client-side frameworks</a></li>
+ <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Framework main features</a></li>
  <li>React
   <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started">Getting started with React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Beginning our React todo list</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Componentizing our React app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">React interactivity: Events and state</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">React interactivity: Editing, filtering, conditional rendering</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accessibility in React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">React resources</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started">Getting started with React</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Beginning our React todo list</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Componentizing our React app</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">React interactivity: Events and state</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">React interactivity: Editing, filtering, conditional rendering</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accessibility in React</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">React resources</a></li>
   </ul>
  </li>
  <li>Ember
   <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Getting started with Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember app structure and componentization</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Ember interactivity: Events, classes and state</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Ember Interactivity: Footer functionality, conditional rendering</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Routing in Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Ember resources and troubleshooting</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Getting started with Ember</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember app structure and componentization</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Ember interactivity: Events, classes and state</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Ember Interactivity: Footer functionality, conditional rendering</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Routing in Ember</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Ember resources and troubleshooting</a></li>
   </ul>
  </li>
  <li>Vue
   <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Getting started with Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creating our first Vue component</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Rendering a list of Vue components</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Adding a new todo form: Vue events, methods, and models</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Styling Vue components with CSS</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Using Vue computed properties</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Vue conditional rendering: editing existing todos</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Focus management with Vue refs</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Vue resources</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Getting started with Vue</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creating our first Vue component</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Rendering a list of Vue components</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Adding a new todo form: Vue events, methods, and models</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Styling Vue components with CSS</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Using Vue computed properties</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Vue conditional rendering: editing existing todos</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Focus management with Vue refs</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Vue resources</a></li>
   </ul>
  </li>
  <li>Svelte
   <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Getting started with Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Starting our Svelte Todo list app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Dynamic behavior in Svelte: working with variables and props</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Componentizing our Svelte app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Advanced Svelte: Reactivity, lifecycle, accessibility</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Working with Svelte stores</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">TypeScript support in Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Deployment and next steps</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Getting started with Svelte</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Starting our Svelte Todo list app</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Dynamic behavior in Svelte: working with variables and props</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Componentizing our Svelte app</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Advanced Svelte: Reactivity, lifecycle, accessibility</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Working with Svelte stores</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">TypeScript support in Svelte</a></li>
+   <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Deployment and next steps</a></li>
   </ul>
  </li>
  <li>Angular
    <ul>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_getting_started">Getting started with Angular</a></li>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_todo_list_beginning">Beginning our Angular todo list app</a></li>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_styling">Styling our Angular app</a></li>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_item_component">Creating an item component</a></li>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_filtering">Filtering our to-do items</a></li>
-    <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_building">Building Angular applications and further resources</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_getting_started">Angular 新手入門</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_todo_list_beginning">開始開發我們的 Angular 待辦事項應用程式</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_styling">使用樣式點綴我們的 Angular 應用程式</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_item_component">建立一個 item 元件</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_filtering">篩選我們的待辦事項項目</a></li>
+    <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_building">建構 Angular 應用程式與更多資源</a></li>
    </ul>
  </li>
 </ul>