全端網頁軟體系統實作

臺北科技大學 114-2 學期課程，課號 359735。

課程大綱

伴隨全球資訊網(Web)普及應用，可讓不同裝置、系統運行相同網路服務的網頁平台儼然成為當下資訊系統的主要潮流，過去網頁系統的建構可區分成1.網頁前端(Front-end)：主負責使用者看見的瀏覽器端，以及2.網頁後端(Back-end)：主負責運算、儲存資源的伺服器端，不同面向的軟體人才必須熟悉不同軟體實作技巧，然而，面臨物聯網(Internet of Things)、第5代行動通訊(5G)的挑戰，產業需要能夠同時精通前端與後端之軟體實作技術，並進一步延伸支援外部系統整合與介接的全端(Full Stack)軟體人才，本課程主旨為教授網頁前端、後端軟體實作技巧，並結合新一代網路協定，建構出全方位之網頁系統軟體。除此之外，本課程之內容練習題將以教育部ITSA極客挑戰賽之考古題為例(https://www.itsa.org.tw/itsacontest/)，鼓勵修課同學可以報名參加、試試身手。 1. 修課學生可從本課程學習Web前端(Front-end)軟體實作。 2. 修課學生可從本課程學習Web後端(Back-end)軟體實作。 3. 修課學生可從本課程學習新世代Web傳輸協定實作。

課程進度

1. Course Syllabus 2. Web Overview (including the development roadmap) 3. [LAB] HTML & CSS 4. [LAB] CSS Animation 5. [LAB] CSS Frameworks 6. [LAB] Javascript & DOM 7. [LAB] JQuery & DOM 8. [LAB] Docker 9. Midterm Week 10. [LAB] PHP 11. [LAB] PHP & SQL 12. [LAB] Vue.JS Declarative Rendering 13. [LAB] Vue.JS Single-File Component (SFC) 14. [LAB] Node.JS 15. [LAB] REST(ful) API – Express 16. [LAB] WebSocket & HTTP/2 & HTTPS 17. [LAB] NodeRED 18. Final Week

評量方式

平常成績(出席率)：10% 上機練習：40% 專案或書面報告：50% 作業遲交或未遵守繳交規定，一律以0分計算

教材

【遵守智慧財產權觀念，請使用正版教科書，不得使用非法影印教科書】 使用外文原文書：否 自編教材 <開放式教材> [英文] Complete Intro to Web Development (btholt.github.io) https://btholt.github.io/intro-to-web-dev-v2/ [英文] GitHub - microsoft/Web-Dev-For-Beginners: 24 Lessons, 12 Weeks, Get Started as a Web Developer https://github.com/microsoft/Web-Dev-For-Beginners [英文] Full stack open (University of Helsinki) https://fullstackopen.com/en/ [中文] 學習該如何開發 Web | MDN (mozilla.org) https://developer.mozilla.org/zh-TW/docs/Learn <開放式教科書(Open Textbook)> [英文] The Missing Link: An Introduction to Web Development and Programming - Open Textbook Library (umn.edu) https://open.umn.edu/opentextbooks/textbooks/the-missing-link-an-introduction-to-web-development-and-programming [英文] Building User Interfaces for Modern Web Applications: React Programming - Open Textbook Library (umn.edu) https://open.umn.edu/opentextbooks/textbooks/building-user-interfaces-for-modern-web-applications-react-programming