入門(mén)react最簡(jiǎn)單的方法是使用react的示例代碼。你可以在CodePen這個(gè)網(wǎng)站上在線編輯運(yùn)行,這樣你不需要安裝任何東西,你需要做的僅僅是在瀏覽的另一個(gè)窗口打開(kāi)這個(gè)網(wǎng)站,然后按照本教程的示例代碼一步一步在線運(yùn)行。如果你想將它運(yùn)行在本地的開(kāi)發(fā)環(huán)境中,點(diǎn)擊這個(gè)網(wǎng)站安裝:安裝。
一個(gè)最簡(jiǎn)單的react例子是下面這樣的:
ReactDom.render(
<h1>Hello World!</h1>
document.getElementById('root')
);
它渲染了一個(gè)名為“Hello World”的頭部欄在頁(yè)面上。
接下來(lái)的章節(jié)會(huì)一步一步的向你介紹如何使用react。我們將花時(shí)間讓你理解組件化的編程思想,一旦當(dāng)你掌握了elements和components,你就可以在適合的環(huán)境中用它們構(gòu)建復(fù)雜的應(yīng)用。
關(guān)于Javascript的一些注解
react是javascript的庫(kù),所以我們假定你有對(duì)javascript有一個(gè)基本的理解,如果你對(duì)自己的javascript感到不是很自信的話,我們建議你刷新一下你的javascript知識(shí),這樣你就可以更好的掌握后面的章節(jié)。
在后面的代示例中,我們會(huì)使用一些一些ES6的語(yǔ)法。我們盡量有節(jié)制的使用它,畢竟相對(duì)來(lái)說(shuō)它還是比較新的語(yǔ)法。但是我們鼓勵(lì)你對(duì)尖頭函數(shù),template語(yǔ)法,let,const有一個(gè)熟悉的認(rèn)識(shí)。你可以利用Babel REPL去檢查你的ES6語(yǔ)法是否正確。
關(guān)于ES6我推薦你刷一遍阮一峰老師寫(xiě)的《ES6標(biāo)準(zhǔn)入門(mén)第二版》,這樣對(duì)于ES6就基本無(wú)所畏懼了??。