Ruby on Rails 新手自學的各種血淚與經驗分享

嗨，大家今天過得好嗎？作為一名剛搞懂寫程式大概是在幹麻的新手，今天也是為了coding充滿各種煩惱：（

我是阿川在翻譯公司時的前同事，專業領域是商業與技術文件英中翻譯。跟他提到想學程式好久了，因為討生活的壓力、個人的懶散還有學習策略的失誤，到最近才稍微有一點成果。我在學習過程中因為算半個新手個性又急躁，並未完全 follow 轉個彎教室系列教材，甚至選的架構正是對自學新手而言頗有爭議的 Ruby on Rails，但在看這些教材跟阿川提到的各項補充資料時，還是獲得許多啟發。

因為之前喜歡用文字記錄旅程，剛好最近求職時人資姐姐提到「......(個人資料)越詳細越好」，於是想來記錄這趟艱辛但有趣的旅程，還有跟其他新手們分享我在過程中犯了哪些錯以及如何改進。以下觀點極為主觀，但就新手而言應該會是不錯的參考資料。

現在努力轉職中，如果有人看了這篇覺得我很有趣想把我撿去上班，非常歡迎喔~

因為想要盡可能詳細整理自己這段時間以來的想法，全文可能極長。大綱如下：

• 我目前的成果
• 我現在會的技能
• 學程式的目標
• 為什麼想學程式
• 為什麼會選擇 Ruby on Rails 生態系
• 為什麼選擇自學而不是去上課
• 我的簡歷
• 學習時間線
• 我可能犯了什麼錯
• 我可能做對了什麼事
• 學程式可能需要哪些特質，需要天份嗎?
• 學網站開發可能需要盡早掌握哪些工具

[我目前的成果] 網站作品:

• JFPCP | https://jfpcp.herokuapp.com/
  Github:
  https://github.com/nomadbard916/jfpcp

