bootstrap學習筆記

這篇文是看了這個教學的心得。
https://launchschool.com/blog/integrating-rails-and-bootstrap-part-1/

之前我雖然也用過bootstrap的gem，但是還是不甚了了。搜尋網路包括官網，仍然看不太懂，最後篩選出最好的學習資料，就是這上面的連結。我把學習記錄放在這篇blog文。

要了解bootstrap，要從html說起。html是在做什麼的呢？在實際寫code時，html做的就是處理超連結、文字格式、段落表格這些事。但是它的問題在於一下就會寫得很多很長很雜亂，於是產生CSS。CSS 可以把html的敍述／程式簡化，詳細內容放到另一個檔案裡。

後來又生出CSS preprocessor，CSS 的預處理器，也就是讓你可以寫出更簡化的code，預處理器再幫你轉成CSS。比如常聽到SASS和LESS、SCSS。

有沒有好像地質學的感覺？一層一層的。

bootstrap是由LESS寫成的預處理器。它提供很多模版，也就是它提供很多CSS的樣式。所以也可以理解成，bootstrap有各種做好的CSS模版。（運作流程大致是這樣：簡化的寫法 -> CSS preprocessor/bootstrap -> CSS ）

既然是html和CSS 就不可能太複雜，因為html和CSS 都只是一條一條敍述對應的關係，不涉及程式流程control flow的問題。只是會很多行而已。

但即使如此也會有個架構，launchschool的教學文就要說明這個架構－以SASS為主（為何不是LESS它有說明）。閱讀成果是看得懂Rails裡的bootstrap／SASS 的架構。


我跟著這個教學做出的程式碼放在這裡：
https://github.com/Lee-KangChen/bootstrap_ex


看完這個教學，之後就可以去bootstrap捉元件來用了：
http://getbootstrap.com/components/

我開始做「12 in 12 Challenge」

為了在Ruby on Rails 上成長我決定跟著這個做：

「12 in 12 Challenge」
http://www.inside.com.tw/2015/01/27/how-i-finally-learned-to-build-stuff-with-rails

原文：
https://mackenziechild.me/12-in-12


目前做到第三個。

我做的第一個：
https://github.com/Lee-KangChen/week_1_reddit

第二個：
https://github.com/Lee-KangChen/week_2_blog


理論上，當你跟隨github上的commit上，一個個commit的做，你也可以完成同樣的程式app。

但是問題是，github上的commit不會顯示出原作者在termial終端機上做了什麼動作，如果沒有經驗，你也難以知道哪一段程式是系統生出來的、哪一段是原作者寫的。

如果你不小心更動了Gemfile.lock或者schema檔，那顯然是不太妙。

所以教學有影片是蠻必要的，讓人知道終端機上發生了什麼事。


我隨著他做到現在的心得是，因為他是做設計出來的，所以做法沒那麼學院，比如說他不是從資料庫的建構、資料表的關聯打基礎開始。這樣東西會做出來，會後續可能比較麻煩。


但這樣的教學和分享的態度還是不錯的。

跟著做除了複習Rails的架構，還學習到一些gem的用法，算是不錯。

學習就是這樣，你要做過才知道學到什麼。