Posts match “ react ” tag:

React 碎碎念: 艱困的新手之路

其實關注 React 的東西已經很久,直到最近剛好有機會就在新的專案跳坑下來,寫了兩個星期之後有很多事情覺得應該要寫下來做個紀錄。

至於為什麼叫碎碎念而不叫做筆記呢? 因為文章中個人抒發感想的部分可能也不在少數,又或著可能我沒有真心喜歡它(React)吧。

碎碎念大部分是個人意見,客觀部分敘述有錯誤歡迎指證。

正文

我真心覺得現在的 React 超難上手。

在 JS 的生態系統推進,以及各種工程師大大們的持續努力之下,想要上手現在的 React (可謂是 modern React)大概需要了解、會操作下面這些東西:

再補上一些可選的項目

當然如果上述這些都有統一而且很直覺的學習路徑也就罷了(用現在的英文說是 opinionated),但我想現在的 JS 精神就是要把所有東西都 modulize,所以往往我們光是 configure 環境就要花掉大把的精神與時間。

可以看一下 AngularClass 在去年年底對 React developers 做的調查,就知道是一個多麼充滿選擇的環境(菸)。

Read on

React 碎碎念: 我只是想寫個 CSS

是說上次的碎碎念好像有點莫名地在我不知道的地方流傳,我根本沒宣傳那篇文章才對...

總之歡迎關注 React碎碎念 系列文章

碎碎念大部分是個人意見,客觀部分敘述有錯誤歡迎指證。

有一天

這天在 ReactJS.tw 看到了人家轉貼的 新工具介紹文章 — React Storybook,點過去看完之後順道看了一下作者還有寫些什麼文章,於是發現了這篇,也就是本文的主角

State of React and CSS

推薦讀完再繼續看下去。

想想上次發的 React 碎碎念: 艱困的新手之路 也是因為被一些看到的東西點燃了(X)

你原本怎麼寫 CSS?

其實原本有在寫 CSS 到一定程度的人(不管是前端工程師還是網頁設計師),一般會碰到一個轉捩點就是 — 習得 CSS 心法 (WTF)。

寫 CSS 的人,隨著碰過的網頁跟經驗增加,漸漸碰到頁面趨向複雜或是網站越來越巨大,然後 CSS 寫一寫就崩潰了。

於是坊間就有各種拯救你的心法出現,是經過時間淬鍊的成果,你可以選擇 follow 一種,或著結合眾家精隨融會貫通。(或著像我只學了皮毛就一直亂寫)

比較有名的心法這邊列三個:

還有一則很容易不小心就搜尋到的投影片 — 漫談 CSS 架構方法 - 以 OOCSS, SMACSS, BEM 為例

歡迎來到 React 的世界

然而,就是這個然而

在 React 崛起之後,因應它用力的 component 化,帶動了嶄新的 CSS 風潮。上面的 Medium 文章中列出搭配 React 使用的方式有:

  • 使用現成的 CSS framework
  • 寫 (good old) CSS
  • 用別人寫的 React-based UI
  • 用 CSS Modules
  • 在 JS 裡面寫 CSS

上面就 React 出現之後才崛起的其實又大體上可以分成兩類:

  • 在 JS 裡面寫 CSS
  • 用 CSS Modules
Read on