上一期我們使用了React官方的腳手架運行React應用。大家可能會覺得這種方法很繁瑣，需要配置各種第三方插件。JQuery時代的前端真是讓人懷念。這一期，我就帶領大家創建一個“懷舊版”的React應用。
一. 文件結構一覽
這次項目的文件結構相當簡單，一個index.html和scripts文件夾。在scripts放着必要的文件babel.min.js、react.development.js、react-dom.development.js。值得注意的是react提供了development和production兩種模式下的js文件。他們分別代表用於開發環境和生產環境。
在scripts文件夾內添加完這三個文件之后，我們在index.html輸入一下幾行代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Hello World</title>
<script src="scripts/react.development.js"></script>
<script src="scripts/react-dom.development.js"></script>
<script src="scripts/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('root')
);
</script>
</body>
</html>
其中<script type="text/babel">是第二代javascript編譯器，用於將ES6的新一代語法轉化成為ES5現在版本瀏覽器可以執行的語言。想要深入了解請見：[傳送門]
二. 如何獲取相關文件：
在React官網提供了CDN連接服務，想要直接使用請看該鏈接
三. 總結
這一期《五分鍾學習React》我們講了：
- 在頁面中直接引入React框架，需要三個文件react、react-dom和babel。
- babel文件的作用，用來將ES6語法轉義成為ES5的現有瀏覽器可執行文件。當然這里是直接編譯JSX。
下一期，我們准備講解一下JSX，大家盡情期待！