React.js: web開(kāi)發(fā)者的14個(gè)工具和資源
自從Facebook在2013年發(fā)布了庫(kù)之后，React.js正在快速被廣大開(kāi)發(fā)者所接受。它現(xiàn)在已經(jīng)成為了GitHub上被收藏次數(shù)排名第5的開(kāi)源項(xiàng)目，越來(lái)越多的企業(yè)正在尋找React.js開(kāi)發(fā)者。本文為廣大開(kāi)發(fā)者介紹了14個(gè)工具和資源，助力web開(kāi)發(fā)。
自從Facebook在2013年發(fā)布了庫(kù)之后，React.js正在快速被廣大開(kāi)發(fā)者所接受。它現(xiàn)在已經(jīng)成為了GitHub上被收藏次數(shù)排名第5的開(kāi)源項(xiàng)目，越來(lái)越多的企業(yè)正在尋找React.js開(kāi)發(fā)者。
React有著更簡(jiǎn)單易懂的架構(gòu)，而且專注于性能優(yōu)化，這使它代替了一些MVC框架，例如Angular和Backbone等。在未來(lái)幾年內(nèi)，React一定還會(huì)繼續(xù)發(fā)揮重要的作用。這篇文章中，我們總結(jié)了一些開(kāi)發(fā)者工具，幫你更輕松的使用React。
Facebook為開(kāi)發(fā)者提供了詳細(xì)的說(shuō)明文檔。除了文檔之外，還有一個(gè)相信的指導(dǎo)說(shuō)明，以及一個(gè)針對(duì)React開(kāi)發(fā)者打造的線上論壇。而且這份文檔為開(kāi)源項(xiàng)目，你甚至可以對(duì)它進(jìn)行編輯。
在這個(gè)repo中，你可以查看React的源代碼。如果你想關(guān)注它最新的狀態(tài)，你也可以查看各種issue、里程碑以及最新的pull request。在遇到問(wèn)題的時(shí)候，你還可以查看它的Trouble Shooting Guide。
如果你想快速的嘗試一下React，你可以使用Codepen上的這個(gè)“Hello World”互動(dòng)式demo。
React Starter Kit是一個(gè)使用了Node.js、Express、GraphQL、React和Webpack、Babel以及Browsersync等web開(kāi)發(fā)工具打造的web應(yīng)用模板。而且它還提供了和Facebook一樣的全段堆棧。
ReactCSS讓你可以在JavaScript中添加inline CSS樣式。ReactCSS支持React、Redux、React Nativeautoprefixing、hover、pseudo-element和media請(qǐng)求。你可以使用npm對(duì)其進(jìn)行快速安裝。
React JSFiddle integration (with and without JSX)
這是一個(gè)非常不錯(cuò)的React線上練習(xí)工具。它被寄存在JSFiddle上，而且擁有兩個(gè)版本：一個(gè)帶有JSX，一個(gè)沒(méi)有JSX，你可以根據(jù)自己的喜好進(jìn)行選擇。
使用這個(gè)簡(jiǎn)單的React樣式指導(dǎo)生成器，你可以為你的React項(xiàng)目快速生成樣式指導(dǎo)。你只需要給文件添加一些文檔，之后生成器就會(huì)自動(dòng)完成剩下的事情。
Belle configurable React components
Belle是一個(gè)React組件庫(kù)，它為你提供了大量React組件，例如按鈕、卡片等。這些組件支持桌面設(shè)備和移動(dòng)設(shè)備，并且支持個(gè)性化。
除了Belle之外，你還可以找到其他一些React組件庫(kù)，例如 React widgets或是Elemental。
React Storybook UI Development Environment
如果你不想使用其他人做的組件庫(kù)，你也可以自己做一個(gè)。你可以試試 React StoryBook，這是React組件的UI開(kāi)發(fā)環(huán)境。你可以使用它自己做互動(dòng)式組件。
React-Bootstrap整合了React和流行的 Bootstrap 3前端框架。這個(gè)工具的開(kāi)發(fā)者使用React.js重建了Bootstrap的組件。這樣做的好處是減少了代碼的重復(fù)，提高了diamante性能。
但是需要注意的是，這個(gè)repo目前還在開(kāi)發(fā)當(dāng)中，因此未來(lái)其API還將會(huì)發(fā)生變化。
React Developer Tools for Chrome
React DevTools for Chrome是以個(gè)Chrome開(kāi)發(fā)工具，開(kāi)發(fā)方為Facebook。你可以用它來(lái)查看組件架構(gòu)。你只需要在Chrome瀏覽器中添加這個(gè)擴(kuò)展就可以使用了。你也可以在Github上查看它的源代碼。
React Developer Tools for Firefox
React Developer Tools的Firefox版本。
使用這個(gè)工具，你可以讓Atom代碼編輯器也支持React。它包含代碼高亮、自動(dòng)補(bǔ)全、代碼段、HTML向JSX轉(zhuǎn)化等功能，
React.js Fundamentals – free online course
網(wǎng)絡(luò)上有很多React課程，React.js Fundamentals就是其中之一，而且完全免費(fèi)。它共有12節(jié)課，幫你了解React的基本知識(shí)和一些重要的概念。
原 文：React.js: 14 Tools & Resources for Web Developers
譯 文：SDK.cn
作 者：魯行云（編譯）
