自學 | Self Study _v 0.2.2 | 前端工程師 (Front-End developers) 初探

View this thread on: d.buzz | hive.blog | peakd.com | ecency.com
·@snailpjw·
0.000 HBD
自學 | Self Study _v 0.2.2 | 前端工程師 (Front-End developers) 初探
<html>
<p>上大學前, 我是個只會用電腦玩玩電動的屁孩, 對於能運用電腦去做些什麼, 根本一竅不通, 沒有概念, 那時候喜歡寫字, 作文, 寫詩, 感覺充滿了文藝氣息, 那時候還不相信怎麼會用電腦用到不會寫字, 但 現在懂了......</p>
<p>電腦, 網際網路, 手機...... 讓資訊快速地流通, 資訊變得 多, 雜, "快"! 變化的速度加快, 我們要以怎樣態度來面對呢?</p>
<p>引用 <a href="http://www.csie.ntu.edu.tw/~liao/">廖世偉</a> 老師在某個 Blockchain talk的佳句來註解 :</p>
<blockquote>聚焦在無限小的點:單點突破.快速複製</blockquote>
<blockquote>小步快跑,加速迭代(跌倒)</blockquote>
<p>就跟前個學期 資策會創研所副所長 洪毓祥老師所耳提面命的: (意思大概如下)</p>
<blockquote>只有不斷的嘗試失敗, 才有機會趨近於那個機率渺茫的成功機會</blockquote>
<p>而我計畫嘗試"工程師"的這條路上, 工具的變化也是相當迅速, 下面整理一些資訊分享!</p>
<p>*關於工程師</p>
<p>根據 鄭仲鈞(Sean Cheng) 前輩在<a href="http://st-threath.blogspot.tw/2013/06/an-engineer.html">Blog</a>上分享的資料, 工程師大致上可以區分成三種 :&nbsp;</p>
<ol>
  <li>寫程式的人(Coder、Employee、Worker)</li>
  <li>有目標而寫程式的人(Hacker、Doer、Entrepreneur)</li>
  <li>熱愛程式本身的人(Architect、Theorists、Change Maker、Geek)</li>
</ol>
<p>在 ALPHA camp 的<a href="https://blog.alphacamp.co/2016/01/05/3-things-you-have-to-know-before-you-switch-over-to-a-developer/">Blog</a>中也有一篇文章 "轉職成軟體工程師前你該考慮的三件事", 下面簡單註記:</p>
<ol>
  <li>工程師都在做些什麼?
    <ol>
      <li>跟其他工程師討論</li>
      <li>撰寫程式</li>
      <li>除錯</li>
      <li>跟使用者溝通</li>
    </ol>
  </li>
  <li>媒體宣揚的好處不過是種迷思
    <ol>
      <li>薪水超高?</li>
      <li>出國工作?</li>
      <li>轉職後就海闊天空?</li>
    </ol>
  </li>
  <li>你對寫成是真的有愛嗎?</li>
</ol>
<p>針對上面的問題, 自我評估, 我還只是的Coder, 目標尚未明確, 會選擇這條路, 也只是剛好大學有接觸到程式設計, 剛好學起來比同學厲害些, 有成就感些, 聽老師說出路不錯, 也就順其自然地朝著這個方向去做, 至於不是本科系的朋友, 想轉職成工程師也不是不可能, 就我遇到厲害的專家, 也有不少不是本科系的(Ex:觀光系、經濟系等等)</p>
<p>而近期我會萌生朝 前端發展的種子, 不外乎是覺得視覺效果很炫, 不斷推陳出新, 感覺任何視覺特效都可以刻出來, 很酷!!!</p>
<p>再來大概就是大學畢業專題發表時, 副校長對於我專題系統的評語了,&nbsp;</p>
<p>"這畫面可能要去給設計系的設計一下!"</p>
<p>(雖然真的是不怎麼樣的介面, 但不得不說, 不單單是他, 我也是, 對於第一眼看到事物的外表, 介面, 是有相當大的影響力的, 剛好 @sweetsssj 在文章 <a href="https://steemit.com/story/@sweetsssj/welcome-to-my-world-of-idioms-6-fine-feathers-make-fine-birds">Fine feathers make fine birds</a> 也有提到類似的現象, 值得思考)</p>
<p><br></p>
<p>*關於前端工程師 (Front-End developers)</p>
<p>根據 "<a href="http://www.ditldesign.com/news/2014/12/19/ditktalk2014nov20hsieh">DITLTALK-前端工程師所應具備的能力為何?</a>" 這篇文章中 謝舒婷小姐Talk的紀錄如下:</p>
<ol>
  <li>會純的HTML、CSS、JavaScript,至少熟悉一套JS Framework</li>
  <li>能解決跨瀏覽器的問題</li>
  <li>至少瞭解一種後端程式</li>
  <li>對UX領域保持熱誠</li>
  <li>積極吸收最新資訊</li>
</ol>
<p>除了上面基礎條件外, 還有其他幾項</p>
<ol>
  <li>各種框架Framework的應用</li>
  <li>注重安全性及效能</li>
  <li>瞭解W3C的網頁結構規範</li>
</ol>
<p>個人特質培養</p>
<ol>
  <li>溝通的技巧</li>
  <li>團隊開發的能力</li>
  <li>互動設計</li>
  <li>易用性</li>
</ol>
<p>*列舉一些 <a href="http://www.f2e.tw/jobs.html">Front-End Developers Taiwan</a> 網站上徵才的資訊:(<a href="https://github.com/f2etw/jobs">Github</a>)</p>
<ol>
  <li><a href="https://github.com/f2etw/jobs/issues/158">Cepave.com 香港商翱鶚股份有限公司</a></li>
  <li><a href="https://github.com/f2etw/jobs/issues/151">幫你優 BoniO</a></li>
  <li><a href="https://github.com/f2etw/jobs/issues/150">InQ</a></li>
  <li><a href="https://github.com/f2etw/jobs/issues/125">25sprout</a></li>
