
從 0 到 1 構建待辦事項應用培訓
課程編譯自 Microsoft 的開源項目 Frontend Bootcamp,將帶你從 0 到 1 構建一個待辦事項 TODO 應用。
課程的特點在于,先使用 HTML/CSS/JS 構建 Web 應用,再使用 TypeScript/React/Fabric 等技術對項目進行重構。
1 HTML 基本概念
2 JavaScript 基本概念
3 HTML/CSS/JS 構建 Web 應用
4 React 基本概念
5 CSS 基本概念
6 ES6 基本概念
7 TypeScript 基本概念
8 Fabric UI 框架使用
1
HTML 簡介
1.什么是HTML
2.Web是如何工作的
3.文檔結構
4.常見標簽
5.表格
6.表單
7.有序列表和無序列表
2
CSS 簡介
1.什么是CSS 2.CSS語法
3.CSS注釋
4.CSS常見選擇器
5.CSS創建
6.CSS常用屬性
3
JavaScript 簡介
1.什么是JavaScript
2.JavaScript用法
3.JavaScript變量
4.JavaScript函數
5.JavaScript事件
6.JavaScript邏輯語句
7.JavaScriptfor循環
8.JavaScriptDOM
4
ES6 簡介
1.ES6解構賦值
2.ES6擴展運算符
3.ES6箭頭函數
4.JSfilter()方法
5.JSmap()方法
6.JSforEach()方法
5
React 簡介
1.React安裝及簡單操作
2.React元素渲染
3.ReactJSX
4.React組件
5.函數聲明
6.類聲明
7.計數器
6
構建一個靜態頁面
1.Todo頭部
2.Todo列表
3.Todo列表項
4.Todo底部
7
用戶交互效果
1.添加狀態到TodoApp
2.拆分TodoListItem組件
3.存儲輸入框的值
4.將輸入框的值存儲到todos中
5.todos的渲染
6.Footer部分
8
TypeScript 簡介
1.TypeScript安裝及開發工具
2.TypeScript基礎類型
3.TypeScript函數
4.TypeScript接口
9
Todo App 里的 TypeScript
1.傳統js和jsx與ts和tsx的區別
2.改寫之前的準備
3.編寫TodoListProps
4.改寫appjs
5.TodoList和TodoListItem部分
6.Header部分
7.Footer部分
10
Fabric UI 庫
1.開始之前的準備
2.整體布局的修改
3.Header部分
4.TodoList和TodoListItem部分
5.Footer部分