代碼的品質 的好壞，是會嚴重影響到 後續開發 維護成本 的
而 JavaScript 又是一個十分靈活的語言，但因為其 靈活 的特性，也偷偷埋下了不少的地雷
所以我們往往在撰寫 JavaScrip 代碼的同時，會去定義一些關於 JavaScript 代碼的規範，以維持代碼的 可讀性 和減少一些 非預期 的錯誤
尤其是一整個團隊在進行開發的時候，更需要大家共同維持 代碼的規範
在前一篇文章 [React Js] JSX 與 Babel 簡介 中我們有提到關於 JSX 的作用，與使用 Babel 來編譯 JSX 的語法
這篇文章將對 JSX 的語法進行紀錄和說明：
建議在閱讀此篇文章之前，要先有些
React的觀念，並有初步對JSX有認識
JSX 主要使用於 簡化 React 的 React.createElement() 的方法，實際範例如下：
React.createElement() 寫法：
React.createComponent('h1',null,'我是標題')；
JSX 寫法：
<h1>我是標題</h1>
但是在每個 主流 瀏覽器中，是 不支援 JSX 的寫法的，讓我們繼續往下看：
組件(component) 的 狀態(state)，為 React 組件(component) 中可以自己自訂的一個物件。
當 state 這個物件有變化時，React 就會自動 重新 渲染，當前的 React Element
簡單來說當 React 偵測 到 state 的這個物件的資料有變化時，就會自動在前端上，重新
繪製當前的物件，達到更新畫面的效果
下面我們實際使用編碼來進行說明：
在之前的文章，[React Js] React 入門 ：建立 組件 ( Component ) 中有學到了如何建立一個 React 的 組件 (Component) 了，接著我們繼續來看組件中的 屬性 (props) :
在前一篇的文章，[React Js] React 入門 ：建立 組件 ( Component ) 中，我們建立了一個自己的 React 組件 (Component) ， 接下來我們更進階一點，使用 巢狀結構 來使用 React 的 組件 (Component)
在 前一篇 的 React 的入門教學 裡有提到的 React Element，而 React Element 其實就是 React 組成的元件中的 最小單位
上面的
React Element為最小單位的概念，必須要先有個認知
接著將以 組件 ( Component ) 的方式來建立 React Element 的部分進行說明：
React 入門筆記，紀錄 實際安裝 與初步 渲染 HTML 元素 的筆記紀錄 ：