---
# System prepended metadata

title: 學習規劃
tags: [關於我]

---

---
title: 學習規劃
tags: 關於我
date: 2021/8/13
---

###### tags: `關於我`

###### *Last updated: 2021/9/4*

# 📅 學習規劃

[TOC]

## 學習進度

### 九月 September

:::spoiler 點此查看**React 製作作品** 學習進度

- [ ] 電商網站前台
- [ ] 電商網站後台
- [ ] 接案平台
:::

:::spoiler 點此查看**MongoDB** 學習進度

- [x] MongoDB 與其他資料庫的差異
- [x] MongoDB 設定
- [x] MongoDB 圖形化操作安裝
- [ ] MongoDB CRUD
:::

:::spoiler 點此查看**Express** 學習進度

- [x] Express 安裝
- [ ] Express
:::

---

### 八月 August

:::spoiler 點此查看**六角學院 - Vue 3 新手夏令營** 學習進度

- [x] Vue 3 Composition API
- [x] 使用 Composition API 實作 代辦事項
- [x] Composition API Kata 練習
- [x] Firebase + Vue 製作即時聊天室
- [ ] 實作 即時聊天室
:::

:::spoiler 點此查看**從 0 開始學 React 篇** 學習進度

- [x] React 受控組件 與 非受控組件
- [x] React 高階函數柯里化
- [x] React 生命週期
- [x] React 的 diffing 算法
- [x] React 框架
- [x] 實作 to do list
- [x] 實作 GitHub 搜索功能
- [x] 實作 SPA 網站
- [x] redux
:::

:::spoiler 點此查看**架設自己的部落格** 學習進度

- [x] Hexo 安裝
- [x] Hexo 套用樣式
- [x] Hexo 自定義結構
- [x] Hexo 如何開始寫文章
- [x] Hexo 套件安裝
- [x] Hexo 評論系統
- [x] Hexo 搜索系統
- [ ] Hexo 統計系統
- [x] Hexo 部屬
:::

---

### 七月 July

:::spoiler 點此查看**六角學院 - Vue 3 新手夏令營** 學習進度

- [x] Vue 3 起步走
- [x] 實作 Vue 3 資料串接
- [x] Vue 3 與指令
- [x] 實作 Vue 3 計算機
- [x] Vue 3 Options API
- [x] 使用 Options API 實作 代辦事項
:::

:::spoiler 點此查看**從 0 開始學 React 篇** 學習進度

- [x] React 基礎
- [x] React 組件 與 模組
- [x] React 三大屬性 State
- [x] React 三大屬性 Props
- [x] React 三大屬性 Refs
:::

---

### 六月 June

:::spoiler 點此查看**六角學院 - 程式體驗營** 學習進度

- [x] RWD - 伸縮自如的RWD 排版術
- [x] SCSS - 環境建立、基礎語法教學
- [x] SCSS - Sass 變數常用語法一鍵設定
- [x] SCSS - import 切版檔案好工具，維護管理更方便
- [x] SCSS - Sass/CSS 設計模式 - 教您最實用的網頁收納術
- [x] Bootstrap5 - 環境建立
- [x] Bootstrap5 - 格線系統+元件整合
- [x] Bootstrap5 - 元件與常用 JS 效果介紹
- [x] JS - JavaScript 課前知識與環境介紹
- [x] JS - 變數與資料型別
- [x] JS - let、const、var 介紹
- [x] JS - 網頁與 Code 環境建立流程教學
- [x] JS - 數字型別與賦值運算子
- [x] JS - 字串型別詳解
- [x] JS - 變數：布林、undefined、null
- [x] JS - 比較與邏輯運算子
- [x] JS - 流程判斷 - if、else if、else
- [x] JS - if 流程圖規劃流程
- [x] JS - if 中階運用
- [x] JS - 陣列教學
- [x] JS - 物件教學
- [x] JS - 陣列與物件整合運用
- [x] JS - 函式 function
- [x] JS - DOM 網頁選取元素
- [x] JS - Event 事件，讓您的網頁具有互動效果
- [x] JS - 陣列 forEach 資料處理方法
- [x] JS - forEach 題型練習
- [x] JS - 從 Wireshark、Fiddler 深入瞭解網路請求
- [x] JS - 計算機網路詳解
- [x] JS - AJAX 網路請求
- [x] JS - AJAX axios 套件教學
- [x] JS - AJAX POST API 講解
- [x] JS - todolist 待辦事項
:::

