站點重構那些事兒

向 Litten致謝!

濯去舊見。以來新意

距寫上一篇博客足足有兩個月了。實在是沒有臉繼續拖下去，畢竟當即就是要入職實習的人，仍是要開始找回文字的感受。而不是成天守望着防護塔和水晶了(話說你見過敵方的水晶嗎?)

說正經的。當我準備開始撰寫時看到個人personalWeb1.0 。我仍是願意去開黑的。1.0真是太挫了。這裏附幾張美照。

excuse me?
是否是有一種某校教務系統的感受。嗯，的確是不很是清真的，因此personalWeb2.0的重構很是快的定在了日程上。

不退則進

在作1.0時我考慮了很是多的兼容性。然而IE6。7，8漸行漸遠。FE們也算是熬出來了，但是個人1.0還在水深火熱之中。sh_t!

重構站點是需要你用心並高效去完畢的，因此無論是五黃的第七次總決賽之旅仍是德瑪西亞的號召，都不能成爲絆腳石。

言歸正傳，personalWeb1.0的技術棧是原生js+Jquery+express+mongodb，並且部署於阿里雲上。看得出來，這套技術棧適合小型應用。整體邏輯架構的設計比較簡易，無論是做爲Coder仍是做爲User。都能感覺到1.0簡單，但是過於簡陋的設計致使Coder本身也無力再去維護與開發新功能.....

So 2.0的首要任務是加強用戶體驗，核心思想是New!

React-* or Angular

很是多人拿React與Angular比較，這是不正確的。輕量級庫React僅僅負責view，而重量級框架Angular卻能MVC一鍋端。那爲啥我最後選用了React？緣由很是easy，因爲Angular我不會。理由不夠充分？呵呵，好吧，Angular2.0 前些日子一直 in beta。好像近期公佈正式版了，有空去研究下。

React不能和Angular比。但React的stars實在太多了。30000+相比於Angular10000+（Google又輸給了Facebook一次）。所謂人多力量大，React出現後，其附帶庫類接踵而至。react-router是典型表明。是SPA(not spa!)的路由核心。

React我就不細講了，有問題出門右轉瞭解React系。做爲博客起家的站點。2.0確定會繼承1.0的數據量，所以我需要找到一個容器來管理個人大量數據。Facebook在React出來就提出過Flux架構，當前比較好的實現是Redux。

Koa or Express

TJ還在Node社區時公佈的兩大NodeJs框架express 和 koa，express自帶大量middleware，而koa僅僅提供了一個核心函數庫。middleware可以本身開發，也可以看看koa-*。

而且koa開始使用了ES6的相關特性generator。配合babel開發，可以更高速瞭解掌握ES6語法。因此koa是大勢所趨。

Need A Girlfriend Learned Design

很是羨慕具有D2(Design and Developing)水平的FE。可他們卻沒有一個尋找A Girlfriend Learned Design的夢想。

光從設計開始想，我真的很是想使用hexo，樣式都直接寫好了。可現改hexo成本太大，最後仍是選擇了以React重構hexo ，翻了半天github上面的hexo-theme。Litten的yilia主題讓我印象深入，這纔是完美的男人! 這哥們兒還在Tencent。因而手動follow了一下。

Yilia
待會還會推出Yilia React

開發前準備

端午節3天1
react1 + react-router1 + redux1(興許推出) + koa1 + mongodb1
可愛的男孩紙*1

組件式開發

*眼下暫不使用redux，忽略reducers與actions文件夾 需要有這麼一個文件夾:

所謂組件式開發就是把web結構分區域佈局，公用部分組件或者是數據固定的展現型組件放在components中。而複合組件或者是數據會改變的組件放在containers中，containers要引入components。

./components: 基礎級組件
./containers: 容器級組件
./routes react-router路由組件

開發源代碼React Yilia
文檔等在下考完試後呈上

personalWeb2.0 == React Yilia1.0

眼下站點上還有很是多路由不通的地方，請見諒。

最近會一直保持更新，歡迎保持關注。

若你對這個主題感興趣:

Litten的Yilia地址
Sharlly用React重構的React Yilia

注:Yilia基於hexo，但是React Yilia與hexo沒有半點關係，僅僅是純粹的引入了樣式，因此數據庫鏈接仍是要靠本身無缺。小夥伴們動起手來吧！