什麼是react?
react是facebook公司開發的乙個前端框架,是目前三大前端框架之一(react, angular, vue),元件化開發web與傳統web開發專案,確實絲滑很多,它有三大特點
宣告式 - 你只需要專注於描述你的ui,react會幫你做底層更新
元件化 - 所有ui都抽象成元件,大大提高可重用性
除此之外,react是基於node的一種虛擬dom(fiber)的框架,在後續的章節中,會有原始碼分析,敬請期待。。。
環境搭建:
node:
npx要求npm在版本5.2以上!
一番等待後,就可以看到當前目錄下乙個新的資料夾生成啦!接下來就是啟動專案了
npm start
這樣,你的第乙個react就啟動了!
讓我們一步一步看發生了什麼
public/index.html
在上面的檔案裡,我們定義了乙個程式的掛載點,我們寫的**,最終都會被react轉換成相應的dom結點,然後插入到這個掛載點上,那麼我們的**是在**被掛載的呢?
src/index.js
reactdom.render就是負責把**掛到掛載點,可以看到它接收兩個引數,第乙個是我們寫的react元件**,第二個就是掛載點,它是怎麼掛載的呢?就有點類似與這樣:
const root = document.getelementbyid('root');
這樣我們的**就被掛載到相應的掛載點上了。
接下來看看,我們的**,是怎麼變成相應的dom結點的,
render() }
我大致會出4個系列:
react初始教程系列
react專案實戰系列
深入了解react系列
react原始碼分析系列
react開發教程(十)redux結合react
redux 和 react 之間沒有關係。redux 可以搭配 react angular 甚至純 js。但是 redux 還是比較適合和 react 搭配的,因為 react 允許你以 state 的形式來描述介面,而 redux 非常擅長控制 state 的變化。redux 和 react 的結...
react系列教程
這個系列將從基礎語法講起,把react全家桶都講到,然後到具體的使用,最後完成後,會寫乙個完整的demo。目前已經完成的內容 react系列 零 安裝 react系列 一 jsx語法 元件概念 生命週期介紹 react系列 二 高階元件 hoc react系列 三 元件間通訊 react系列 四 r...
CMake系列教程1 初始CMake
cmake 是乙個跨平台的安裝 編譯 工具,可以用簡單 統一的語句來描述所有平台的安裝或編譯過程。能夠輸出不同編譯器的 makefile 或 project 檔案。cmake 的使用 cmakelists.txt 作為專案組織檔案,cmake 並非跨平台編譯工具,而是專案構建工具,可以在不同的平台上...