SlideShare a Scribd company logo
謝小雨
about.me/lindsayrain
前端攻城獅?
一堂適合小獅子的入門分享
謝小雨
20140722
20140729
謝小雨
about.me/lindsayrain
個人簡介
● 謝小雨 Lindsay Hsieh
● http://about.me/lindsayrain
● 經驗:
○ 全職工程師 2 年(維護主機、修電腦、管理設備、寫程
式、維護資料庫、開報價單…等)
○ 全端工程師 3 年(ASP, PHP, JSP, Flash,
ColdFusion, Java, JavaScript...等。)
○ 研發企劃 2 年 (創新服務的導入、研發、實驗)
○ 前端工程師 3 年(Team Leader)
謝小雨
about.me/lindsayrain
分享大綱
謝小雨
about.me/lindsayrain
先來認識名稱
● 前端工程師
● 網頁前端工程師
● 前端網頁設計師
● Front End Engineer (F2E)
● Front-End Software Engineer
● Front End Developer
● Front End Web Developer
● Front-End Web Designer/Developer
● User Interface / Front-End Developer
謝小雨
about.me/lindsayrain
網頁的前端技術算年輕
http://goo.gl/mf20Cj
謝小雨
about.me/lindsayrain
Web 開發的分工越來越細
http://jjperezaguinaga.com/2014/03/19/why-cant-we-find-front-end-developers/
謝小雨
about.me/lindsayrain
其實真正造就,前端工作機會的是...
謝小雨
about.me/lindsayrain
現在更多了...(Mobile Browser)
謝小雨
about.me/lindsayrain
在設計與工程之間
前端可以說是一個
重新切割出來的領域
謝小雨
about.me/lindsayrain
負責寫 HTML+CSS+JavaScript 的人 ?
你們覺得前端是什麼?
謝小雨
about.me/lindsayrain
用戶電腦、手機上跑的程式叫
{前端}
機房電腦上跑的程式叫
{後端}
看過一個不錯的說法
謝小雨
about.me/lindsayrain
設計還是前端?
那切板是誰的事?
謝小雨
about.me/lindsayrain
想從設計走到前端?先了解前端在幹嘛吧!
設計轉前端該注意的事情
個人喜歡 Muki 這篇
謝小雨
about.me/lindsayrain
我自己遇到的例子...
實際上
每一家公司分工都不一樣
謝小雨
about.me/lindsayrain
前端工程師該學什麼?
謝小雨
about.me/lindsayrain
老實說
謝小雨
about.me/lindsayrain
......我也一直在學
即使我現在告訴你
明年可能就有點不一樣了
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2008.12)
https://www.flickr.com/photos/kejun/3114605967/
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2011.12)
http://www.weibo.com/1700082927/xC029u1n8
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2012.03)
http://mzhou.me/?attachment_id=95577
http://mzhou.me/wp-content/uploads/2012/03/%E5%A4%A7%E5%89%8D%E7%AB%AF.png
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2012.03)
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2012.03)
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2014.04)
http://www.weibo.com/1743150280/B1tBrFX2J
謝小雨
about.me/lindsayrain
前端應該要會的技能 (2014.04)
謝小雨
about.me/lindsayrain前端應該要會的技能 (2014.04)
謝小雨
about.me/lindsayrain
前端應該要會的技能
2015年相信還會更多....
謝小雨
about.me/lindsayrain
還好,學習資源很多
先推薦幾個
謝小雨
about.me/lindsayrain
自學推薦
● CodeCademy
HTML+CSS, JavaScript, jQuery
英語教學,讓你自然而然習慣兩種語言
● Code School - 遊戲化學習
有免費也有 $29 per month
● 前端工程開發實務 http://f2eclass.com/
● Learning Path (實體課程已經截止)
○ http://week1.learning-path.info/
○ http://week2.learning-path.info/
○ http://week3.learning-path.info/
○ http://week4.learning-path.info/
謝小雨
about.me/lindsayrain
實體課程
● Amos 跟 Muki 的課程
HTML + CSS + jQuery 前端組合課程招生與
介紹
給設計師的入門前端課程
(好像已經開課了.....)
● Will 保哥的技術交流中心
北、中、南都顧到了
謝小雨
about.me/lindsayrain
追蹤特定專家跟新技術
● http://uptodate.frontendrescue.org/
這有整理很多 twitter上的專家跟專題
● http://www.weibo.com/rockux
微博可關注特定的公司、技術團體、名人...
謝小雨
about.me/lindsayrain
最重要的!定期分享自己的想法
● 社群網站
● 寫 Blog
● 跟同事朋友面對面分享簡報
分享知識時,加上自己的見解
謝小雨
about.me/lindsayrain
跨領域的學習
謝小雨
about.me/lindsayrain
參與社群 (不侷限在前端)
● Front End Developers Taiwan
● JavaScript.tw
● HPX (HPX Life、HPX Campus)
● IxDA
● RGBA
● Angular.js
● 台灣資訊圖表討論
謝小雨
about.me/lindsayrain
參與論壇與活動 (不侷限在前端)
● JSDC
● WebConf
● MIX 2014
● HITCON
● UiGathering
補充:Taiwan Conf List
謝小雨
about.me/lindsayrain
懂得去哪裡找答案
除了會 Google 之外
● stackoverflow
● Quora
● 知乎
● 在社群發問&解答別人問題
謝小雨
about.me/lindsayrain
發展多元興趣
● 體驗
● 學習
● 分享交流
● 可提高你觀察人事物的敏感度
謝小雨
about.me/lindsayrain
公司怎麼找人才?
謝小雨
about.me/lindsayrain
前端的人來自兩種領域
● 設計背景
● 技術背景
http://www.adhamdannaway.com/
謝小雨
about.me/lindsayrain
前端工程師的應有人格特質
● 設計 + 工程
● 美感 + 理性
● 對吸收新知充滿熱情
● T型,π型更好
● 會罵「IE 去死!」卻又懂得如何駕馭它
謝小雨
about.me/lindsayrain
前端工程師最最最最基本條件
● 會純的 HTML,CSS, JavaScript
● 至少了解一種後端程式語言
● 熟悉一套 JS Framwork,不只會用,去了解它
的原理
● 對UX領域保持熱忱
● 積極吸收最新趨勢
● 能解決跨瀏覽器問題 (需經驗累積、重點是不
可以排斥)
謝小雨
about.me/lindsayrain
● 溝通:接收與傳達
● 廣泛的學習
● 分析完整的脈落
○ 請你推薦你覺得好用的網站或是app,試著分析好用的
地方是什麼 (跟一位 Google F2E 請教的)
● 解決問題的能力
○ 嘗試告訴我你最近一次遇到問題時,你是怎麼解決
的?
主管最重視的 - 溝通能力&態度
謝小雨
about.me/lindsayrain
問雨答
Q&A
簡報分享
http://www.slideshare.net/lindsayrain/20140729-37461980
https://speakerdeck.com/lindsayrain/xie-xiao-yu
謝小雨
about.me/lindsayrain
104人力銀行_一零四資訊科技股份有限公司
前端網頁程式設計師
Front-End Web Developer
工商服務時間

