更新於 2022/08/30閱讀時間約 7 分鐘

我的前端之路(網頁前端工程師職涯)

在跟社群朋友私訊時,他說我可以考慮分享「我的前端之路」之類的啊。覺得這真是一個很不錯的主題,每個人都有自己的故事!不愧是個老師,會因材施教XD
在工作職涯上做各種嘗試體驗、跌跌撞撞的過程
在工作職涯上做各種嘗試體驗、跌跌撞撞的過程

本科系畢業、碰前端之前

2012年我從交大資工畢業,當兵後進入台北標準的內湖科技公司,做後端,而且是韌體佔70%、後端30%。當時我感覺到我的擅長的,不是韌體,而是後端,畢竟是資工系出身的。
2015年,進入高雄的傳產工作,維護網站,主要用PHP, MySQL, 以及jQuery 做事。我發現我也很有能力處理PHP的事,包括網站伺服器在LINUX上,那些LINUX指令、操作,甚至是解bug,有需求,我也都能靠著在學校碰過的 UNIX 系統培養出來的「sense」而去找出資料並解決。
2016年,在 Xdite 公司寫 Rails 做了2週,在被 Fire 前先離職。休息2週後,進入醫院資訊部。一開始寫 Delphi!維護健康檢查系統。

憧憬前端工作,但沒自信、不敢

當時的時代,是處於網頁前端正在開始蓬勃發展中,React 、Anguar 興起,ES6 開始被推廣,每隔半年前端的技術就翻新一倍。
做了很久的後端的我,發現自己跟別人比起來算是「擅長」後端,但是卻沒有成就感。反而自己對於貼近使用者的前端畫面,比較感興趣。但是……就只是有興趣而已,也沒有到很有熱情研究。
國外也開始流行「UI/UX」這門學問,但這麼新又設計的東西,我也不知道能當飯吃嗎?或是「我」有本錢把它當飯吃嗎?我不知道。我不敢。
後來公司當時資訊部主任決定做「前後端分離」,我也不敢自己說「我要轉前端」這種 影響職涯的事。在某一次公司會議上,有 guts 的主任,把工程師依照個性分兩邊,一邊前端一邊後端,我被分到前端。從此開始了我的「前端」職涯。
一開始學就是 React,因為公司有人稍微會帶。一開始用後端的思維在碰前端時,就是各種不解。因為沒有前端框架、MVVM的思維,以及連 NPM 的概念都覺得很抽象。每一個套件的 Github 說明文件,我連首頁文件都看不懂,好挫折。
找公司大佬問「為什麼我連這種基本的文件都看不懂?」,他安慰我:「因為你不是前端領域的人,這要花時間培養的」
努力的我,週末的時間也邀同事一起去天瓏書局看 javascript 的 「this」概念。 經過了半年,在工作上邊學邊做,應該是最有效率的進步方式了。整個醫院的掛號系統的前端,幾乎都是我做的。對於 React + MobX 也掌握了精髓,有一次還產生足夠的自信到當時的RGBA & F2E 社群聚會上分享。

設計與美感 - 一生從沒碰過的東西

前端做久了,會發現一定碰到「設計」「美感」類的東西。這方面我一丁點概念都沒有,每天除了巴著公司的設計師問美感外,也自己去看了一堆「給外行人讀的平面設計、UI設計」書,也買了國外的設計線上課程!後來休假期間還直接花2萬去南陽街補習「平面設計」。
理工科畢業家裡又務農的我,逐漸了解什麼是「設計」,它沒有標準答案,但好像又有一個答案。每天開始學著講設計師的行話,秀作品平台behance、pinterest、dribbble、素材網站 Pexel、Pixabay 、透明度/不透明度、視覺、層級,常常掛在嘴邊講。
Sketch 出來後,我開始學用 Sketch 作圖,臨摹 Daily UI!然後把我的作圖丟到 台灣 UI/UX Designer 臉書社團,請各位設計師幫我「評圖」,常常被評得一踏糊塗,摧毀自我。

Vue 比 React 簡單?

開始發現很多藝術、設計背景的人在選前端框架,使用的是 Vue。但我當時只會 React,我並沒有能耐再自己學會 Vue 跟 Angular。
趁著換工作的時候,找了一間用 Vue.js 開發的公司,進去後,狂補 Vue,一邊工作一邊學,是最有效率的學習方式了。 Vue 的雙向綁定,很快的我就嚐到甜頭,難怪那些藝術設計師會選用vue開發網站,因為比 React 簡單又直覺!

想寫酷炫但不實用的網頁 - 程式藝術

工作之餘,開始對於寫出酷炫的網頁有極大的興趣。不是實用,而是「酷炫」!在找了很久後,發現這存在一個專有名詞: Creative Coding! 由 MIT 在推擴的 processing.js (後來演化成 p5.js) 。有一位台灣人吳哲宇特別在推廣!

與設計師的合作

我發現自己很喜歡跟設計師討論設計的。當公司專案的界面,我把設計稿切版出來後會去找設計師,當他是老闆,讓自己的前端頁面能過「通過設計師的美感審核」,我稱之為"設計師之眼"。 有些我做不到的,就會跟他討論,詢問為什麼他這樣要這樣排版、或是互相協商找出兩邊都能做到的事。
經歷過幾個設計師:「風格是紫色、半透明等,用Adobe AI」、「風格是淺色,用Adobe Xd」;「風格是對比、邏輯性強、用 Sketch」。

把前端套件上架 NPM

在對技術熱血的時期,當時 iThome 流行鐵人賽,我身邊的同事拿 fabric.js 來當作題材寫文章。讓我也稍加對這個在畫布上作圖的函式庫有一些了解。
而在工作的過程中,我跟熱血同事發現居然沒有一個 vue 的年曆,整個 NPM 生態系都沒有。於是和同事協作,一起開發一個 open source 套件上架 NPM,而一開始沒有人看到。 我主動上 Hacker News 宣傳我們自己做的前端套件,吸引了一些人點進來按星星。
後來又換了一間公司,也是用 Vue 的,游刃有餘,沒有進步什麼,只嘗試使用了 Nuxt.js。

跨足APP

也曾經對於寫APP著迷,研究了許多怎麼用網頁技術去包出app,在 NativeScript 社群泡了一陣子後,發現還是有不少限制。後來花了半年時間進入 Android APP 開發,買書、看線上課程、參與 LINE 社群,也上架了4~5個自己的APP。 但是在這個生態圈裡,發現 Android 的作業系統版本只要一更新,那些底層的 API 都不向下相容,全部都要依照版本重寫。而 Android 的作業系統版本又更新太快,感覺10個月就更新一次,社群的安卓工程師就哀豪一遍。 這讓我感覺,『難怪寫APP的工程師 薪資會比 寫Web 的還要高,因為他們太累了xd』同時我也果斷放棄,不讓這一塊領域佔用我的時間,因為比起不斷變動的 Android 環境,我還是比較喜歡「穩定的網頁環境」。
技術變動比較: 後端 前端 APP

對前端產業的心得與看法

基本上我的前端工作資歷,就是:2年 React、3年 Vue。現在是第4年。而這之中經歷4間公司。
而當三大框架我摸了2種後,我漸漸感覺,在這個時代下,前端已經『穩定』很久了,早已不再像5年前那個「每半年前端技術都翻新倍」的狀態。 框架已經解決了所有看得到的問題。
任何新的前端需求都能解,需求是從「人」從「老闆」從「PM」來的,人能想得到的東西,現在的框架都能游刃有餘的解掉。(只要人的邏輯不要太矛盾即可)
分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.