這個網站是前公司產品官網 (https://www.jumpfrompaper.com/) 的仿製品。主要想展現與學習的功能是商品陳列 (shop→first three collections only)、購物車、下訂單的過程，前端的排版並不是我想學習的重點，因此商品系列以外的靜態網頁是直接連回原站。 從這個作品中，我主要學到的知識是:

1. 怎麼配置自己順手的 Rails 環境。我現在的習慣是:
   • 前端使用 Webpacker + Vue+ Bootstrap-Sass
   • 用 Foreman 跟 Guard 做到 hot-reloading 跟 HMR (hot module replacement)
   • 資料庫一開始是用 SQLite，現在會盡量用 PostgreSQL。
2. wireframing 跟網站架構設計，喜歡清單、圖表跟 user story 並行
3. Rails 整個開發流程跑過一遍，包含部署到 Heroku
4. 基本的 Bootstrap 排版，版面盡量使用 container
5. 購物車類型網站的大致流程
6. JS的基本應用，還有如何發 ajax request

• TaskMaster | https://taskmaster9527.herokuapp.com/
  Github: https://github.com/nomadbard916/taskmaster

任務管理網站。主要功能是記錄任務各項資料 (包含內容、時限、狀態、優先度、完成時間等) 、幫任務加標籤、會員與會員管理、搜尋(可依任務內容與標籤)等。因為上一個網站的前端有其範本，架構跟商業邏輯也只要照抄就好，這個網站我想在有限的提示下自己進行設計。從這個作品中，我主要學到的知識是:

1. 會員登入
   前一個作品為求簡便，只以email進行訂單查詢；因為設計品的回購率相對較低，需要記錄的會員資料相對較少，這麼做雖然便宜行事但應該實務上也不太會有問題。到了這個作品就主要用 session 作為會員機制。為求快速方便只以明碼傳密碼，若要實做應該會加上 bcrypt。
2. 用 Ruby 搭配SQL query簡單實做了搜尋功能。
3. 更熟悉 model 間的關聯，應已熟練掌握CRUD
4. Linux開始上手
   在前一個專案期間因為防火牆設定問題，還有自己的不熟練，開發用系統頻頻出問題。到這個專案時已經能夠妥善駕馭 Linux。
5. 部落格類型網站的大致流程

[我現在會的技能]

• Ruby on Rails
  會使用 PostegreSQL。前端會搭配 Webpacker跟 Bootstrap-sass。
• 基本的 Ruby，絕大部份都跟 Rails 綁在一起
• HTML & CSS & Bootstrap
  除了 erb (Rails 預設的模板引擎)之外不喜歡其他模板引擎，覺得 emmet 就很方便了，而且用其他模板引擎的話不知道怎麼跟前端配合? CSS 部份都是用 SCSS，Bootstrap 的使用佔了 99%。
• 基本的 Javascript
  僅限網站前端應用。 摸過一點點 Node.js，但覺得其後端生態系太不貼心了，直接棄坑。 哪天想要用來寫API時可能會試試看Node.js，但更有可能用 Python 來寫。 暫時不想學 jquery，個人認為是即將滅絕的技術，但工作上若是要求效率的話也只好用了。
• 一點點 Vue.js
  覺得其理念簡潔優雅，但目前因為不熟悉特性怕會打亂 Rails 的行為，還不敢在作品中應用。
• Linux (Ubuntu) 基本應用
  完全不害怕文字介面，為了提升生產力還去摸了 ZSH 跟 Postman 等工具。
• 基本的 Git & Github 喜歡做一點點就 commit 讓格子變得很好看
• 開發環境: Windows 10 + WSL (Ubuntu 16.04) Visual Studio Code

[學程式的目標]
成為網路後端工程師。
想要用數位行銷跟資料分析作為加分技能。
喜歡使用簡潔漂亮並而且邏輯經過精心設計的網站 (eg. Pinkoi)，但對自己動手做視覺規畫非常不耐煩， 所以可以做一點點前端但不喜歡主要做前端。

[為什麼想學程式 (網站後端)]
如果我說是小時候的夢想，會不會太矯情XD
在翻譯業磨光熱情後，覺得自己既然已經證明可以在社會上存活了， 是時候思考人生的下一步，應該要試著追尋看看自己的"夢想"， 實驗失敗的話大不了做翻譯一輩子了。
在被寫程式密集折磨了兩三個月之後，確定自己果然很喜歡規劃程式架構跟解決問題的感覺，而不只是小時候的幻想而已。

選擇網站後端其實算是求職考量之一。因為網路領域入門門檻相對較低，職缺數相對較多，對非本科系來說相對有利；而想選擇後端是因為喜歡抽象思考，對前端要自己實做各種視覺效果感到很不耐煩。若是程式技能再跟我原有的行銷知識搭配，會二轉成前景無限驚人的「成長駭客」。因此以後可能會想嘗試看看資料分析領域，但得等到我的後端技能穩定之後了。

[為什麼選擇 Ruby on Rails 生態系]
因為潮(X) 因為理念跟設計哲學(O)
現在好像JS生態系更潮了而且職缺多非常多，但在實際接觸過之後，並沒有讓我想往JS生態系靠攏。
其實當初有考慮過 Python，但因為台灣的 Python 後端職缺太少，覺得還是選 Ruby on Rails 好了。
而且 Ruby 的開發理念是讓人開心寫程式，寫起來又「像說話一樣」，非常吸引喜歡文字的小文青。

[為什麼選擇自學而沒有去上課]
因為沒錢 (X)
因為對自己的自學能力、電腦基本知識跟英文能力有絕對的自信，這行也需要證明自學能力 (O)

[我的簡歷]

• 高中時因為大家都覺得男生就是該選自然組，就跟著選了，但對念書毫無興趣，整天不是在看自己的書就是在念英文。對了還有搖滾樂。
• 考大學時完全不知道自己的天賦與熱情在哪，對所有專業都沒有興趣，甚至覺得人生完全沒有意義。雖然小時候喜歡電腦，但當時身邊的人都覺得研究電腦是沒出息的事，我也覺得自己不可能有這方面的天份，就沒有想過這條路。當時恩師說我可能會是比郭台銘更厲害的商人，而且考財金系蔚為潮流，就覺得靠財金系或商管學院(不含資管系，因為誤信某雜誌說資管系半資半管，根本沒專業可言)擠進排名前面的大學好了。結果因為英文太強數學太爛而考進了英文系。這完全是意外。
• 雖然喜歡看書，但不曾思考過文學理論，也沒有讀長篇英文文章的經驗，因此進了英國語文學系痛苦萬分。後來才知道英文系給我的語言與邏輯訓練是「因禍得福」，還因此成為終極考試機器，多益拿到985分。
• 大三時因為想找打工又討厭排班被綁死時間，意外進了台中某家翻譯社，也算是有了人生第一個專業能力跟遠距工作經驗，一直做到前陣子才辭職。
• 雖然有了專業能力，但還是覺得這不是一生志業。大三時轉系到財政系，算是會計與經濟的結合，修了很多企管系的課 (以行銷為主)，行銷理論則是靠大量閱讀經典作品還有參加商業競賽(YEF)來學習，準備進可攻(考研究所)退可守(進公司)。
• 直到畢業前進了公司實習，才發現業務太帥了太有趣了，而且是高階主管跟老闆的養成班，決定退伍後就善用英文能力當國外業務吧。實習期間學到真正的品牌管理是怎麼一回事。
• 但因為沒有業務實務經驗，人資可能也覺得我性格太內向，於是沒有幾家公司願意讓我當業務。唯一一家願意給我機會的公司，在進去後才發現理念不合，在三個月內就離職了。
• 於是只好回去當翻譯，剛好因為工時相對較低，可以同時專心弄音樂。
• 2015年左右注意到 Ruby on Rails，發現寫程式好像比以前有趣很多而且更貼近人性，覺得很有興趣。但因為收入不穩擔心會餓死，又覺得音樂比較有趣，便沒有很專心在學習。
• 直到2018年下半有點儲蓄，剛好對翻譯的熱情也完全消失了，決定辭職專心學coding。

[學習時間線]

• 2018年7月之前: 非常漫長，斷斷續續碰了不少東西。我的學習習慣是:先掌握整體概念並記憶大致流程 (大致上會接近 xdite 提倡的「肌肉學習」，我現在認為這個做法有利有弊就是了)，再依照需求慢慢搞懂原理，最後才是依照原理舉一反三。但因為我之前工作很耗費腦力，又想要專心玩音樂，因此這個階段一直都停在學習的第一步驟，只是照著打程式碼而已，以為這樣自然就會懂原理，到實做時才發現自己原來什麼都不會覺得萬分痛苦。好啦都是藉口。還是感謝前輩們一直提醒要盡快做專案。

• 跟朋友講好要一起學程式，他選了 Python 而我選了 Ruby (on Rails)，並且要 share Treehouse 的帳號。結果他事業做比我大，剩我在學。

• Treehouse 的 Ruby & Rails path 跑完後，覺得可以盡快模仿高手作品從中學習，於是選了相當於 RoR 界聖經的《Agile Web Development with Rails》跟《Rails Tutorial by Michael Hartl》，想要邊照著打程式碼邊學習。

• 期間想要增加自己的基本知識，把阿川推薦的「深入淺出」系列 (http://blog.turn.tw/?p=2854) 當課外書幾乎都讀完了。雖然似懂非懂也不求甚解，但還是很喜歡。
  讀到《深入淺出PHP&MySQL》跟《深入淺出Python》時，因為對Ruby語法已經有一點點概念了，開始能夠對不同語言進行比較並覺得有趣，雖然就像是會了日語的初階生活會話就拿來跟中文比較的感覺一樣。最近因為實做需要，正在讀《深入淺出SQL》，也才真的大致領略其中內容。

• 雖然有了教材可以循序漸進，但並不認真，程式碼都是複製貼上或照著打而已。前端不想搞懂，測試更是全部跳過。還好至少還有因為使用 Cloud9 這個線上IDE，而大致了解 Linux 跟編輯器的使用方式。

• 曾參加業界大大帶的 Ruby on Rails 讀書會。但因為太菜又沒有認真練習，基本上就是一直在旁邊傻笑，還有潛移默化大大們的思考方式。

• 2018 年7月~10月

  • 想起學程式最快的方法是做專案，或許可以仿效當時 Rails 界很紅的一篇文章「12 in 12 Challenge」( https://www.inside.com.tw/article/4321-how-i-finally-learned-to-build-stuff-with-rails )。
    因為原作者的影片並無字幕怕學習效果不好，於是在Udemy上買了相近的課程《8 Beautiful Ruby on Rails Apps in 30 Days》(課程已不再更新)，跟著照做了八個網站。基本上還是照著打程式碼，但至少有分析過每個步驟了。
  • 但因為翻譯工作進入大旺季，為了多賺點錢，學習還是不認真。

• 2018 年 10 月~12月

  • 終於存了點錢，而且覺得照這個步調永遠都無法轉職成功，於是把幾乎所有翻譯工作都辭了，準備破釜沉舟專心學習。
  • 聽說當時 Node.js 生態系是大熱門。身為非本科系半路出家，為了提升轉職成功率，花了一個月的時間看線上課程，想嘗試由 Node.js 從頭入門，剛好同時學習Javascript。上完 Wes Bos 的課程後，覺得不喜歡 Node 生態系拼湊各個小組件來做事的理念，又想要快點做出作品，覺得還是重回已經有基礎的 Rails 生態系好了。
  • 期間認真打好前端的基礎，包含真正搞懂 html、CSS跟JS的基礎知識。但在實做時為求簡便，使用的大多還是Bootstrap。
  • 為了在前端多一項工具，以便實現更多網站效果，同時還學了 Vue.js 的基礎，應用時可能有用到 ajax 跟資料即時更新就好。
  • 開始規劃要做什麼專案。雖然有家心儀的公司在徵才條件中寫到「請說明用技術解決問題的經驗」，但我現在寫程式本身就是一個大問題，還是做比較有把握的作品好了，用到演算法、資料庫複雜查詢或複雜程式邏輯等還是之後再說。於是決定先模仿前公司產品的官網。
  • 想要用更高的彈性來自訂環境，於是想買新筆電。覺得 Macbook 的CP值太低，又因為使用過 Cloud9，對 Linux 稍有自信 (其實這個服務本身就是沒有視覺介面的Linux)，查過資料後認為 Windows 的Linux子系統應可滿足寫程式的大部份需求，所以買了 Windows 10 筆電。結果是痛苦的開始。

• 2019年

  • 開始實做 JFPCP 網站。期間發現自己其實什麼都不懂，在不斷的 Google 中感到痛苦萬分。尤其 Linux 子系統一直無故崩潰，更是雪上加霜。後來才發現一切電腦問題都是因為防毒軟體跟防火牆的關係，問題排除後反而讓我對搭建環境信心大增。
  • 因為選擇將實做範圍限縮在雖未做過但有把握的部份，而暫時捨棄進階功能 (如串接 Paypal)，專案在一個半月左右慢慢完成了。
  • 但第一個專案等於有人幫忙規劃好架構了，想要再做一個專案來確認自己的能力。在從各方收集資料後，決定實做 TaskMaster 並將功能限縮到最基本的發文、改狀態、加標籤、會員、管理員以及搜尋。最後在五天的時間內完成。
  • 現在我已完全做好應徵 junior Rails developer 的準備。

[我可能犯了什麼錯]

• 一次想抓住太多知識點
  Ruby on Rails 是相當萬能且快速的框架，但也正是因為如此而不適合自學新手。用了 Rails，你需要馬上知道的東西有:

  • MVC 是什麼
  • 資料夾架構長什麼樣子
  • 資料庫大概要怎麼設計，miration 要怎麼做
  • 要怎麼用 command line 來控制 Rails
  • Rails 的特殊 HTML 語法要怎麼寫

  我以為跟著課本的流程做過一遍，流程中自然能夠體會各個小工具是在做什麼；但只要我想做的事情跟課本描述的稍有不同，就完全傻住了，更不用說是一次要理解這麼大量的資訊量，本來就是很困難的事。不少 Rails 新手應該就是因為從初學到看到成果的時間太長，要修正又不知道從何修正起，以為自己沒天份就此放棄的。
  當然，若是在學習 Rails 的過程中，有人能夠帶你並且逐一講解寫程式背後的邏輯、分項講解各項工具、為什麼哪個流程要做哪些事的前因後果等等資訊，那一開始就用框架可能未嘗不可，但對新手來說最好的學習方式，會是先做個簡單東西的雛型，然後再慢慢把它越做越漂亮，功能越加越多；學游泳也是要先會水母漂，一次就想學會自由式的換手換腳換氣轉身，是會什麼都學不好的。

• 在未經過導師規劃的情況下，自行跳躍式學習
  就拿「把資料寫進資料庫」這件事情來說吧。感覺好像蠻簡單的，實際上要做的事情至少有: 下指令找出是哪一筆資料→對資料進行處理→把資料丟進資料庫，還有注意資料本身的性質跟每筆資料彼此的影響→思考資料寫入成功之後要做什麼事→要是資料寫入失敗要做什麼事...等等。光是要找到資料的方法可能就有三種，而我以為只要用其中一種就可以了卻沒想過原理，照著課本打了之後可能會發現怎麼樣都撈不出我要的資料，查了好幾小時才想起來我用的是錯的方法。後面的步驟更不用說，可能連失敗的地方都不知道，更不用說是修正錯誤後回到錯誤的方法了。
• 沒有在學會一個東西後，馬上練習做出一點小成果來驗證學習成果
  因為我覺得大部份的課本習題都很無趣而且沒有難度，應該看著課本照打一遍就可以了。累積到最後就是各個細節間要串接時頻頻崩潰，還找不到哪個步驟做錯了。

[我可能做對了什麼事]

• 目標明確
  我很確定自己就是想當後端工程師，前端的東西只要碰一點點就可以了，一些進階工具也在問過工程師友人後覺得可以稍後再學就好，先交出成果比較重要。例如在了解CSS的原理後，決定大部份排版都用 Bootstrap，一樣能夠達到我想要的效果而且效率很高。還有我雖然很認同做測試是一件重要的事，但初期網站先會動就好，反正因為是小網站，我手動測的成本還不算太高，自動測試會寫到一些多此一舉的程式碼；而且我需要學的東西已經很多了，再多學一個測試只是在搬石頭砸自己的腳。
• 盡量用英文學習
  對某些新手來說，可能會覺得要學新東西已經很辛苦了，再用英文學不是更辛苦? 我同意在學觀念時可以看中文課本，但是要對工具的進行延伸應用時，你會發現英文資源的平均品質與數量遠超過中文，甚至遠超過簡體中文，即便對岸的文章數量看起來很龐大，但值得參考的文章總數可能不太多。我自己是習慣看原文書了，雖然可以的話我也想從頭到尾都看中文，但很多觀念真的都是看英文才恍然大悟，看中文文章只有越來越霧裡看花而已。
• 分析各個步驟之間的關聯
  我在做 Udemy 的《8 Beautiful Apps》課程時，雖然還是急著想把整個過程跑過一遍，但為了之後能夠方便複習，還是把各個步驟做了哪些事詳實地記錄下來。之後又把這些步驟一般化為 Rails 開發的公式，在製作自己的專案時就能夠依照步驟按步就班進行，就算在哪邊卡住了，排除問題後也能夠很快地回想起下個步驟該做什麼事。

[所以學程式可能需要哪些特質，需要天份嗎?]
我完全同意阿川: 不需要天份。只需要喜歡解決問題，掌握解決問題的思路跟方法就好。
http://blog.turn.tw/?p=2683

甚至有業界講師認為，只要你會煮飯，就一定會寫程式。 當然只是舉例啦，不會煮飯也沒關係的。
https://www.udemy.com/if-you-can-cook-you-can-code/

我在學習過程中，體會到對學程式有幫助的特質有:

• 英文能力
  當然不需要到讀原文書毫無障礙的程度，但至少你在看到 Stackoverflow 時，不會下意識想要閃躲。如前面所說的，真正高品質的學習資源絕大多數都是英文，英文讀寫的能力會影響優質資源的取得量，進而影響成長的速度。
  • 喜歡思考問題與解決問題
    寫程式本身其實就是「解決問題」的過程。無論是在安裝工具、使用套件、實際寫程式、進行測試到正式上線的各個流程當中，一定都充滿了各種問題需要加以思考解決，要不面對問題是不可能的。
  • 習慣分解事物後一點一點最佳化的心態
    寫一個程式可能會包含很多個小細節，例如網站就粗分前後端，進而分成 html、CSS、Javascript、資料庫、網路、伺服器等部份。以人腦的運作方式來說，要一次就全部弄懂當然是不可能的，但可以把一件事物分解成方便理解的最小單位，再一步步調整這些小單位，進而就能成就好的成果。文學界有一句話說 "There's no good writing, only good rewriting"。即便是大師之作，一開始也是先做出大部份的雛形後，再一點一點慢慢修細節的。
    也就是所謂的「刻意練習」。
  • 實驗精神與好奇心
    在學會一個東西之後，要馬上想像它可能有什麼樣的應用，進而動手做一個試驗品出來，哪怕做出來的東西再醜都沒關係，事後再修正就好。心有餘力的話要盡量弄懂背後的原理，才能舉一反三進行應用。
  • 不怕失敗，甚至喜歡盡速發現失敗後盡速修正
    就算是老手，面對錯誤畫面也是常見的事，有時甚至要先出錯才能改善程式碼。想想學生時代，算數學也不見得會一次就算對吧，但稍微想過之後盡快開始驗證想法，會是最有可能解出答案的方式。
    以上這兩點簡單來說就是「大膽假設小心求證」跟PDCA啦。

當然如果你的數學非常強 (算是天份的一部份吧)，那會讓你在演算法，特別是機器學習跟AI領域有機會成為世界級的工程師。但對於大部份的程式工作而言，很多演算法與程式邏輯可能都有人寫成現成的工具了，只要有尚可的邏輯能力能夠加以應用就好，也就是能夠清楚掌握一個行為的前因後果，其他的入行後想再加強可能都是來得及的。

[學網站開發可能需要盡早掌握哪些工具]

• 草稿工具跟流程圖
  我立志當後端，但覺得整體而言最有幫助的工具之一竟然屬於前端XD 寫程式的過程中若是沒有明確的視覺圖形作參考，很容易在抽象的思緒中迷失。因此我在列出專案的各項功能後，要開始實做前一定會先畫草稿，來模擬最終成果大概會是什麼樣子。程式功能的流程圖則是能夠讓你容易掌握各項功能之間的關係。畫錯了沒關係，反正之後再修改就好了。
  因此，先掌握 HTML跟CSS會是比較好的網站開發學習方式，因為你能夠盡快看到網站的雛形。想要它怎麼動，就先用文字描述或其他工具記錄在旁邊就好，之後等學會後端語言或 Javascript 再補起來。先學後端語言的問題是都是在跟文字 (如 command line) 互動，要看到明確視覺化呈現的東西需要比較長的時間，在那之前興致可能都先冷掉了。
• Google 與發問的技巧
  若你使用的工具不算太冷門，其實只要抓對關鍵字，絕大部份都能夠在 Google 上面找到答案；有些人會因此戲稱自己是 Google 工程師XD。而且工程師會面對的問題，很多時候可能連自己的同事都沒有碰過，因此更需要自己設法按照邏輯來思考與解決問題。以「良好的」方式提出問題，能夠幫助別人更明白你的徵結點，進而快速找出解決方案；工程師通常不喜歡別人提出未經思考的問題。
  關於如何發問，補充資料請見以下連結:
  https://ryanhanwu.gitbooks.io/how-to-ask-questions-the-smart-way/
• 看記錄
  我一開始其實不知道資料庫出錯要去哪邊修正。Rails 雖然有著名的紅色畫面，但它顯示的是程式運作的結果，即 Rails 本身哪裡設定錯誤或邏輯有問題，但若是對資料庫相關的東西有問題，我一開始是不知道怎麼修正的，所以才會在三種查詢方法那邊鬼打牆。後來我發現 Rails 伺服器跟資料庫的運作過程其實都會顯示在終端機中，可以從中找出 Rails 背後做了哪些事情，進而修正問題。至於前端，一定都很習慣先看 console log 了，邏輯是一樣的。
• git 大家應該都有玩過單機遊戲吧? 雖然現在是手遊的年代了...
  在打王之前，一定會先存檔，就算滅團了還可以讀取進度再來一次； 或者要是你對王噴的寶物感到不滿意，還可以讀檔再洗一次寶物。
  對新手來說，每打一行程式碼就像是在打王一樣，
  而 git 正是可以讓你穿梭在不同程式碼狀態間的神秘果。

以上是這個階段的心得，什麼都想講但又怕寫太多，畢竟這是個對長篇文字沒耐心的時代@@
還有哪些方面好奇的話，歡迎提出來跟大家一起分享~