fbpx

React 元件樣式設計 2019 – 設定你的 React apps 風格最好的方法

課程簡介

丟棄 CSS 樣式表吧! 在 JS 中學習 CSS,使用樣式元件(styled-components)程式庫快速和乾淨地設計 React 元件樣式

課程介紹:English 简中

從這 1 小時的課程,你會學到

  • 使用更新、更乾淨、更有效的樣式元件來設定 React 應用程式樣式
  • 使用 CSS-in-JS 樣式元件庫轉換或建立新的 React 應用程式
  • 增加你成為一個 React 開發者的價值

要求

  • 您應該已經知道一些簡單的 ES6 語法,並且已經在使用 React 框架工作了

課程說明

* * 課程更新 * *

  • 更新課程到 styled-components 版本4
  • 下載所有程式碼範例的 ZIP 檔案。
  • Link to github repo for all code examples.
  • 連結到所有程式碼範例的 github repository。

這個課程是 React 開發者的下一個步,他們希望通過拋棄不穩定的 CSS 類別名稱和結構、混亂的 CSS 匯入和 CSS 類別命名衝突與他們的 React 應用程式衝突,而是擁抱最好的 React 應用程式樣式設計方法,並且與 CSS-in-js 樣式元件庫一起使用!

這個樣式元件(styled-components )框架可以讓你在 JavaScript 中編寫實際的 CSS。 這意味著你可以使用你最喜歡的 CSS 的所有特性,包括(但是不限於)媒體查詢,所有的pseudo-selectors,nesting等。

React 將傳統的view/ view model 方法應用於 web 開發,並將它們合併為一個,同時仍保持程式碼模組化和單一責任。 樣式元件可以看作是這個的一個擴充套件,同時將樣式也帶入 JS 檔案。 他們都有一對一的關係,所以只要它們是模組化的,將它們結合起來是有意義的。 本課程將幫助您理解這種方法的力量,並向您展示如何建構這些元件。

What other students are saying about this course:

其他學生對這門課程的評價是:

★★★★★ 5/5 stars – “I love this course so much, Tom is very responsive with the student question. No copy paste code, that we know all students doesn’t like it. There’s so many new information and a modern way to write a components, I like it so much and I will implement it to my projects 🙂 Thank you Tom for helping us !” – Kadek Pradnyana

★★★★★ 5/5 stars – “A great introduction to styled components in React. It goes through each of the most common scenarios to help you start building. Excellent course!” – Memo Ramirez

★★★★★ 5/5 stars – “A great intro to the styled-components way of styling React components.” – Ian Taite

★★★★★ 5/5 stars – “I did not know that this is possible. Amazing” (translated) – Alex

目標受眾

  • 使用傳統樣式 CSS 或 SASS 樣式表的 React 開發人員,他們想學習更好更乾淨的方法; 使用 CSS-in-js React 樣式元件庫

講師簡介

Tom Phillips 前端網頁專家和移動開發者

多年來,Tom Phillips 一直在英國開發前端網頁和移動應用程式。 在這段時間裡,他不得不為初級開發人員準備並教授最新的前端網頁框架的多門課程,並在初級開發人員的早期指導他們。 通過這樣做,Tom 找到了有效的方法來教授和打破許多開發人員在嘗試開始新框架時所面臨的常見複雜問題,特別是在這樣一個迅速變化的領域,作為前端網頁開發。 現在他把這些方法應用到他的 Udemy 課程中了!

早在 Tom 自己還是個初級開發人員的時候,他很幸運地受到了這個領域專家的指導。 這使得他在職涯中得到了迅速的進步,並且在他作為專家的前端開發人員的時候理解和建構了多個大型專案。 現在 Tom 正在扮演專家的角色與責任,分享他的知識。 通過參加 Tom的一門課程,獲得與 Tom 一樣的指導並在前端網頁開發中快速追蹤你的理解和知識。

英文字幕:有

  • 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To

參加課程 ♥找優惠折扣碼?

Sponsored by Udemy

也許你會有興趣

 歡迎使用 e-mail 訂閱 Soft & Share 

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: