跳到主要內容

十分鐘理解何謂「網頁開發軟體工程師」

by Vanessa Wang   歡迎支持我的臉書專頁：【工程師作家的轉職人生】


上週有個朋友打電話給我，說她認真考慮跟我一樣轉行當軟體工程師，想要多理解我的工作內容。

很多人想要學寫 code，但未必知道會寫 code 以後能夠做什麼、有哪些工作選擇。這篇我想以淺顯的方式講解所謂的 web developer （網頁開發工程師）的工作內容到底是什麼。

首先說明一下，coding 相關的職業非常多：你可以寫手機的 app、寫網頁、開發人工智能、做金融業的預測模型、做機器人（包含工廠用來大量生產各種產品的機器）、開發自動駕駛技術等等等。太多了。程式語言存在的目的就是做自動化、減少人工作業時間，所以運用的範圍無遠弗屆。

這篇要講的只是這其中的一種職業，那就是 web developer，因為這是我現在做的，也是許多非本行的人學會寫程式語言後第一個會考慮的職業。網頁開發工程師，顧名思義就是寫網頁的人；仔細想想，現在世界上任何產品、公司都有網頁，因此網頁開發工程師的職缺非常多，再加上這是 coding 相關職業中入門門檻較低的選擇，因此市面上的「軟體工程師速成班」（coding bootcamps）大部分也都是教網頁開發。

網頁開發又分成前端工程師及後端工程師，我做的是前端。那我們的工作內容到底是什麼呢？

我們都在網站上買過東西。舉個例，當你在 Amazon 上買一件毛衣的時候，你會看到毛衣的照片、看到價格、看到尺寸... 使用者看得到的這一切，都是前端工程師用 code 寫出來的。當你選擇衣服尺寸的時候，你會看到只剩下 Large，Medium 跟 Small 都沒有了。讓使用者看到剩下哪些尺碼、讓那些已經缺貨的尺碼變成不能夠選取的狀態、讓使用者在沒有選擇尺碼前不能按下一頁結帳... 凡跟使用者介面相關的東西，都是前端工程師的責任。

至於網頁上字體要多大、怎麼排版比較好看這種事，通常就有另外的 「網頁設計師」負責設計美感。工程師主要是處理邏輯的部分，像是使用者按哪一個鈕會跳到哪一頁、信用卡號碼少寫一個碼下單不能成立、如何讓已登入會員在下次登入時看得到之前放在購物車裡的商品等等。




前端工程師的工作，就是讓買家能順利的下單，買到她想要的尺寸、顏色。但網頁如何知道什麼時候 Medium 開始缺貨？又怎麼知道什麼時候紅色的毛衣又進貨了呢？

想像一個傳統的商業模式，大概就是有一個店員會去倉庫查看，看完再跟客戶回報「我們還有最後一件紅色的毛衣」。在購物網站上，這個「查庫存」的動作，就是後端工程師處理的邏輯。每個網頁背後都有一個「資料庫」，暫且可以把它想成一個巨大的 excel 表格。這個表格上記載了所有毛衣的顏色、尺寸庫存。每當有一位買家下單一件毛衣，這件毛衣就得從這張 excel 表格被畫掉。而每當毛衣再進貨時，這些新的毛衣就得記到 excel 表格上。

總結一下：資料庫上記載著所有毛衣的庫存量；前端工程師負責透過網頁介面讓使用者輕易得知剩下什麼顏色什麼尺寸；而在這中間跑腿、在每次下單或進貨時去更新資料庫的人，就是後端工程師。

關於前端及後端，我還喜歡用房子做比喻。如果網頁是一間房子，前端工程師就是做所有室內裝潢的人，而後端工程師則是負責供應水源、電源、瓦斯、網路等等。舉個例子來說，蓮蓬頭怎麼跟出水口接在一起、怎麼透過把手控制水溫水量，這是前端工程師的責任；但水源的供應、源頭水壓、把管線拉到廁所的位置，這就是後端人員要做的。前端與後端工程師必定要很緊密的合作，不然只有蓮蓬頭卻沒有水無法洗澡、而沒有蓮蓬頭或者開水源的把手，一樣使用不到水，還是無法洗澡。

以上就是我對網頁開發工程師的簡單說明。如果對「機器學習」這個主題有興趣，可以看這篇：初學 Python 與 Machine Learning 心得。

如果想要知道我當初靠線上課程自學轉行成為網頁開發工程師所使用的資源，可以看 九個月自學轉行軟體工程師。


再附上幾門我在 Udemy 上過的課；我自學轉行的知識來源就是靠這幾門課。這些課程的特色是價格低（特價時我看過低於$20鎂）、內容充實（30小時以上的教學影片）及注重實作。


標籤：

留言

張貼留言

這個網誌中的熱門文章

常聽人說「現在人人都要學會 coding」-- 但到底是要學什麼？從何開始？去哪裡學？

最近換工作，要學很多以前我沒用過的程式語言技術，像是 TypeScript, GraphQL, Relay 等等。於是我上網找了很多免費的、付費的教學影片，像是在 YouTube、 Udemy、PluralSight 等等平台。 但很多教學影片從製作至今已經過了兩三年甚至五六年。在軟體的世界，過一年就人事已非了，何況是現在去看 2016年的教學說明。許多 web packages 的版本在六年間已經從 version 5.x 跳到 18.x 之類的... 因此即便那個教學影片再怎樣的手把手教學都沒有用。資訊已經完全過時。 軟體的世界就是這樣，技術日新月異。圖書館都不願意收舊的 coding 教科書，因為過時的資訊難以幫助到人。 軟體的世界就是這樣，技術日新月異。圖書館都不願意收舊的 coding 教科書，因為過時的資訊難以幫助到人。 許多人常萌生要自學 coding的念頭，但因為不得其門而入，一不小心熱情就會澆熄。身為一個自學 coding轉行當軟體工程師的人，我理解這種感覺。我們身在一個資訊爆炸的時代，但資訊量太大，找到對自己有用的教學資源其實就是自學最困難的一步。 很多人想到要學 coding，會想「課程會不會很貴？」「會不會很難？」「會不會需要花很久的時間？」其實這些問題都問錯了。自學 Coding是個知難行易的學問；如果知道怎麼找自學的資源，不用花多少錢甚至免費就能達成。如果找到對症下藥、適合自己的資源，認真跟著看跟著做也不會難上手。但如何找到那個沒有過時、資訊正確又適合自己的課程？很多人花了大把時間、大把金錢就卡在這個第一步。 我舉一個生活化的例子你就懂了。Ikea 的傢俱你說難組嗎？其實一點都不難，但先決條件是 Ikea的說明文件非常好懂、資訊正確，而 Ikea 家具的品管做得不錯，大部分我們買回家的包裝裡頭零件都正確，因此照著說明書一步一步完成不難還非常有成就感。 但我們也都買過很爛的家具組：說明書沒人看得懂、裡頭的零件缺一大堆，甚至連家具的裁切、材料本身都有問題，大小根本組不起來。不然就是說明書過時了：零件已經改版本了，但說明書沒有更新。如果組一個家具要一直打給客服補貨、換貨，而且甚至問題在哪裡我們都推敲不出來、客服那頭沒人回答我們問題... 我們一定非常洩氣，很快就放棄組家具了。我們一定心想「組家具太難了！」 以網頁開發這塊的 coding來說，...
3 則留言
閱讀完整內容

什麼是 Assertiveness? 你容易被情感勒索嗎？

來到美國後我才第一次聽到 assertive 這個單字。美國人將 assertiveness 視為很高的美德，因為那代表一個人具備足夠的自信、溝通技巧、人際成熟度，以至於能夠堅定、清楚地表達自己想要的與不想要的，卻不會因此傷害他人或顯得傲慢、無禮或威脅他人。 Psychology Today  是這樣定義 assertiveness 的： “Assertiveness is a social skill that relies heavily on effective communication while simultaneously respecting the thoughts and wishes of others. People who are assertive clearly and respectfully communicate their wants, needs, positions, and boundaries to others.  Individuals who are high in assertiveness don't shy away from defending their points of view or goals, or from trying to influence others to see their side. They are open to both compliments and constructive criticism. ” （「Assertiveness 是一種社交技能，依靠的是在有效溝通的同時尊重他人的想法及需求。Assertive 的人能清楚且尊重他人地說明自己的需求、渴望、處境以及社交界線。擁有 assertive 特質的人會積極地說服他人了解自己的觀點，也積極地爭取、辯護自己的想法。他們對於讚美及有建設性地批評同樣地歡迎。」） 美國人如此看重、欣賞的 assertiveness 這個單字在中文卻似乎沒有相對應的翻譯。Google translate 將 assertive 翻成「斷言的、斷定的、過分自信的」；我覺得這些翻譯充滿負面含義且非常不正確。 生長在台灣的我，認為台灣確實沒有 assertiveness 的文化。我觀察到的台灣人，普遍很少直接說出自己想要什麼；如...
20 則留言
閱讀完整內容

花九個月，靠自學轉行軟體工程師 -- 我所用的網路資源

by Vanessa Wang       歡迎支持我的臉書專頁：【 工程師作家的轉行人生 】 因為身邊有許多半路出家的軟體工程師，包含我老公，我一直抱持著或許某天我也要轉行當軟體工程師的想法。但我到了成為媽媽、小孩快一歲的時候，我才開始自學寫程式。 從 2018年底開始，我花了九個月的時間自學寫程式，並於 2019年七月成功轉行、找到了在加州矽谷全職軟體工程師（front-end web development）的工作。我沒有參加 bootcamp，就是在網路上找資源、自修。我是台大土木工程碩士畢業，後來到美國讀創意寫作碩士。成為軟體工程師之前，我沒有在職場上當過工程師，以前主要的工作以當 technical writer 寫技術文件為主。（ 更多關於我轉職的動機、轉職前的履歷 ） 這篇想整理一下我自學期間用過的教材、工具，但這些都僅供參考，畢竟每個人的狀況、目標都不一樣。我始終相信「盡信書不如無書」。我這九個月中學到最重要的一件事就是凡事要有自己的想法、相信自己。像我這樣的文章網路上有很多，每個人用的方法都不太一樣。參考別人走過的道路很好，但更重要的是規劃最適合自己的一條路，然後自信地走下去。 以下就是轉行的路上，對我最有用的網路資源、工具： 一篇 Medium 上的文章 by Andrei Neagoie  這篇文章叫做  Learn to code in less than 5 months, get hired, and have fun along the way 這是我還在當 technical writer 時，某天上班無聊隨便 google 找到的。那時候還不太確定自己要不要轉行軟體工程，所以常常在網路上參考他人的經驗。我不時地都會回來看這篇文章，這篇文章可以說是貫徹我自學期間的一個中心思想。我很欣賞他的理念，尤其是以下這段話： “I spent the first month avoiding any tutorials or books. Instead, I spent this month looking at the best way for me to learn and get hired. I studied other peo...
33 則留言
閱讀完整內容