<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>網頁前端工程師 &#8211; 科技島-掌握科技新聞、科技職場最新資訊</title>
	<atom:link href="https://www.technice.com.tw/tag/%e7%b6%b2%e9%a0%81%e5%89%8d%e7%ab%af%e5%b7%a5%e7%a8%8b%e5%b8%ab/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.technice.com.tw</link>
	<description>專注於科技新聞、科技職場、科技知識相關資訊，包含生成式AI、人工智慧、Web 3.0、區塊鏈、科技職缺百科、生物科技、軟體發展、雲端技術等豐富內容，適合熱衷科技及從事科技專業人事第一手資訊的平台。</description>
	<lastBuildDate>Tue, 06 Sep 2022 09:23:01 +0000</lastBuildDate>
	<language>zh-TW</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.4.2</generator>

<image>
	<url>https://www.technice.com.tw/wp-content/uploads/2022/12/cropped-wordpress_512x512-150x150.png</url>
	<title>網頁前端工程師 &#8211; 科技島-掌握科技新聞、科技職場最新資訊</title>
	<link>https://www.technice.com.tw</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>我的前端之路（網頁前端工程師職涯）</title>
		<link>https://www.technice.com.tw/experience/17618/</link>
					<comments>https://www.technice.com.tw/experience/17618/#respond</comments>
		
		<dc:creator><![CDATA[科編推薦]]></dc:creator>
		<pubDate>Tue, 06 Sep 2022 09:22:59 +0000</pubDate>
				<category><![CDATA[產業]]></category>
		<category><![CDATA[工作甘苦談]]></category>
		<category><![CDATA[工程師]]></category>
		<category><![CDATA[科技業]]></category>
		<category><![CDATA[網頁前端工程師]]></category>
		<category><![CDATA[職涯]]></category>
		<guid isPermaLink="false">https://www.technice.com.tw/?p=17618</guid>

					<description><![CDATA[<p><img width="1409" height="821" src="https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="12121212121" decoding="async" srcset="https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121.png 1409w, https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121-300x175.png 300w, https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121-1024x597.png 1024w, https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121-768x448.png 768w" sizes="(max-width: 1409px) 100vw, 1409px" title="我的前端之路（網頁前端工程師職涯） 1"></p>
<p>在跟社群朋友私訊時，他說我可以考慮分享「我的前端之路」之類的啊。覺得這真是一個很不錯的主題，每個人都有自己的故事！<content><!-- wp:image {"id":17619,"sizeSlug":"large","linkDestination":"none"} --></p>
<figure class="wp-block-image size-large"><img src="https://www.technice.com.tw/wp-content/uploads/2022/09/12121212121-1024x597.png" alt="" class="wp-image-17619"/><figcaption>在工作職涯上做各種嘗試體驗、跌跌撞撞的過程</figcaption></figure>
<p><!-- /wp:image --></p>
<p><!-- wp:paragraph --></p>
<p>圖文／<a href="https://vocus.cc/article/62bfc52cfd89780001b7308e">丁丁</a></p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>在跟社群朋友私訊時，他說我可以考慮分享「我的前端之路」之類的啊。覺得這真是一個很不錯的主題，每個人都有自己的故事！不愧是個老師，會因材施教XD</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>本科系畢業、碰前端之前</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>2012 年我從交大資工畢業，當兵後進入台北標準的內湖科技公司，做後端，而且是韌體佔 70%、後端 30%。當時我感覺到我的擅長的，不是韌體，而是後端，畢竟是資工系出身的。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>2015 年，進入高雄的傳產工作，維護網站，主要用 PHP,  MySQL , 以及 jQuery 做事。我發現我也很有能力處理 PHP 的事，包括網站伺服器在 LINUX 上，那些 LINUX 指令、操作，甚至是解 bug，有需求，我也都能靠著在學校碰過的 UNIX 系統培養出來的「sense」而去找出資料並解決。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>2016 年，在 Xdite 公司寫 Rails 做了 2 週，在被 Fire 前先離職。休息2週後，進入醫院資訊部。一開始寫 Delphi！維護健康檢查系統。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>憧憬前端工作，但沒自信、不敢</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>當時的時代，是處於網頁前端正在開始蓬勃發展中，React 、Anguar 興起，ES6 開始被推廣，每隔半年前端的技術就翻新一倍。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>做了很久的後端的我，發現自己跟別人比起來算是「擅長」後端，但是卻沒有成就感。反而自己對於貼近使用者的前端畫面，比較感興趣。但是……就只是有興趣而已，也沒有到很有熱情研究。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>國外也開始流行「UI/UX」這門學問，但這麼新又設計的東西，我也不知道能當飯吃嗎？或是「我」有本錢把它當飯吃嗎？我不知道。我不敢。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>後來公司當時資訊部主任決定做「前後端分離」，我也不敢自己說「我要轉前端」這種 影響職涯的事。在某一次公司會議上，有 guts 的主任，把工程師依照個性分兩邊，一邊前端一邊後端，我被分到前端。從此開始了我的「前端」職涯。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>一開始學就是 React，因為公司有人稍微會帶。一開始用後端的思維在碰前端時，就是各種不解。因為沒有前端框架、MVVM 的思維，以及連 NPM 的概念都覺得很抽象。每一個套件的 Github 說明文件，我連首頁文件都看不懂，好挫折。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>找公司大佬問「為什麼我連這種基本的文件都看不懂？」，他安慰我：「因為你不是前端領域的人，這要花時間培養的」</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>努力的我，週末的時間也邀同事一起去天瓏書局看 javascript 的 「this」概念。<br />經過了半年，在工作上邊學邊做，應該是最有效率的進步方式了。整個醫院的掛號系統的前端，幾乎都是我做的。對於 React + MobX 也掌握了精髓，有一次還產生足夠的自信到當時的 RGBA &amp; F2E 社群聚會上分享。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>設計與美感 - 一生從沒碰過的東西</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>前端做久了，會發現一定碰到「設計」「美感」類的東西。這方面我一丁點概念都沒有，每天除了巴著公司的設計師問美感外，也自己去看了一堆「給外行人讀的平面設計、UI 設計」書，也買了國外的設計線上課程！後來休假期間還直接花 2 萬去南陽街補習「平面設計」。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>理工科畢業家裡又務農的我，逐漸了解什麼是「設計」，它沒有標準答案，但好像又有一個答案。每天開始學著講設計師的行話，秀作品平台 behance、pinterest、dribbble、素材網站 Pexel、Pixabay 、透明度/不透明度、視覺、層級，常常掛在嘴邊講。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>Sketch 出來後，我開始學用 Sketch 作圖，臨摹 Daily UI！然後把我的作圖丟到 台灣 UI/UX Designer 臉書社團，請各位設計師幫我「評圖」，常常被評得一踏糊塗，摧毀自我。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>Vue 比 React 簡單？</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>開始發現很多藝術、設計背景的人在選前端框架，使用的是 Vue。但我當時只會 React，我並沒有能耐再自己學會 Vue 跟 Angular。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>趁著換工作的時候，找了一間用 Vue.js 開發的公司，進去後，狂補 Vue，一邊工作一邊學，是最有效率的學習方式了。 Vue 的雙向綁定，很快的我就嚐到甜頭，難怪那些藝術設計師會選用 vue 開發網站，因為比 React 簡單又直覺！</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>想寫酷炫但不實用的網頁 - 程式藝術</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>工作之餘，開始對於寫出酷炫的網頁有極大的興趣。不是實用，而是「酷炫」！在找了很久後，發現這存在一個專有名詞： Creative Coding！ 由 MIT 在推擴的 processing.js （後來演化成 p5.js）。有一位台灣人吳哲宇特別在推廣！</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>與設計師的合作</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>我發現自己很喜歡跟設計師討論設計的。當公司專案的界面，我把設計稿切版出來後會去找設計師，當他是老闆，讓自己的前端頁面能過「通過設計師的美感審核」，我稱之為"設計師之眼"。 有些我做不到的，就會跟他討論，詢問為什麼他這樣要這樣排版、或是互相協商找出兩邊都能做到的事。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>經歷過幾個設計師：「風格是紫色、半透明等，用 Adobe AI」、「風格是淺色，用 Adobe Xd」；「風格是對比、邏輯性強、用 Sketch」。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>把前端套件上架 NPM</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>在對技術熱血的時期，當時 iThome 流行鐵人賽，我身邊的同事拿 fabric.js 來當作題材寫文章。讓我也稍加對這個在畫布上作圖的函式庫有一些了解。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>而在工作的過程中，我跟熱血同事發現居然沒有一個 vue 的年曆，整個 NPM 生態系都沒有。於是和同事協作，一起開發一個 open source 套件上架 NPM，而一開始沒有人看到。 我主動上 Hacker News 宣傳我們自己做的前端套件，吸引了一些人點進來按星星。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>後來又換了一間公司，也是用 Vue 的，游刃有餘，沒有進步什麼，只嘗試使用了 Nuxt.js。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>跨足APP</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>也曾經對於寫 APP 著迷，研究了許多怎麼用網頁技術去包出 APP，在 NativeScript 社群泡了一陣子後，發現還是有不少限制。後來花了半年時間進入 Android APP 開發，買書、看線上課程、參與 LINE 社群，也上架了4~5個自己的 APP。 但是在這個生態圈裡，發現 Android 的作業系統版本只要一更新，那些底層的 API 都不向下相容，全部都要依照版本重寫。而 Android 的作業系統版本又更新太快，感覺10個月就更新一次，社群的安卓工程師就哀豪一遍。 這讓我感覺，『難怪寫 APP 的工程師 薪資會比 寫 Web 的還要高，因為他們太累了xd』同時我也果斷放棄，不讓這一塊領域佔用我的時間，因為比起不斷變動的 Android 環境，我還是比較喜歡「穩定的網頁環境」。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>技術變動比較： 後端 &lt; 前端 &lt; APP</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading --></p>
<h2>對前端產業的心得與看法</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>基本上我的前端工作資歷，就是：2 年 React、3 年 Vue。現在是第 4 年。而這之中經歷 4 間公司。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>而當三大框架我摸了 2 種後，我漸漸感覺，在這個時代下，前端已經『穩定』很久了，早已不再像 5 年前那個「每半年前端技術都翻新倍」的狀態。 框架已經解決了所有看得到的問題。</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>任何新的前端需求都能解，需求是從「人」從「老闆」從「PM」來的，人能想得到的東西，現在的框架都能游刃有餘的解掉。（只要人的邏輯不要太矛盾即可）</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:pullquote --></p>
<figure class="wp-block-pullquote">
<blockquote>
<p>本文由 <a href="https://vocus.cc/user/5d55882cfd8978000168bf9f">丁丁</a> 授權轉載，原文<a href="https://vocus.cc/article/62bfc52cfd89780001b7308e">連結</a></p>
</blockquote>
</figure>
<p><!-- /wp:pullquote --></content></p>
<p>這篇文章 <a rel="nofollow" href="https://www.technice.com.tw/experience/17618/">我的前端之路（網頁前端工程師職涯）</a> 最早出現於 <a rel="nofollow" href="https://www.technice.com.tw">科技島-掌握科技新聞、科技職場最新資訊</a>。</p>
]]></description>
		
					<wfw:commentRss>https://www.technice.com.tw/experience/17618/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