---

### 五月 May

:::spoiler 點此查看**六角學院 - 程式體驗營** 學習進度

- [x] CSS - VS Code 網頁編輯器、HTML 基礎教學
- [x] CSS - CSS常用語法
- [x] CSS - 使用 CSS 變更 HTML 標籤特性
- [x] CSS - Flex 網頁排版技巧
- [x] CSS - Flex 精神時光屋
:::

:::spoiler 點此查看**產業新尖兵** 學習進度

- [x] 網路基本運作認識
- [X] 網路模型運作、ICMP 與 ARP 協定
- [X] 網際網路協定 IPv4 規劃
- [X] Cisco IOS 介紹與常用設定
- [X] 路由協定原理及基礎路由RIP
- [X] Cisco EIGRP 路由協定介紹與設定
- [X] 單一區域與多重區域 OSPF 路由協定
- [X] 交換器基礎功能 - Vlan、Vlan Routing、Trunk 與 DTP
- [X] 交換器進階功能 - VTP、Port-Securit 與 STP
- [x] 網路攻防實務
- [x] HTTP 通訊協定
- [x] HTML5 語法架構
- [x] CSS3 佈局
- [x] RWD 響應式網頁
- [x] JS 條件判斷
- [x] JS 迴圈
- [x] JS 陣列
- [x] JS 函式
- [x] JS 物件
- [x] DOM & BOM
- [x] JS 內建函式
- [x] ES6
- [x] Promise 物件
- [x] Bootstrap 5
- [x] Node.js
- [x] NPM 套件管理
- [x] Express 框架
- [x] MVC 設計模式
- [x] React
- [x] SPK
- [x] XAMPP
- [x] Linux
- [x] Virtual Box
- [x] PHP
- [x] MySQL
- [x] Heroku
:::

---

## 技術能力

### HTML

- [x] 基本 tag 運用
- [x] 語意化標籤
- [x] 了解 meta tag 屬性

### CSS

- [x] Position 運用
- [x] Flexbox
- [x] 選擇器
- [x] 偽元素
- [x] 權重分數
- [x] OOCSS 命名規則
- [x] BEM 命名規則
- [x] RWD 響應式
- [x] Sass & SCSS
- [x] CSS 動畫
- [ ] 3D
- [x] CSS frame( Bootstrap 5 )

### Javascript

- [x] 運算子
- [x] 迴圈
- [x] 判斷式
- [x] 選擇器
- [x] 函數
- [x] 柯里化
- [x] ES6
- [x] AJAX
- [x] Promise
- [ ] RESTful API
- [x] this 指向

### React.js

- [x] React 組件
- [x] React 三大屬性
- [x] React Proptypes
- [x] React 高階函數
- [x] React 生命週期
- [x] React 框架
- [x] React SPA
- [x] React redux

### Vue.js

- [ ] Vue 2
- [ ] Vue cli
- [x] Vue 3 基礎指令
- [x] Vue 3 進階指令
- [x] Vue 3 Composition API
- [x] Vue 3 生命週期

### Git

- [x] Git add & commit
- [x] Git push
- [x] Git pull
- [x] Git depoly
- [x] Git branch
- [x] Git checkout
- [ ] Git remote
- [x] GitHub pages

### Node.js

- [x] NPM 管理
- [x] Express

### 資料庫

- [x] MongoDB
- [x] MySQL

#### 其他

- [ ] Three.js
- [ ] PixiJS
- [ ] gulp
- [ ] Webpack
- [ ] Hexo

#### PHP

#### Unity

#### 其他

[英文](/5WSqPfQiRIOKqQwz6Lni-w)
[心理](/vDS_jn53S2S6qTWZfSdmag)

{%hackmd @JohnsonMao/theme-Wood-Fired %}
