JavaScript 程式設計新手村

如果軟體正要吃掉全世界，你可以選擇的就是學好 JavaScript 

全新課程，全新上架。實戰應用為主，理論為輔，更易吸收，馬上學，馬上用！Facebook 聊天機器人、Chrome Extensions、開放資料、即時聊天室、網路相簿、網路爬蟲、NodeJS 與資料庫後端開發，多個願望一次滿足！

➡️ 單元1 JavaScript 程式設計初體驗（Pokemon Fight 精靈快打）搶先試看！

什麼是 JavaScript ？

Java 和 JavaScript 雖然名稱相似，但卻是熱狗和狗的差別。JavaScript 是由 Netscape 工程師 Brendan Eich 於 1995 年僅花 10 天所設計的程式語言。JavaScript 是一種直譯式、基於原型（prototype based）的物件導向程式語言，但又具有函數式程式設計（Functional programming）的特性。其具備簡單好上手、應用範圍廣泛，容易有成就感，但精通不易等特性。過去一段時間 JavaScript 一直被認為是玩具語言，難登大雅之堂。但隨著版本的演進，再加上 NodeJS 的出現，讓 JavaScript 由黑翻紅成為程式語言的當紅巨星（是的，你現在瀏覽的 Hahow 好學校網站的前後端都是用 JavaScript 寫的），目前雄據在程式語言排行榜前幾名，除了網頁開發外，在許多的領域都可以看到 JavaScript 的身影。

# 簡單有趣的《Pokémon GO 》對戰遊戲（Pokemon Fight 精靈快打）範例讓學員感受 JavaScript 的特性 

課程特色

1. 去蕪存菁，完整介紹 JavaScript 優良且重要的部份。讓學員可以系統性學習，打好程式設計基礎（課程內容將以最新 JavaScript 標準 ES6+ 為主）

2. 由淺入深系統性學習原生 JavaScript 和程式設計的重要觀念， 讓你不只會用 jQuery 還了解它背後使用的原理，並為未來離開新手村出發挑戰前端進階學習打好堅實基礎知識，培養自學各種前端框架和工具的能力

3. 以學生的需求為核心，傾聽學習需求，由教學和自學經驗豐富的講師和助教協助授課（累計教授學員人數超過 500 人次，過去授課講義和課程網站），針對不同學員狀況因材施教。我們會針對學員的學習狀況去做時間和課程內容彈性調整

4. 講究大量動手實作練習，透過案例充分練習應用程式開發，並鼓勵組成學習小組進行學習並認識志同道合的戰友，快來和朋友一起解鎖進階免費課程吧！

5. 完整售後服務：不定期更新講義和範例程式並持續分享自學程式學習資源、未來自學前端進階框架、工具的基礎和學習資源和地圖於課程學習社團。學員購買課程後三個月內課程相關問題諮詢（課程上架後）

6. 累積自己的作品，讓求職、轉職之路更加順暢，給自己一個機會實現夢想

7. 在目前的業界，前端工程的定位光譜非常廣泛，有聚焦在網頁設計（Web Design），也有專注在軟體工程（Software Engineering）的部份，本課程則是將前端工程定位在軟體工程的範疇

延伸閱讀：關於 Web 前端工程入門簡介 

若說程式語言中最勵志的故事， JavaScript 絕對可以排到前幾名，從過去的跑龍套到現在獨挑大樑。現在的 JavaScript 不僅是網頁開發中最重要的明星，更可以開發手機 App、物聯網（IoT）、VR/AR 應用程式。本課程將會帶領大家從零開始打好 JavaScript 基礎，由淺入深介紹 JavaScript 重要特性，實作有趣的應用程式，最後帶領大家實作課後專題，做出一個屬於自己的 Chrome 瀏覽器外掛程式，並上架到 Google Chrome 市集。

當你會看到你的程式碼如預期般正確跑起來而感動時，你就具備了學寫程式的資質了！

課程單元說明

