React框架已經(jīng)火了好長一段時間了，再不學(xué)就out了！

對React還沒有了解的同學(xué)可以看看我之前的一篇文章，可以快速簡單的認識一下React。React入門最好的實例－TodoList

自己從開始接觸react一竅不通，到慢慢的似懂非懂，通過各種途徑學(xué)習(xí)也有一陣了。學(xué)習(xí)過程中還會接觸到很多新的東西，比如ES6、webpack，過程艱辛誰人懂，見坑填坑慢慢來。今天把學(xué)習(xí)過程過濾了一下，只說項目實際需要用的東西，總結(jié)了一套能看到的東西，分享給大家，希望能讓讀者少踩一些坑！

本文看點

• 實際項目效果：最終你只需要在本地啟一個服務(wù)，就能看到運行效果。
• webpack的配置：項目實戰(zhàn)中常用的插件和配置方法。
• React用法：React在MVC（模型Model－視圖View－控制器Controller）層面上主要扮演了視圖的作用。我們可以學(xué)習(xí)它在項目中到底該如何使用。
• React-router配置：單頁面應(yīng)用（SPA）離不開路由，我們可以學(xué)習(xí)在項目中React-router如何配置。
• ES6語法：我們會用到一些在項目中常見的ES6語法。
• antd的使用：螞蟻金服出的一款基于React的框架，我們可以學(xué)習(xí)如何去使用。

項目效果

項目代碼已經(jīng)上傳至github，項目代碼github地址。大家把代碼下載下來之后，跟隨以下步驟即可在本地看到效果。

• 首先安裝node環(huán)境。

• 全局安裝webpack

  npm install webpack -g

• 安裝項目依賴

  npm install

• 開發(fā)模式，啟動本地服務(wù)

  npm run dev

  至這一步成功后，在瀏覽器輸入localhost:8888就能看到如下圖的效果了。