More Related Content

Similar to 前端攻城獅?一堂適合小獅子的入門分享 20140729

不為人知的前端人生
不為人知的前端人生不為人知的前端人生
不為人知的前端人生
拉拉 羅
 
20170501 R 軟體經驗分享
20170501 R 軟體經驗分享20170501 R 軟體經驗分享
20170501 R 軟體經驗分享
Sin-di Lee
 
在生命轉彎的地方 - 從軟體開發職涯,探索人生
在生命轉彎的地方 - 從軟體開發職涯,探索人生在生命轉彎的地方 - 從軟體開發職涯,探索人生
在生命轉彎的地方 - 從軟體開發職涯,探索人生
Rick Hwang
 
從內向工程師到RD主管的軟實力
從內向工程師到RD主管的軟實力從內向工程師到RD主管的軟實力
從內向工程師到RD主管的軟實力
Wen Hsu
 
Frankie ResumeZH
Frankie ResumeZHFrankie ResumeZH
Frankie ResumeZH
Frankie Chien
 
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
棋文 鄭
 
20121115 Slides
20121115 Slides20121115 Slides
20121115 SlidesTonyq Wang
 
[課程介紹] App創業與實作
[課程介紹] App創業與實作[課程介紹] App創業與實作
[課程介紹] App創業與實作
AppUniverz Org
 

