初始react

第一次玩簡書丛肮,隨便寫寫另锋,見諒

1.React 是什么?

React 是一個聲明式锨亏,高效且靈活的用于構(gòu)建用戶界面的 JavaScript 庫炕泳。使用 React 可以將一些簡短纵诞、獨立的代碼片段組合成復(fù)雜的 UI 界面,這些代碼片段被稱作“組件”培遵。

2.為什么要用React浙芙?

使用組件化開發(fā)方式,符合現(xiàn)代Web開發(fā)的趨勢
技術(shù)成熟籽腕,社區(qū)完善嗡呼,配件齊全,適用于大型Web項目(生態(tài)系統(tǒng)健全)
由Facebook專門的團(tuán)隊維護(hù)皇耗,技術(shù)支持可靠
ReactNative - Learn once, write anywhere: Build mobile apps with React
使用方式簡單南窗,性能非常高,支持服務(wù)端渲染
React非忱陕ィ火万伤,從技術(shù)角度,可以滿足好奇心箭启,提高技術(shù)水平壕翩;從職業(yè)角度,有利于求職和晉升傅寡,有利于參與潛力大的項目

3.React中的核心概念

虛擬DOM(Virtual DOM)
Diff算法(虛擬DOM的加速器放妈,提升React性能的法寶)

3.React腳手架搭建項目

1.安裝node.js和npm
2.通過cmd執(zhí)行 node -v 和 npm -v 查看是否下載成功和下載成功后的版本號北救。


20181026095257103.png

3.安裝好的npm的源默認(rèn)是國外的源,會因為網(wǎng)絡(luò)原因?qū)е聢?zhí)行npm操作有延時芜抒,我們可以切換npm的源為淘寶的源鏡像珍策。
執(zhí)行 npm config set registry https://registry.npm.taobao.org。切換完成后宅倒,可通過 npm config get registry 查看攘宙。

20181026100411666.png

4.安裝react腳手架,cmd執(zhí)行 npm i -g create-react-app (-g為全局下載)


20181026100651469.png

5.安裝好 node 和 react腳手架后就可以創(chuàng)建項目啦拐迁,cmd切換至指定路徑蹭劈,執(zhí)行 create-react-app rproject (rproject為自定義項目名),最后出現(xiàn) happy hacking說明創(chuàng)建成功线召。


20181026101058397.png

6.如果出現(xiàn)以下報錯铺韧,是因為網(wǎng)絡(luò)原因,導(dǎo)致 npm讀取代理服務(wù)器失敗缓淹,解決辦法為1查看網(wǎng)絡(luò)狀況哈打,2將npm源路徑切換到淘寶鏡像。參照第三步讯壶。


20181026101417913.png

7.項目創(chuàng)建成功后料仗,我們可在對應(yīng)的路徑下看到項目文件。打開文件可以看到文件結(jié)構(gòu)伏蚊。


20181026101507285.png

8.啟動項目立轧。在項目所在路徑下cmd執(zhí)行 npm start。


20181026101635759.png

9.啟動成功后會自動打開瀏覽器丙挽,并出現(xiàn)react圖標(biāo)肺孵,說明項目啟動成功。


20181026101849401.png

10.安排明白了颜阐,快點練習(xí)一下吧(孤獨的豺狼)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末平窘,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子凳怨,更是在濱河造成了極大的恐慌瑰艘,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,252評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件肤舞,死亡現(xiàn)場離奇詭異紫新,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)李剖,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,886評論 3 399
  • 文/潘曉璐 我一進(jìn)店門芒率,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人篙顺,你說我怎么就攤上這事偶芍〕湓瘢” “怎么了?”我有些...
    開封第一講書人閱讀 168,814評論 0 361
  • 文/不壞的土叔 我叫張陵匪蟀,是天一觀的道長椎麦。 經(jīng)常有香客問我,道長材彪,這世上最難降的妖魔是什么观挎? 我笑而不...
    開封第一講書人閱讀 59,869評論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮段化,結(jié)果婚禮上嘁捷,老公的妹妹穿的比我還像新娘。我一直安慰自己穗泵,他們只是感情好普气,可當(dāng)我...
    茶點故事閱讀 68,888評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著佃延,像睡著了一般。 火紅的嫁衣襯著肌膚如雪夷磕。 梳的紋絲不亂的頭發(fā)上履肃,一...
    開封第一講書人閱讀 52,475評論 1 312
  • 那天,我揣著相機(jī)與錄音坐桩,去河邊找鬼尺棋。 笑死,一個胖子當(dāng)著我的面吹牛绵跷,可吹牛的內(nèi)容都是我干的膘螟。 我是一名探鬼主播,決...
    沈念sama閱讀 41,010評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼碾局,長吁一口氣:“原來是場噩夢啊……” “哼荆残!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起净当,我...
    開封第一講書人閱讀 39,924評論 0 277
  • 序言:老撾萬榮一對情侶失蹤内斯,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后像啼,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體俘闯,經(jīng)...
    沈念sama閱讀 46,469評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,552評論 3 342
  • 正文 我和宋清朗相戀三年忽冻,在試婚紗的時候發(fā)現(xiàn)自己被綠了真朗。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,680評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡僧诚,死狀恐怖遮婶,靈堂內(nèi)的尸體忽然破棺而出蝗碎,到底是詐尸還是另有隱情,我是刑警寧澤蹭睡,帶...
    沈念sama閱讀 36,362評論 5 351
  • 正文 年R本政府宣布衍菱,位于F島的核電站,受9級特大地震影響肩豁,放射性物質(zhì)發(fā)生泄漏脊串。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,037評論 3 335
  • 文/蒙蒙 一清钥、第九天 我趴在偏房一處隱蔽的房頂上張望琼锋。 院中可真熱鬧,春花似錦祟昭、人聲如沸缕坎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,519評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽谜叹。三九已至,卻和暖如春搬葬,著一層夾襖步出監(jiān)牢的瞬間荷腊,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,621評論 1 274
  • 我被黑心中介騙來泰國打工急凰, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留女仰,地道東北人。 一個月前我還...
    沈念sama閱讀 49,099評論 3 378
  • 正文 我出身青樓抡锈,卻偏偏與公主長得像疾忍,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子床三,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,691評論 2 361