1. 單元1 JavaScript 程式設計初體驗（Pokemon Fight 精靈快打）
2. 單元2 JavaScript 開發環境建置、Github 與瀏覽器 DevTool 教學 
3. 單元3 JavaScript 快速基礎入門（變數、資料型別、運算元運算子、流程控制）
4. 單元4 JavaScript 快速基礎入門（函式、陣列與物件、迴圈、事件處理）
5. 單元5 JavaScript 快速基礎入門（Ajax 非同步資料傳遞）
6. 單元6 實戰範例：匯率計算應用程式（JavaScript 函數 Function 基礎） 
7. 單元7 實戰範例：TodoList 代辦事項應用程式（JavaScript 函數 Function 基礎）
8. 單元8 實戰範例：倒數計時（BOM & DOM 操作基礎與事件處理 Event Handle、SetInterval） 
9. 單元9 實戰範例：蟲蟲大戰：打蚊子遊戲（BOM & DOM 操作基礎與事件處理 Event Handle）   
10. 單元10 實戰範例：幻燈片相簿（BOM & DOM 操作基礎與事件處理 Event Handle） 
11. 單元11 實戰範例：政府開放資料 API 範例（流程控制、Ajax / JSON 基礎介紹）
12. 單元12 實戰範例：jQuery 入門範例（套件使用）
13. 單元13 實戰範例：部屬 JavaScript 應用程式到 Github Page
14. 單元14 實戰範例：Chrome Extensions 基礎（表特分頁，Ajax）
15. 單元15 實戰範例：上架自己的 Chrome Extensions
16. 單元16 實戰範例：NodeJS Web 基礎（iRich） 

17. 單元17 實戰範例：NodeJS 與 Socket.io 基礎（雲端聊天室）

18. 單元18 實戰範例：NodeJS Web 基礎與（Facebook Messenger API Chatbot）
19. 單元19 實戰範例：部屬應用程式到 Heroku 雲端伺服器
20. 募資金額 100% 解鎖：前端開發面試常見問題研討
21. 募資金額 200% 解鎖：Google Map API 實戰入門
22. 募資金額 400% 解鎖：NodeJS 網路爬蟲入門實戰 
23. 募資金額 600% 解鎖：NodeJS Web 基礎前後端分離（iRich）
24. 募資金額 800% 解鎖：Electron 桌面應用程式開發入門（beauty+）
25. 募資金額 1000% 解鎖：JavaScript ReactJS 應用程式開發入門初體驗

進階補充：現代化 Web 開發知識

我們將針對學員學習狀況補充現代化 Web 開發知識、JavaScript 應用程式開發重要觀念和冷知識（如：現代化 JavaScript 前端模組化開發/Git/Github/Server 尋找/Domain購買小撇步等），盡量能兼顧新手和進階學員學習需求，也歡迎分享給有興趣的朋友一起解鎖完整免費進階課程:)

＊所有課程相關內容，講師將視實際作業保留最後調整之權利

# 單元11 整合 JavaScript 、Chart.js、Bootstrap 後端 Firebase 雲端資料庫開發簡單記帳應用程式

# 單元12 整合 Gank.io API 和 HTML5/CSS3 Chrome Extension 實戰教學：表特分頁

課程解鎖

“一個人學寫程式很孤獨，一群人學寫程式才幸福。趕快分享給你的朋友，解鎖額外免費課程！Happy Coding :)”

1. 募資金額 100% 解鎖：前端開發面試常見問題研討（已成功解鎖）

2. 募資金額 200% 解鎖：Google Map API  / Facebook API 新手入門（已成功解鎖）

3. 募資金額 400% 解鎖：NodeJS 網路爬蟲入門實戰（已成功解鎖）

4. 募資金額 600% 解鎖：NodeJS / Express / MongoDB 新手入門 JavaScript 後端開發（已成功解鎖）

5. 募資金額 800% 解鎖：Electron 桌面應用程式開發入門（已成功解鎖）

6. 募資金額 1000% 解鎖：JavaScript 主流前端函式庫/框架簡介與 ReactJS 入門初體驗（已成功解鎖）

7. 募資金額 1500% 解鎖：React Native 行動應用程式開發入門（Naitve Mobile App）

8. 募資金額 2000% 解鎖：JavaScript IoT 應用入門

9. 募資金額 3000% 解鎖：WebVR 入門

若你學會 JavaScript 和 Google Map API 後，你也可以結合政府開放資料和  Google Map API  製作出創新地圖應用！

# 單元9 Fetch / Ajax / JSON 整合寵物政府開放資料

課後專題製作與作業

程式唯有動手實作才能學的好，所以我們每堂課程將搭配 Codecademy 和講師補充練習和範例，讓學員可以透過大量練習實作，充分練習如何開發應用程式。

最後也將透過課程作業區帶領大家實作課後專題，做出一個屬於自己的 Chrome 瀏覽器外掛程式，並上架到 Google Chrome 市集，讓你的學習成果可以和家人朋友分享！

課程介紹