Similar to 前端攻城獅?一堂適合小獅子的入門分享 20140729 (8)

不為人知的前端人生
不為人知的前端人生不為人知的前端人生
不為人知的前端人生
 
20170501 R 軟體經驗分享
20170501 R 軟體經驗分享20170501 R 軟體經驗分享
20170501 R 軟體經驗分享
 
在生命轉彎的地方 - 從軟體開發職涯,探索人生
在生命轉彎的地方 - 從軟體開發職涯,探索人生在生命轉彎的地方 - 從軟體開發職涯,探索人生
在生命轉彎的地方 - 從軟體開發職涯,探索人生
 
從內向工程師到RD主管的軟實力
從內向工程師到RD主管的軟實力從內向工程師到RD主管的軟實力
從內向工程師到RD主管的軟實力
 
Frankie ResumeZH
Frankie ResumeZHFrankie ResumeZH
Frankie ResumeZH
 
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
2020DDDTW-如何逐步導入敏捷精神,創造願意接受失敗的開發團隊?
 
20121115 Slides
20121115 Slides20121115 Slides
20121115 Slides
 
[課程介紹] App創業與實作
[課程介紹] App創業與實作[課程介紹] App創業與實作
[課程介紹] App創業與實作
 

More from Shu Ting Hsieh

HPX88 - 腦洞大開的Uf工作坊心得20161126
HPX88 - 腦洞大開的Uf工作坊心得20161126HPX88 - 腦洞大開的Uf工作坊心得20161126
HPX88 - 腦洞大開的Uf工作坊心得20161126
Shu Ting Hsieh
 
網頁設計心理學讀書心得分享
網頁設計心理學讀書心得分享網頁設計心理學讀書心得分享
網頁設計心理學讀書心得分享
Shu Ting Hsieh
 
Google developer tool 簡介
Google developer tool 簡介Google developer tool 簡介
Google developer tool 簡介Shu Ting Hsieh
 
Designing Interfaces chapter 9
Designing Interfaces chapter 9Designing Interfaces chapter 9
Designing Interfaces chapter 9
Shu Ting Hsieh
 
我的影集人生
我的影集人生我的影集人生
我的影集人生
Shu Ting Hsieh
 
網站解剖學
網站解剖學網站解剖學
網站解剖學
Shu Ting Hsieh
 
認知簡報 20110915
認知簡報 20110915認知簡報 20110915
認知簡報 20110915
Shu Ting Hsieh
 

More from Shu Ting Hsieh (11)

HPX88 - 腦洞大開的Uf工作坊心得20161126
HPX88 - 腦洞大開的Uf工作坊心得20161126HPX88 - 腦洞大開的Uf工作坊心得20161126
HPX88 - 腦洞大開的Uf工作坊心得20161126
 
網頁設計心理學讀書心得分享
網頁設計心理學讀書心得分享網頁設計心理學讀書心得分享
網頁設計心理學讀書心得分享
 
Google developer tool 簡介
Google developer tool 簡介Google developer tool 簡介
Google developer tool 簡介
 
Designing Interfaces chapter 9
Designing Interfaces chapter 9Designing Interfaces chapter 9
Designing Interfaces chapter 9
 
我的影集人生
我的影集人生我的影集人生
我的影集人生
 
溝通升級版201008
溝通升級版201008溝通升級版201008
溝通升級版201008
 
溝通升級版201007
溝通升級版201007溝通升級版201007
溝通升級版201007
 
溝通升級版201006
溝通升級版201006溝通升級版201006
溝通升級版201006
 
溝通升級版201005
溝通升級版201005溝通升級版201005
溝通升級版201005
 
網站解剖學
網站解剖學網站解剖學
網站解剖學
 
認知簡報 20110915
認知簡報 20110915認知簡報 20110915
認知簡報 20110915
 

前端攻城獅?一堂適合小獅子的入門分享 20140729