###### tags: `Lidemy` `Coding` # Lidemy 程式導師計畫第四期 - 每週學習筆記 本篇是關於 Lidemy 程式導師實驗計畫第四期的學習筆記清單。 主要使用 [HackMD 平台](https://hackmd.io/@Heidi-Liu/note-lidemy)記錄,同時也會將筆記同步至 [Github](https://github.com/heidiliu2020/this-is-codediary) 與[個人部落格](https://heidiliu2020.github.io/)。 This is Heidi's codediary. About Lidemy / mentor-program-4th started from June 2020. All of these were written on HackMD, and also synchronized on GitHub page. Week1(06/12 ~ 06/21):暖身週 --- - [[week 1] Command Line 入門 & 基本指令](https://hackmd.io/@Heidi-Liu/note-cli) - [[week 1] 版本控制 - Git 概念 & 基本指令](https://hackmd.io/@Heidi-Liu/note-git) - [[week 1] 版本控制 - Git 進階指令 & GitHub](https://hackmd.io/@Heidi-Liu/note-git-and-github) - [[HW] 第一週(06/12 ~ 06/21):暖身週](https://hackmd.io/@Heidi-Liu/B1vc-MHa8) - [Git 版本控制:如何進行多人協作 & 同步分支](https://hackmd.io/@Heidi-Liu/git-workflow) Week2(06/22 ~ 06/28):程式基礎(上) --- - [[week 2] JavaScript 基礎 - 基本語法、值的型別、變數、迴圈、函數](https://hackmd.io/@Heidi-Liu/note-js101) - [[week 2] JavaScript - 綜合題目練習 Lv1](https://hackmd.io/@Heidi-Liu/HJT2-CVRL) - [[week 2] 先別急著寫 leetcode - 虛擬碼、Debugger、解題技巧](https://hackmd.io/@Heidi-Liu/note-alg101) - [[HW] 第二週(06/22 ~ 06/28):程式基礎(上)](https://hackmd.io/@Heidi-Liu/BkOHuy80I) Week3(06/29 ~ 07/05):程式基礎(下) --- - [[week 3] JavaScript:ES6 語法 + npm + Jest](https://hackmd.io/@Heidi-Liu/note-js102-es6) - [[week 3] 設定 eslint:用來檢查語法的工具](https://hackmd.io/@Heidi-Liu/note-eslint) Week4(07/06 ~ 07/12):網路基礎 --- - [[week 4] 網路基礎概論 - HTTP 協定、TCP/IP、API](https://hackmd.io/@Heidi-Liu/note-net101) Week5(07/13 ~ 07/19):複習週 --- - [[week 5] 複習週](https://hackmd.io/@Heidi-Liu/Bk8OGlnQw) Week6(07/20 ~ 07/26):前端基礎 HTML 與 CSS --- - [[week 6] HTML - 認識基礎標籤](https://hackmd.io/@Heidi-Liu/note-fe101-html) - [[week 6] CSS - 認識基礎標籤 & 屬性](https://hackmd.io/@Heidi-Liu/note-fe101-css) Week7(07/27 ~ 08/02):前端基礎 JavaScript --- - [[week 7] DOM 事件傳遞機制:捕獲與冒泡、事件代理](https://hackmd.io/@Heidi-Liu/note-fe201-dom) - [[week 7] DOM 介面、瀏覽器事件處理](https://hackmd.io/@Heidi-Liu/note-fe102-dom-and-event) - [【學習筆記】利用 JavaScript 實作簡易 Todo List](https://hackmd.io/@Heidi-Liu/note-js102-todolist) Week8(08/03 ~ 08/09):前端基礎串 API --- - [[week 8] 傳送資料的方式 & 瀏覽器的限制](https://hackmd.io/@Heidi-Liu/note-net101) - [week8 作業 - Ajax、JSONP、API](https://hackmd.io/@Heidi-Liu/r1uMolkfD) Week9(08/10 ~ 08/16):後端基礎 PHP 與 MySQL --- - [[week 9] 後端基礎 - PHP 語法、資料庫 MySQL](https://hackmd.io/@Heidi-Liu/note-be101-php-and-mysql) - [[week 9] 利用 PHP 實作留言板 - 初階實作篇](https://hackmd.io/@Heidi-Liu/note-be101-php) Week10(08/17 ~ 08/23):複習週 --- Week11(08/24 ~ 08/30):資訊安全 --- - [[week 11] 利用 PHP 實作留言板 - 新增功能篇](https://hackmd.io/@Heidi-Liu/note-be101-php-update) - [[week 11] 利用 PHP 實作陽春部落格](https://hackmd.io/@Heidi-Liu/note-board-php) - [[week 11] 資訊安全 - 雜湊與加密 & 常見攻擊:SQL Injection、XSS](https://hackmd.io/@Heidi-Liu/note-be101-php-security) Week12(08/31 ~ 09/06):前後端整合 --- - [[week 12] 利用 PHP 實作留言板 - API 篇](https://hackmd.io/@Heidi-Liu/note-be101-php-api) - [[week 12] 結合前端與後端功能實作 Todo List](https://hackmd.io/@Heidi-Liu/note-be101-php-todolist) - [[week 12] 前端工具之一 - jQuery 與 Bootstrap](https://hackmd.io/@Heidi-Liu/note-fe201-jquery-and-bootstrap) Week13(09/07 ~ 09/13):現代前端工具 --- - [[week 13] 前端工具之二 - CSS 預處理器、Babel](https://hackmd.io/@Heidi-Liu/note-fe201-sass-and-babel) - [[week 13] 前端工具之三 - gulp、webpack](https://hackmd.io/@Heidi-Liu/note-fe201-gulp-and-webpack) - [[week 13] MTR04 - 實作留言版 plugin](https://hackmd.io/@Heidi-Liu/note-board-plugin) - [[week 13] Fetch & Promise 補充](https://hackmd.io/@Heidi-Liu/note-fetch-and-promise) - [[week 13] 前端進階 - 如何優化執行 CSS 效能](https://hackmd.io/@Heidi-Liu/note-css-optimize) Week14(09/14 ~ 09/20):伺服器與網站部署 --- - [[week 14] 後端基礎:資料庫 & 系統設計](https://hackmd.io/@Heidi-Liu/note-database-and-system-design) - [[week 14] 網站部署 - 設定 AWS EC2 遠端主機 + Ubuntu LAMP 環境 + phpMyAdmin](https://hackmd.io/@Heidi-Liu/note-website-deployment) Week15(09/21 ~ 09/27):複習週 --- - [【中場心得】半年過去了,我仍在學習程式的路上(上篇)](https://hackmd.io/@Heidi-Liu/about-learing-part1) - [【中場心得】半年過去了,我仍在學習程式的路上(下篇)](https://hackmd.io/@Heidi-Liu/about-learing-part2) Week16(09/28 ~ 10/04):JavaScript 核心與物件導向 --- - [[week 16] JavaScript 進階 - 關於變數與資料型態](https://hackmd.io/@Heidi-Liu/note-js201-data-type) - [[week 16] JavaScript 進階 - 初探 Hoisting & Execution Context](https://hackmd.io/@Heidi-Liu/note-js201-hoisting) - [[week 16] 淺談 JavaScript:同步與非同步 & Callback Function & Event Loop](https://hackmd.io/@Heidi-Liu/note-javascript-callback) - [[week 16] JavaScript 進階 - 什麼是閉包?探討 Closure & Scope Chain](https://hackmd.io/@Heidi-Liu/note-js201-closure) - [[week 16] JavaScript 進階 - 物件導向 & Prototype](https://hackmd.io/@Heidi-Liu/note-js201-oop-prototype) - [[week 16] JavaScript 進階 - What is this?](https://hackmd.io/@Heidi-Liu/note-js201-this) - [[week 16] JavaScript 進階 - 作業練習](https://hackmd.io/@Heidi-Liu/HJdnyWQYD) Week17(10/05 ~ 10/11):現代後端開發(上) --- - [[week 17] 後端中階 - 使用 Node.js + Express 框架建立一個靜態網頁](https://hackmd.io/@Heidi-Liu/note-be201-express-node) - [[week 17] 後端中階 - Express 中不可或缺的拼圖:淺談 Middleware](https://hackmd.io/@Heidi-Liu/note-be201-express-middleware) - [[week 17] 後端中階 - Express 實戰:簡易會員註冊系統 & 留言板](https://hackmd.io/@Heidi-Liu/note-be201-express-practice) - [[week 17] 後端中階 - 淺談 Sequelize:使用 ORM 框架串接資料庫](https://hackmd.io/@Heidi-Liu/note-be201-sequelize) Week18(10/12 ~ 10/18):現代後端開發(下) --- Loading... Week19(10/19 ~ 10/25):產品開發流程 --- - [[week 19] 淺談產品開發與工作流程](https://hackmd.io/@Heidi-Liu/note-pd101) Week20(10/26 ~ 11/01):複習週 --- Loading... Week21(11/02 ~ 11/08):前端框架(一) --- - [[week 21] 前端框架 - 先別急著學 React](https://hackmd.io/@Heidi-Liu/note-fe302-review) - [[week 21] 初探 React:Component、JSX 語法、環境建置](https://hackmd.io/@Heidi-Liu/note-fe302-component-jsx) - [[week 21] React 基礎:style & 如何撰寫 CSS](https://hackmd.io/@Heidi-Liu/note-fe302-style) - [[week 21] React Hooks API:useState & 再戰 Todo List](https://hackmd.io/@Heidi-Liu/note-fe302-hooks-usestate) - [[week 21] React Hooks API:useEffect & 實作一個自己的鉤子](https://hackmd.io/@Heidi-Liu/note-fe302-hooks-useeffect) - [[week 21] React 性能優化:Virtual DOM & 如何避免 re-render](https://hackmd.io/@Heidi-Liu/virtual-dom) - [[week 21] 補充:Prettier 套件 - 自動整理程式碼格式](https://hackmd.io/@Heidi-Liu/note-prettier) - [[week 21] 補充:在 React 使用 PropTypes 進行型別檢查](https://hackmd.io/@Heidi-Liu/note-be302-proptypes) Week22(11/09 ~ 11/15):前端框架(二) --- - [[week 22] 再探 React:Function component vs Class component](https://hackmd.io/@Heidi-Liu/note-fe302-class-component) - [[week 22] React:用 SPA 架構實作一個部落格(一)- Router](https://hackmd.io/@Heidi-Liu/note-fe302-react-router) - [[week 22] React:用 SPA 架構實作一個部落格(二)- 身分驗證](https://hackmd.io/@Heidi-Liu/note-fe302-react-blog-login) - [[week 22] React:用 SPA 架構實作一個部落格(三)- 淺談測試](https://hackmd.io/@Heidi-Liu/note-fe302-react-blog-test) - [[week 22] React:用 SPA 架構實作一個部落格(四)- 優化篇](https://hackmd.io/@Heidi-Liu/note-fe302-react-blog-optimization) Week23(11/16 ~ 11/22):前端框架(三) --- Loading... Week24(11/23 ~ 11/29):前端框架(四) --- Loading... Others --- - [[Week 0] Markdown 格式介紹](https://hackmd.io/@Heidi-Liu/note-markdown) - [交作業方式 & 同步課綱](https://hackmd.io/@Heidi-Liu/S12yU9D08) - [2020.6.20 JavaScript 會寫在哪裡?](https://hackmd.io/@Heidi-Liu/Bkp548jT8) - [常見重點整理 - 命名慣例 & 開發時注意事項](https://hackmd.io/@Heidi-Liu/note-common)