• 你是否曾經想學寫程式，卻面對琳琅滿目的程式語言無所適從 ？
• 你是否曾經想要入門 JavaScript 卻苦無好的學習資源或是英文不好而被擋在門外 ？
• 你否因為工作需求想要開始系統性學習 JavaScript 打好基礎？
• 你否曾想要將自己寫好的程式上架到市集給心儀的女生/男生使用卻苦無機會？
• 你是否曾上過 Codecademy  的每一門基礎課程，卻還是無法開始開發屬於自己的應用程式？
• 你是否希望能了解研發人員（RD）的想法，成為更好的產品經理、行銷企劃人員？

不管你是想要開始學習寫程式或是轉職前端工程師提高自己工作的專業能力，又或是單純對於學習資訊技術有興趣。趕快加入我們，一起跟著教學經驗豐富的講師、助教還有同學們一起開始從零開始學 JavaScript！ 在學習完課程後學員除了對於 JavaScript 有系統性的認識，更可以使用 JavaScript 開發一個屬於自己的 Chrome 瀏覽器外掛程式，為自己的履歷增添一筆。

“預計每個單元約 10-25 分鐘，共 12 堂的課程設計，隨時隨地上課輕鬆無負擔。”

講師介紹

張凱迪（KD Chang）台灣大學，主修經濟學，臺大資管所。服務過上市電子公司、全球前三大瀏覽器製造商、電子商務公司和活動入口網站，也曾參與數個新創組織的創辦，同時也是 React 入門教學書《從零開始學 ReactJS》作者、TechBridge Weekly 技術週刊 和 HackNTU 臺大黑客松 發起人暨共同創辦人。夢想是做出人們想用的產品和辦一所心目中理想的學校。A Starter, Software Engineer & Maker. JavaScript, Python & Arduino/Android lover.:)

（image via ytimg、96pk、nghiem、wiki、emberify、virtualrealityreporter、i18next、qlikshare、twimg、pokecrew, audio via ValentinSosnitskiy）

影片單元

本課程為求盡力滿足不同背景的學員需求，設計了理論與實習課程（每個單元長度約 10 - 20 分鐘）。課程購買連結

＊由於字幕的製作需要點時間和人力成本，陸續完成中

1. 單元1 JavaScript 程式設計初體驗（Pokemon Fight 精靈快打）
2. 單元2 JavaScript 開發環境建置、Github 與瀏覽器 DevTool 教學 
3. 單元3 JavaScript 快速基礎入門（變數、資料型別、運算元運算子、流程控制）
4. 單元4 JavaScript 快速基礎入門（函式、陣列與物件、迴圈、事件處理）
5. 單元5 JavaScript 快速基礎入門（Ajax 非同步資料傳遞）
6. 單元6 實戰範例：匯率計算應用程式（JavaScript 函數 Function 基礎） 
7. 單元7 實戰範例：TodoList 代辦事項應用程式（JavaScript 函數 Function 基礎）
8. 單元8 實戰範例：倒數計時（BOM & DOM 操作基礎與事件處理 Event Handle、SetInterval） 
9. 單元9 實戰範例：蟲蟲大戰：打蚊子遊戲（BOM & DOM 操作基礎與事件處理 Event Handle）   
10. 單元10 實戰範例：幻燈片相簿（BOM & DOM 操作基礎與事件處理 Event Handle） 
11. 單元11 實戰範例：政府開放資料 API 範例（流程控制、Ajax / JSON 基礎介紹）
12. 單元12 實戰範例：jQuery 入門範例（套件使用）
13. 單元13 實戰範例：部屬 JavaScript 應用程式到 Github Page
14. 單元14 實戰範例：Chrome Extensions 基礎（表特分頁，Ajax）
15. 單元15 實戰範例：上架自己的 Chrome Extensions
16. 單元16 實戰範例：NodeJS Web 基礎（iRich） 

17. 單元17 實戰範例：NodeJS 與 Socket.io 基礎（雲端聊天室）
18. 單元18 實戰範例：NodeJS Web 基礎與（Facebook Messenger API Chatbot）
19. 單元19 實戰範例：部屬應用程式到 Heroku 雲端伺服器
20. 募資金額 100% 解鎖：前端開發面試常見問題研討
21. 募資金額 200% 解鎖：Google Map API 實戰入門
22. 募資金額 400% 解鎖：NodeJS 網路爬蟲入門實戰 
23. 募資金額 600% 解鎖：NodeJS Web 基礎前後端分離（iRich）
24. 募資金額 800% 解鎖：Electron 桌面應用程式開發入門（beauty+）
25. 募資金額 1000% 解鎖：JavaScript ReactJS 應用程式開發入門初體驗