diff options
author | Neil <cdcd71517@gmail.com> | 2021-04-28 00:45:46 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-04-28 00:45:46 +0800 |
commit | 4c4eb4c4f905cef32b77d0c61205e36121d75559 (patch) | |
tree | 77df463c7e78d40d85c41abc41fe85334c71d492 /files/zh-tw | |
parent | fca49c8c27e58481a1d8cdfddd1f44feed3f42d4 (diff) | |
download | translated-content-4c4eb4c4f905cef32b77d0c61205e36121d75559.tar.gz translated-content-4c4eb4c4f905cef32b77d0c61205e36121d75559.tar.bz2 translated-content-4c4eb4c4f905cef32b77d0c61205e36121d75559.zip |
Update /learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_startedGetting started with Svelte, zh-TW (#669)
* Getting started with Svelte (zh-TW translation) (part of "Svelte: A new approach to building rich user interfaces") & 組件 → 元件
* 修正小問題(英式括號 → 中式全形括號,連續中文不應有空白,classic 改譯為「傳統」)
Diffstat (limited to 'files/zh-tw')
-rw-r--r-- | files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.html | 26 |
1 files changed, 13 insertions, 13 deletions
diff --git a/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.html b/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.html index 86bd9d51d3..a660fc2bab 100644 --- a/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.html +++ b/files/zh-tw/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.html @@ -36,21 +36,21 @@ tags: </tbody> </table> -<h2 id="Svelte_A_new_approach_to_building_rich_user_interfaces">Svelte: A new approach to building rich user interfaces</h2> +<h2 id="Svelte_A_new_approach_to_building_rich_user_interfaces">Svelte:一種建構豐富使用者介面的新方式</h2> -<p>Svelte provides a different approach to building web apps than some of the other frameworks covered in this module. While frameworks like React and Vue do the bulk of their work in the user's browser while the app is running, Svelte shifts that work into a compile step that happens only when you build your app, producing highly-optimized vanilla JavaScript.</p> +<p>於此模組中介紹的其它框架相比,Svelte 提供了一種不同的方式來建構網站應用程式。當應用程式運行時,像 React 和 Vue 等框架會在使用者的瀏覽器直接做它們想要做的事情,而 Svelte 則是將做的這些事移到編譯階段處理,因此那些做的事情只會發生在你建置應用程式的時候,進而能產生高度優化的純 JavaScript 程式碼。</p> -<p>The outcome of this approach is not only smaller application bundles and better performance, but also a developer experience that is more approachable for people that have limited experience of the modern tooling ecosystem.</p> +<p>這種方式產生的結果並不是只有將應用程式的 Bundles 最小化和取得最佳效能,對於現代的生態環境而擁有較少技術經驗的人,可以更容易取得開發者經驗。</p> -<p>Svelte sticks closely to the classic web development model of HTML, CSS, and JS, just adding a few extensions to HTML and JavaScript. It arguably has fewer concepts and tools to learn than some of the other framework options.</p> +<p>Svelte 更貼近傳統的網站開發模型(HTML、CSS、JS),它只有對 HTML 和 JavaScript 加上一些擴充,與其它框架相比,可以說只需要一點點概念和工具就能學習。</p> -<p>It's main current disadvantages are that it is a young framework — its ecosystem is therefore more limited in terms of tooling, support, plugins, clear usage patterns, etc. than more mature frameworks, and there are also less job opportunities. But it's advantages should be enough to make you interested to explore it.</p> +<p>現階段的缺點只因它目前仍在發展中 — 和其它成熟框架相比它的生態環境較受限於工具、支援、套件、使用模式等等限制,工作機會也比較少。但它的優點應該足夠讓你感興趣並去探索它。</p> <div class="notecard note"> -<p><strong>Note</strong>: recently Svelte has added <a href="https://svelte.dev/blog/svelte-and-typescript">official TypeScript support</a>, one of its most requested features. We'll look at it later on in this tutorial series.</p> +<p><strong>注意</strong>:最近 Svelte 已經正式加入 <a href="https://svelte.dev/blog/svelte-and-typescript">TypeScript 支援</a>,這也是最受歡迎的功能之一,我們將在之後的教學系列中看到它。</p> </div> -<p>We encourage you to go through the <a href="https://svelte.dev/tutorial/basics">Svelte tutorial</a> for a really quick introduction to the basic concepts, before returning to this tutorial series to learn how to build something slightly more in-depth. It should take you about 30 minutes to complete.</p> +<p>我們鼓勵你走完 <a href="https://svelte.dev/tutorial/basics">Svelte 教學</a>來快速了解基本的概念,在你回來此教學系列學習如何建構一些更深入的東西之前。它應該會花費你約 30 分鐘去完成。</p> <h2 id="Use_cases">Use cases</h2> @@ -499,7 +499,7 @@ npm run dev</pre> <ul> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started">React 入門</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">建立我們的 React 待辦清單</a></li> - <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">組件化我們的 React 應用程式</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">元件化我們的 React 應用程式</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">React 互動性:事件與狀態</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">React 互動性:編輯、過濾、條件式渲染</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">React 無障礙</a></li> @@ -509,7 +509,7 @@ npm run dev</pre> <li>Ember <ul> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Ember 入門</a></li> - <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember 應用程式結構及組件化</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember 應用程式結構及元件化</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Ember 互動性:事件、類別、狀態</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Ember 互動性:Footer 功能、條件式渲染</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Ember 路由</a></li> @@ -519,10 +519,10 @@ npm run dev</pre> <li>Vue <ul> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Vue 入門</a></li> - <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">建立第一個 Vue 組件</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">建立第一個 Vue 元件</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">渲染 Vue 清單</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">新增待辦表單:Vue 事件、方法、模型</a></li> - <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">透過 CSS 樣式化 Vue 組件</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">透過 CSS 樣式化 Vue 元件</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">使用 Vue 計算屬性</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Vue 條件式渲染:編輯已存在的待辦表單</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">聚焦 Vue refs</a></li> @@ -534,7 +534,7 @@ npm run dev</pre> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Svelte 入門</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">開始寫我們的 Svelte 待辦清單應用程式</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Svelte 中的動態行為:變數及屬性</a></li> - <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">組件化我們的 Svelte 應用程式</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">元件化我們的 Svelte 應用程式</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">進階 Svelte:反應性、生命週期、可存取性</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">和 Svelte stores 共舞</a></li> <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">Svelte 中的 TypeScript</a></li> @@ -546,7 +546,7 @@ npm run dev</pre> <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">Creating an item component 建立(待辦清單)項目組件</a></li> + <li><a href="/zh-TW/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_item_component">Creating an item component 建立(待辦清單)項目元件</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> |