02 React 學習筆記 基礎篇

01腳手架安裝

npm install -g create-react-app
create-react-app my-app
cd my-app 
npm run eject //將webpack配置文件暴露出來。
npm run start

npm run eject 可能會出錯，如果遇到錯誤情況老方法刪除

node_modules 文件夾 npm i

02 react基礎知識點

01JSX
JSX是一種JavaScript的語法擴展，運用於React架構中，其格式比較像是模版語言，但事實上完全是在JavaScript內部實現的。元素是構成React應用的最小單位，JSX就是用來聲明React當中的元素，React使用JSX來描述用戶界面。
JSX 是 JavaScript 的一種語法擴展，並擁有 JavaScript 的全部功能。

打開我們app.js清空頁面，調整下目錄結構(具體看倉庫)

import React from 'react';
class App extends  React.Component{
  render(){
    let name = '你好呀';
    let conter ="<span style='color:#FF0000'> 我是html </span>";
    return (
      <div className="App">
        {/* JSX語法 */}
        {name}
        {/* 輸出html標籤 */}
        <div dangerouslySetInnerHTML={{__html:conter}}></div>
      </div>
    );
  }
}

export default App;

---待續