Udemy線上課程 打造 React 即時通信 UI 庫 講師:旭乾 張 影音教學 中文發音 中文版(DVD版)
注意：課程錄製與 2020 年，重點是 CSS 樣式的打造和 React 組件化思維培養，涉及框架本身的知識不多，所以版本不重要，在學習過程中可以儘量把軟體版本和示例代碼中的一致，否則會出現不兼容的現象，或者如果你已經有良好的自學能力，可以使用最新的版本。
如果你是一名前端工程師或者是正在學習前端，苦於沒有完整的項目經驗，也沒有人系統的指導你該如何開發一箇前端項目，那麼你一定非常希望有一套課程來為你指點迷津，並且在課程結束後能收穫開發思路、項目經驗和發展方向 —— 這就是這門課的目的。
市面上大多數的課程都圍繞電商、企業官網、後台管理來做項目實戰。
而本課程不同的是：以即時通信應用 UI 組件庫和示例頁面作為切入點，全面的演示了一套完整的 UI 庫的實現過程，課程結束後，不但可以增加項目經驗，擴充作品集，還可以在此基礎上擴展為應用到各行各業的 UI 庫，就像 Ant Design 和 Element UI。
這門課程以 React 為核心技術框架，為什麼選擇了 React 而不是用的人數比較多的 Vue 呢？因為：
React 更接近於原生的 HTML，相當於自定義 HTML 標籤，入門更容易。
React 編寫的代碼簡潔，讓開發者只關心組件的定義和狀態的管理，其他像組件的註冊都由 React 自行管理。
React 的用戶量龐大，生態系統完善，很多開發理念都是圍繞 React 產生的，比如 CSS-in-JS，GraphQL。
React 在國內大型企業應用廣泛，掌握 React 開發的工程師求職更有競爭力。
學完本課程你將能夠...
熟練使用 React 及其生態開發 UI 組件培養組件化的設計與開發思維開發可複用的組件，提升開發效率瞭解企業協作開發的方式
你將學到...Styled-Components 強大的組件樣式管理Storybook 組件文檔化，方便團隊協作React Spring 動畫實現React 組件設計思想設計思維以及更多
課程包括：1 整套通用的 React UI 組件庫30+ 常用組件5 個示例即時通信頁面源代碼圖片素材
課程不包括：
課程重點關注前端 UI 組件化設計思路，打造自有前端 UI 庫，類似 Ant Design, 所以下列內容不包含在本課程中：Redux 數據流管理後端即時通信業務邏輯
面向人群：
需要擁有紮實的 HTML、CSS、JS 基礎
瞭解 React 基本概念（屬性，狀態）（非必需）
如果你沒有 React 基礎，也能夠學會 HTML+ CSS 實現常見的 UI 組件。
如果你是 UI 設計師可以幫助你更好的跟前端工程師溝通
01 - 介紹
001 項目演示.mp4
002 課程簡介.mp4
003 react-UI.zip
003 源代碼下載.html
02 - 環境配置
001 安裝 Node.js.mp4
002 安裝 VS Code 和插件.mp4
003 安裝 Yarn.mp4
004 建立 React 工程.mp4
005 React 快速回顧.mp4
006 Styled-components 簡介與配置.mp4
007 Storybook 簡介與配置.mp4
03 - 組件與頁面規劃
001 組件與頁面規劃.mp4
04 - 側導航
001 頭像組件-設計與分析.mp4
002 頭像組件 - React 部分.mp4
003 頭像組件 - 樣式部分.mp4
004 頭像組件 - 添加屬性.mp4
005 jsconfig.json 文件介紹.mp4
006 Hygen 模板生成器配置.mp4
007 Icon 組件.mp4
008 徽章組件.mp4
009 菜單項組件.mp4
010 側導航組件.mp4
05 - 側邊欄
001 搜索框.mp4
002 排版組件.mp4
003 下拉選項組件-過濾.mp4
004 按鈕組件.mp4
005 過濾選項組件.mp4
006 消息卡片組件.mp4
007 消息列表組件.mp4
06 - 內容區
001 標題欄組件.mp4
002 會話氣泡組件.mp4
003 語音消息組件.mp4
004 Emoji組件.mp4
005 Popover組件.mp4
006 底部操作組件.mp4
007 會話窗口組件.mp4
07 - 滑動抽屜
001 個人資料&頭像組件.mp4
002 個人信息部分.mp4
003 社交信息部分.mp4
004 分隔線組件.mp4
005 聯系信息部分.mp4
006 相冊部分.mp4
007 關閉按鈕.mp4
08 - 設置頁面
001 InputText組件.mp4
002 Select(表單)組件.mp4
003 Radio組件.mp4
004 Switch開關組件.mp4
005 個人資料-設置頁.mp4
006 編輯個人資料組件.mp4
007 設置項組件.mp4
008 設置頁面.mp4
009 屏蔽列表組件.mp4
09 - 其他列表組件
001 抽離過濾列表組件.mp4
002 聯系人列表組件.mp4
003 文件列表組件.mp4
004 筆記列表組件.mp4
10 - 其他組件
001 影片通話組件.mp4
002 Dropdown組件.mp4
003 組裝聊天首頁.mp4
11 - 路由管理
001 React Router 簡介.mp4
002 配置導航路由.mp4
003 配置內容區域路由.mp4
12 - 建立動畫
001 React Spring 簡介.mp4
002 Staggered Animation 配置.mp4
003 抽離動畫為自定義的 hooks.mp4
004 導航切換過渡動畫.mp4
005 會話窗口動畫.mp4
006 個人資料抽屜動畫.mp4
007 設置頁面動畫.mp4
13 - 添加示例數據（本地）
001 添加示例數據.mp4
14 - 總結與回顧
001 總結與回顧.mp4
15 - 版本更新（2023）
001 遷移 styled-components 5.3.mp4
002 遷移 React Router 6.3.mp4
003 遷移 React Spring 9.5.mp4
004 遷移 Create React App 5.0.mp4
005 遷移 React 18.2.mp4
006 遷移 storybook 6.5.mp4
007 遷移 font awesome 6.1.mp4
|
|
專業知識教學