</ol>
<p>需具備能力的範例</p>
<ul>
  <li>基本使用 Git 能力</li>
  <li>熟悉 HTML5 、CSS3、ES6+ 語法</li>
  <li>使用過 React.js</li>
  <li>Flux/Redux or 任何與React搭配的state management</li>
  <li>SASS or postCSS</li>
  <li>不依賴css framework切版的能力</li>
  <li>Responsive Web Design 網站製作經驗</li>
  <li>jQuery 使用經驗</li>
  <li>Webpack使用/設定經驗</li>
  <li>熟悉前端測試</li>
  <li>對後端有一定了解,Ruby on Rails尤佳</li>
  <li>瞭解scrum流程</li>
  <li>具備 RESTful API 介接經驗</li>
</ul>
<p>*註記其他中意的公司</p>
<ol>
  <li><a href="https://hahow.in/joinus">Hahow</a></li>
  <li><a href="https://5xruby.tw/posts">五倍紅寶石</a></li>
  <li><a href="https://tw.voicetube.com/jobs">VoiceTube</a></li>
</ol>
<p>*學習資源 (Search 到好多, 得花時間消化消化)</p>
<ol>
  <li><a href="http://chuansong.me/n/1427418552860">送给你的100篇前端技术好文</a></li>
  <li><a href="https://github.com/soyaine/JavaScript30">有关 @wesbos 的课程 JavaScript-30 的中文练习指南</a></li>
  <li>&nbsp;<a href="https://pjchender.blogspot.tw/2017/01/js30day1.html">PJCHENder愛分享-[筆記] JS30系列:監聽按鍵事件及撥放音效(Day1)</a></li>
  <li><a href="https://buzzorange.com/techorange/2016/10/25/2016-programming-language/">【全端工程師解密】2016 年度 JavaScript 潮流:請徹底拋棄 jQuery</a></li>
  <li><a href="https://softnshare.wordpress.com/2016/05/02/轉載-前端設計師工程師的職缺要如何寫/">轉載-前端設計師/工程師的職缺要如何寫?</a></li>
  <li><a href="https://noootown.wordpress.com/2016/03/23/frontend-backend-breakfast/">[前端連載] 買早餐也能了解前端 vs 後端?</a></li>
  <li><a href="https://hahow.in/courses/56c1e3b3e91d590900234105">Hahow- 前端網頁設計入門</a></li>
  <li><a href="http://www.slideshare.net/l443018/frontend-resource-intergration-and-sharing-modern-web-2016-review?qid=bfbb958a-0276-431a-a18f-15e409fec195&amp;v=&amp;b=&amp;from_search=8">Frontend Resource Intergration and Sharing - Modern Web 2016 review</a></li>
  <li><a href="http://ithelp.ithome.com.tw/articles/10184581">30 天打造 MERN Stack Boilerplate系列</a></li>
  <li><a href="https://www.facebook.com/groups/f2e.tw/?fref=ts">&nbsp;Front-End Developers Taiwan Facebook</a></li>
  <li><a href="http://blog.miniasp.com/post/2016/02/02/JavaScript-novice-advice-and-learning-resources.aspx">我要成為前端工程師!給 JavaScript 新手的建議與學習資源整理</a></li>
  <li><a href="http://kimix.name/如何成為前端工程師/">如何成為前端工程師?</a></li>
  <li><a href="https://zh-tw.facebook.com/notes/lock-chou/譯為什麼我們找不到前端工程師/10152095506555563/">[譯]為什麼我們找不到前端工程師?</a></li>
  <li><a href="http://denny.qollie.com/2016/07/30/front-end-career-job/">我的前端工程師之路:找工作</a></li>
  <li><a href="https://noootown.wordpress.com/category/前端連載/">沒一村Blog前端連載</a></li>
  <li><a href="https://blog.alphacamp.co/2016/01/14/how-to-become-a-startup-ui-rockstar/">如何成為新創公司渴求的 UI 設計師?</a></li>
  <li><a href="http://ithelp.ithome.com.tw/articles/10186104">30 天精通 RxJS</a></li>
  <li><a href="https://cn.vuejs.org/v2/guide/">Vue.js</a></li>
  <li><a href="http://blog.techbridge.cc/2016/04/04/react-react-native-es5-es6-cheat-sheet/">一看就懂的 React ES5、ES6+ 常見用法對照表</a></li>
  <li><a href="https://resourcecards.com">Resource Cards</a></li>
  <li><a href="https://ihower.tw/rails/intro.html">Ruby on Rails 實戰聖經</a></li>
  <li><a href="https://www.lynda.com/Web-Foundations-tutorials/Front-end-design/158666/158685-4.html">Front-end design &amp; Front-end developer</a></li>
  <li><a href="http://csscoke.com/">CSS Coke - CSS可樂 (Lee Amos)</a></li>
  <li><a href="https://medium.freecodecamp.com/a-study-plan-to-cure-javascript-fatigue-8ad3a54f2eb1#.wu9jhhrvi">A Study Plan To Cure JavaScript Fatigue</a></li>
  <li><a href="http://blog.techbridge.cc/2016/07/23/progressive-web-app/">Progressive Web App 會是未來趨勢嗎?</a></li>
  <li><a href="http://ithelp.ithome.com.tw/articles/10186198">30 天 Progressive Web App 學習筆記</a></li>
</ol>
<p><br></p>
<p>......TBC</p>
</html>
👍 , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,