F2E for Enterprise

C43978727926bed201399816f7efb45d?s=47 Joseph Chiang
September 24, 2013

F2E for Enterprise

Microsoft TechDay 2013

C43978727926bed201399816f7efb45d?s=128

Joseph Chiang

September 24, 2013
Tweet

Transcript

  1. 3.

    講者介紹 • 蔣定宇 / josephj • 這樣做就對了 http://josephj.com • 前端工程師,經驗

    8 年 2005 -2009 傳教士、前端工程師 2009 -2013.5 miiiCasa 前端部門主管 2013.6 迄今 Lead Front-end Developer
  2. 17.

    當代網站製作流程 產品經理 視覺設計 程式設計 我負責提需求 製作規格與框線圖 將框線圖 製作成網頁 開發流程中加⼊入了前端⼯工程師 前端工程

    後端工程 將圖轉換成網頁 負責所有「檢視原始碼」 看得到的東西 專注於視覺設計 產出 PSD 套 JavaScript ASP.NET、DB 專注於 Model 資料邏輯、效能 導入更專業的分工,讓網站開發更精緻
  3. 18.

    前端工程師 圖:PSD / PNG 網頁:HTML + JS + CSS 視覺設計師

    把圖做成真正的網頁、每個瀏覽器運作起來完全一致 最喜歡聽工程師說:「有前端真是太幸福了」
  4. 21.

    當時前端的專業何在? HTML/CSS/JavaScript 的專家 漸進式支援 無障礙 搜尋引擎最佳化 CSS Layout 瀏覽器相容性 非侵入式

    JS 網站整體的 CSS 架構 圓角 正確撰寫 HTML 讓網站開發朝正確的道路發展 到今天仍然是前端的基礎! 導入前端,大大強化了「維護性」與「效能」
  5. 24.

    2007 年:HK Asia F2E Training Nate Koechley Chris Heilmann Douglas

    Crockford 我的一個小問題,大師們認真的討論讓我感動不已 我
  6. 25.

    大師們在台灣傳承前端的種子 Nate 講 YUI @ OSDC 2008 Awoo 校園徵才與 Y!

    Course Douglas 講 JavaScript @ OSDC 2010 Chris 講 Accessibility @ OSDC 2009
  7. 26.
  8. 27.

    前端社群雨後春筍地成立 JavaScript.tw HTML5 與 CSS3 在台灣 Nodejs 台灣 快樂設計師 RGBA

    網路設計師聚會 F2E 台灣 想要在前端快速成長?你必須參與!
  9. 29.

    需要投入更多前端人力 產品經理 視覺設計 我負責提需求 製作規格與框線圖 將框線圖 製作成網頁 套 ASP.NET 前端工程

    後端工程 將圖轉換成網頁 負責所有「檢視原始碼」 看得到的東西 專注於視覺設計 產出 PSD 專注於資料邏輯 導入HTML5、Node.js、 前端 MVC 架構、Mobile 支援 測試驅動開發、持續整合
  10. 40.

    以網頁技術開發 App HTML5 純網頁 統一 Device API 以 JS 開發

    App 手機即瀏覽器 開發者的願望: 一個 App 不要寫三套 使用最多人用的語言
  11. 41.

    以網頁技術開發 App HTML5 純網頁 統一 Device API 以 JS 開發

    App 手機即瀏覽器 開發者的願望: 一個 App 不要寫三套 使用最多人用的語言 只有網頁的技術能夠達到真正的跨平台 而且不會被特定廠商所鎖死 Mobile Web 的功能會更多、手機的效能會更好 或者是有其他革命性(Firefox OS?)的發展 前端工程未來在跨 Device 只會越來越重要
  12. 49.

    網站服務應用程式化、UI 需要專業的前端工程 UI 的轉變 SaaS - 最美麗的線上會計系統 已經 8 年沒看到國內的

    CRM/ERP 的狀態 不過倒是有租用過不堪入目的企業 Portal 系統 :p 國外的競爭非常激烈 例如 CRM 可以看看 Close.io, Customer.io, Highrise 軟體公司要跟上潮流,絕對要考慮導入前端工程!
  13. 52.

    帶來最舒適的分工 • 工程師不愛處理介面細節 • 喜愛邏輯與資料、不管呈現 • 設計師不愛寫程式碼 • 喜愛呈現、不管作法 •

    前端技術日益複雜 工程師永遠滿足不了設計師 只有前端工程師可以把技術和設計完美結合
  14. 63.

    軟體工程也投入前端 將軟體工程的方法論 帶入前端開發,如: • 重複利用 • 代碼品質 • 自動化測試 •

    持續整合 • 導入工具 • 改變編程方式 越來越多的「本科系」開始重視
  15. 67.

    Why are Front-end Developers so high in demand at startup

    if Front- end Development is relatively easier than other fields of engineering? 前端開發卻是相對簡單、但為什麼前端工程師在 Start-up 需求超高? Why are Frontend Engineers in such short supply? 為什麼前端工程師如此短缺? 为什么前端工程师很难找? 為什麼前端工程師很難找? 軟體產業對前端的共同問題 同時反應了前端的真實價值、與產業的問題
  16. 68.

    Simon Willison Lanyrd.com CEO、 Django Co-creator • 與其他工程相較,前端絕對不是比較簡單的 • 需要在非常多的環境寫程式並運行

    • 開發與偵錯工具非常有限 • 好的前端可以顧及效能、安全性、與响應式設計 • 冒出的不同新技術,前端得理解並處理相容性的問題 • 說真的,後端工程師處理的事簡單多了 Seriously, Server-side developers have it easy.
  17. 74.

    規模不大,可切分 Task 多了解員工的興趣、指派一些跟 UI 相關的工作 會找到一些潛在的前端工程師,例如: • 導入 CSS 架構:更美觀且容易維護

    ex. Bootstrap, SMACSS, Normalize.css... • 導入 HTML5 圖表系統:可跨平台瀏覽 ex. amCharts, HighCharts... • 用 Responsive Design 製作 Mobile Web ex. Susy, Bootstrap Grids... • 網頁應用程式化 ex. Backbone.js, AngularJS 鼓勵員工往更專業的方向發展、又能讓網站更好,Why Not?
  18. 80.

    2004 年:在外兼課 離職!想藉由教授基礎網頁開發、把前端基礎給打好 • 第一堂課介紹 Web Developer 是什麼 • 某位學員:「我大學同學在

    Yahoo! 做這個」 • MSN 問 Hedger,他說:「我們正缺人,過來吧!」 • 就這樣莫名其妙進去了 XD
  19. 84.

    前端、你的名字叫熱血 前端工程師身體裡所流的血液:時時刻刻保持熱血! • Hedger 從無到有刻了一個 TabView 給 我看。這就是「Culture of Sharing」

    啊! • Nate 說:「前端工程師就像拿著顯微 鏡、專注於 HTML / CSS / JavaScript 的 不斷改善」 • Nate 對產品的堅持、顧客導向的精神。
  20. 85.

    Front-end engineers are right at the nexus of computer science

    and design. “前端工程師正是下個世代 電腦科學與設計的答案” Blake Elshire UX Developer at Fossil http://nate.koechley.com/blog/2008/06/11/slides-professional- frontend-engineering/#ixzz2RjtCuCat
  21. 86.

    We need more evangelists and organizations to take up this

    cause and push our profession forward. “我們需要更多的傳教士與 社群把我們的專業向前推” Blake Elshire UX Developer at Fossil http://nate.koechley.com/blog/2008/06/11/slides-professional- frontend-engineering/#ixzz2RjtCuCat
  22. 88.

    Thank you! • GitHub - josephj • Facebook - 蔣定宇

    • Slideshare - josephj • Linkedin - josephj6802 聯繫我