上一節(jié)，我們把從官網(wǎng)下載下來的React demo 啟動(dòng)起來了，但很多小伙伴碰到react還是感到很懵，不知從何下手，沒事冒出個(gè)app.js，到底干嘛用的。剛下載下來的demo也不符合我們的真是項(xiàng)目開發(fā)思路，總之一句話，很狗屎。這一節(jié)，我來將demo的目錄結(jié)構(gòu)改變一下，然后做出一個(gè)簡(jiǎn)單的hello world實(shí)例，同時(shí)包含樣式引用。

import 是react的es6使用，就像我們?cè)陧撁嬷杏媚菢?，但為了適應(yīng)時(shí)代的發(fā)展，讓自己更好的走前端這條路，更好的學(xué)會(huì)react這個(gè)狗屎一樣的框架，我們以后將更多的使用import來引入js以及css文件；

ReactDOM是react的方法類，我們用他的render方法來創(chuàng)建一個(gè)h1標(biāo)簽，含有hello world內(nèi)容，然后渲染到id是root的div中，如果你心里對(duì)自己說：沒看懂。那么你就多照著敲幾遍，接下來看一下頁面，如圖：

3、接下來我們?yōu)檫@個(gè)demo添加樣式，還是那條原則，盡量少寫行內(nèi)樣式，寫自己的css文件。這個(gè)時(shí)候我們?cè)?src文件夾下的css文件夾下創(chuàng)建demo.css，寫入css樣式如圖：

怎么樣，至今是不是覺得天也是晴的，雨也是停的，自己也還是很行的呢？

4、引入這個(gè)demo.css。還是那個(gè)原則，不要想著在頁面里通過標(biāo)簽引入文件了，要經(jīng)常記得import這個(gè)關(guān)鍵字，要用熟練，用習(xí)慣，打開剛才的index.js然后引入，如圖：

5、看一眼我們的成果，如圖：

好啦，這一節(jié)我們通過以往自己的知識(shí)結(jié)構(gòu)創(chuàng)建了css img js等文件夾，看到了入口index.html和入口index.js文件，我們引入了自己的樣式?；A(chǔ)就這么多，看到有es6的東西及時(shí)去查，或者照著demo多敲幾遍記熟了。

下一節(jié)我們開始做真正的屬于自己的第一個(gè)React小項(xiàng)目，喜歡的小伙伴關(guān)注下一節(jié)：狗屎一樣的React（第三節(jié)，創(chuàng)建app頂部標(biāo)題欄）