2024年可能會是鴻蒙最火爆的一年,鴻蒙人才的緊缺,讓不少開發(fā)者都心動,最近收到不少伙伴的私信想了解鴻蒙的學(xué)習(xí)線路,特意整理了下。喜歡的可以加個收藏。
千鋒鴻蒙學(xué)習(xí)路線分為四部分:
01第一站:開發(fā)熱身
開發(fā)熱身總共有5步,以下是步驟詳解:
第1步:Web 頁面布局
HTML:HTML元素和屬性;HTML表單和圖形處理;HTML媒體和最佳實(shí)踐
CSS:CSS基本語法與選擇器;CSS背景、文本、邊框、輪廓與顏色;CSS列表、表單與表格樣式;CSS樣式層疊與繼承;CSS盒模型、定位、浮動和顯示屬性;CSS漸變、陰影與濾鏡;CSS變換、過渡與動畫; Web字體與多列布局
頁面制作工具:VSCode及插件;PhotoShop的使用和圖片整合;markman、pxcook工具使用;藍(lán)湖、sketch與axure工具使用
布局技術(shù):BFC、IFC、GFC、FFC等概念;Flex彈性布局;網(wǎng)格布局;媒體查詢;viewport、rem、vw、dpr與ppi
布局規(guī)范與方案:PC端網(wǎng)站布局規(guī)范;PC端管理系統(tǒng)布局規(guī)范;流式布局(100%布局);等比縮放布局(rem布局);響應(yīng)式布局;移動端reset, 1px border, 高清圖片;移動端設(shè)備適配最佳實(shí)踐.
第2步:JavaScript 語言
原生JavaScript交互功能開發(fā):基本語法;流程控制語句;函數(shù)與數(shù)組;String與Date;BOM與DOM;拖拽效果;客戶端存儲(cookie存儲、WebStorage);正則表達(dá)式;Ajax;面向?qū)ο蠡A(chǔ);運(yùn)動與游戲開發(fā);數(shù)據(jù)結(jié)構(gòu)與算法。
面向?qū)ο筮M(jìn)階與ES應(yīng)用:Promise;async/await語法;try/catch語法;原型鏈;構(gòu)造函數(shù);執(zhí)行上下文棧與執(zhí)行上下文;作用域鏈;閉包;this;ES5-ES12;設(shè)計(jì)模式。
JSON 數(shù)據(jù)交換格式:JSON 語法規(guī)則;JSON5 的使用
第 3 步:TypeScript 語言
基礎(chǔ)入門:TypeScript 介紹;TypeScript 入門;常用類型;類型縮小;函數(shù);對象類型;類型操縱類;模塊。
高級進(jìn)階:變量聲明;類型推斷;枚舉;公共類型;Symbols;類型兼容性;迭代器和生成器;裝飾器;JSX;混入;三斜線指令;模塊;模塊解析;命名空間;命名空間與模塊;聲明合并。
第 4 步:Node.js
前端工程化與模塊化:Linux 常用命令;Less/Sass;NPM;Git 的使用;AMD/CMD/UMD;ES6模塊化
高級進(jìn)階:Node.js 服務(wù)端開發(fā);Node 基礎(chǔ)入門;Express 框架基礎(chǔ);中間件開發(fā);MVC開發(fā)模式;基于Express的后端路由;MongoDB數(shù)據(jù)庫的基本使用;MySQL數(shù)據(jù)庫的基本使用;基于Token的登錄狀態(tài)保持;Node.js的EventLoop;文件上傳(單文件/多文件);模板引擎;靜態(tài)資源加載;服務(wù)端渲染頁面
第 5 步:構(gòu)建工具
Webpack:
基礎(chǔ)入門:為什么需要Webpack;小試 Webpack;自動引入資源;搭建開發(fā)環(huán)境;資源模塊;管理資源;使用 babel-loader;代碼分離;緩存;懶加載;拆分開發(fā)環(huán)境和生產(chǎn)環(huán)境。
高級進(jìn)階:提高開發(fā)效率,完善團(tuán)隊(duì)開發(fā)規(guī)范;模塊與依賴;擴(kuò)展功能;多頁面應(yīng)用;Tree shaking;漸進(jìn)式網(wǎng)絡(luò)應(yīng)用程序 PWA;shimming 預(yù)置依賴;創(chuàng)建 library;模塊聯(lián)邦;提升構(gòu)建性能。
vite:為什么選用Vite;搭建Vite開發(fā)環(huán)境;創(chuàng)建第一個Vite項(xiàng)目;NPM依賴解析和預(yù)構(gòu)建(依賴預(yù)構(gòu)建簡介、esbuild、緩存);模塊熱重載(常用框架集成、HMR-API);Vite+TypeScript;Vite中的Vue和JSX(使用Vite創(chuàng)建Vue2項(xiàng)目、Vite支持Vue3使用JSX);在Vite中使用CSS;Vite靜態(tài)資源引用;Vite中使用WebWorker;Vite中引入WebAssembly;Vite中導(dǎo)入JSON及Glob導(dǎo)入;Vite中集成ESLint;構(gòu)建生產(chǎn)版本;環(huán)境變量和模式;騰訊云Webify項(xiàng)目部署;服務(wù)端渲染SSR(Vue3案例、React案例);后端集成。
02第二站:開發(fā)入門
第二站總共分7步,涉及鴻蒙應(yīng)用開發(fā)及arkts語言等,以下是詳細(xì)步驟:
第 1 步:走進(jìn)鴻蒙應(yīng)用開發(fā)
分為10個部分,以下是具體:
1、攜手打造全場景鴻蒙生態(tài)
2、HarmonyOS 應(yīng)用開發(fā)技術(shù)新進(jìn)展
3、ArkTS 語言和演進(jìn)
4、ArkUI 開發(fā)框架,打造精致UI交互體驗(yàn)
5、ArkUI 跨平臺方案
6、高性能應(yīng)用探索之旅
7、HarmonyOS 端云開放能力
8、文件存儲與數(shù)據(jù)管理
9、HarmonyOS 暢聯(lián),自由分享
10、HarmonyOS 網(wǎng)絡(luò)應(yīng)用開發(fā)
第 2 步:通關(guān)HarmonyOS應(yīng)用開發(fā)者基礎(chǔ)認(rèn)證
第二步涉及12個部分,以下是具體:
1、使用 DevEco Studio 高效開發(fā)
2、構(gòu)建第一個 ArkTS 應(yīng)用
3、ArkTS 開發(fā)語言
4、應(yīng)用程序框架
5、使用常用組件構(gòu)建頁面
6、動畫基礎(chǔ)應(yīng)用
7、HTTP數(shù)據(jù)請求
8、應(yīng)用數(shù)據(jù)管理
9、給應(yīng)用添加通知和提醒
10、應(yīng)用服務(wù)上架
11、三方庫的基本使用
12、HarmonyOS 云開發(fā)簡介
第3步:深入學(xué)習(xí) ArkTS 語言
第三步涉及8個部分,以下是具體:
1、ArkTS 在 TS 上基本語法能力擴(kuò)展
2、ArkTS 在 TS 上狀態(tài)管理能力擴(kuò)展
3、ArkTS 在 TS 上渲染控制能力擴(kuò)展
4、ArkTS 語言常用的基礎(chǔ)能力
5、ArkTS 語言并發(fā)能力
6、ArkTS 語言 XML/URL/URI 解析構(gòu)造等能力
7、ArkTS 語言進(jìn)程信息獲取和操作能力
8、ArkTS 線性和非線性容器
第4步:Stage 模型開發(fā)
第四步有12個部分,以下是具體:
1、應(yīng)用模型概述
2、應(yīng)用/組件級配置
3、UIAbility 組件
4、ExtensionAbility 組件
5、AbilityStage 組件容器
6、應(yīng)用上下文 Context
7、信息傳遞載體 Want
8、任務(wù)管理模型
9、后臺任務(wù)管理
10、進(jìn)程模型
11、線程模型
12、Ability開發(fā)案例
第5步:UI 開發(fā)案例集
第五步涉及14個部分,以下是具體:
1、視頻APP開發(fā)
2、電子相冊案例
3、構(gòu)建多種樣式彈窗
4、簡易計(jì)算器
5、抽獎輪盤應(yīng)用
6、像素轉(zhuǎn)換案例
7、二級聯(lián)動案例
8、目標(biāo)管理案例
9、布局案例大合集
10、可刷新的排行榜
11、動效、專場動畫與自定義下拉刷新動畫
12、Web組件之 Cookie 常見操作
13、Swiper 與 Slider 案例
14、List 組件案例
第6步:設(shè)備與交互開發(fā)
第六步涉及5個部分,以下是具體:
1、設(shè)備管理
2、公共事件與通知
3、窗口管理
4、多媒體開發(fā)
5、電話服務(wù)
第7步:網(wǎng)絡(luò)連接與數(shù)據(jù)文件管理
第七步涉及7個部分,以下是具體:
1、網(wǎng)絡(luò)管理
2、IPC與RPC通信
3、用戶首選項(xiàng)
4、關(guān)系型數(shù)據(jù)庫(RelationalStore)
5、分布式數(shù)據(jù)對象
6、文件管理
7、網(wǎng)絡(luò)連接與數(shù)據(jù)庫案例
03第三站:進(jìn)階開發(fā)
第三站進(jìn)階開發(fā)總共分為9步,以下是具體:
第 1 步:WebView 適配開發(fā)
1、Web 組件和 WebView 概念介紹
2、Web 組件的基本使用
3、WebView 的基本使用
4、案例開發(fā):Web 組件抽獎
第 2 步:Native 適配開發(fā)
1、Native API 基本知識
2、Native API 開發(fā)流程
3、Native API 典型開發(fā)場景
4、Native API 代碼集成
第 3 步:常用三方庫的使用
1、三方庫介紹 HAR
2、三方庫中心倉與包管理工具
3、三方庫開發(fā)移植和發(fā)布
4、應(yīng)用開發(fā)中使用 ohpm 管理開源三方庫
5、一個例子:@ohos/axios:網(wǎng)絡(luò)請求庫
6、在三方庫中心倉查找更多的三方庫
第 4 步:一次開發(fā),多端部署
1、定義和目標(biāo)
2、界面級一多開發(fā)
3、功能級一多開發(fā)
4、工程級一多開發(fā)
5、購物應(yīng)用案例
6、音樂專輯案例
第 5 步:端云一體化開發(fā)
1、端云一體化工程簡介和概覽
2、工程創(chuàng)建及配置
3、端云一體化組件集成
4、云函數(shù)開發(fā)及使用
5、云數(shù)據(jù)庫開發(fā)及使用
6、云存儲入門指南
7、一鍵式部署云工程
第 6 步:低代碼開發(fā)
1、低代碼的定義
2、DevEco 低代碼關(guān)鍵能力和特性介紹
3、DevEco 低代碼技術(shù)原理
4、端側(cè)組件支持自適應(yīng)布局
5、豐富的行業(yè)模板和組件
6、DevEco 低代碼開發(fā)元服務(wù)流程和案例
第 7 步:元服務(wù):打造卡片外顯、服務(wù)直達(dá)的新體驗(yàn)
1、元務(wù)概覽和案例分享
2、元服務(wù)初體驗(yàn)
3、基于 AGC 模板開發(fā)元服務(wù)
4、元服務(wù)上架指南
第 8 步:ArkUI-X 構(gòu)建跨平臺應(yīng)用
1、項(xiàng)目介紹與關(guān)鍵特性
2、技術(shù)架構(gòu)與演進(jìn)路線
3、ArkUI-X 快速入門
4、購物車示例應(yīng)用(API 10)
5、健康飲食示例應(yīng)用(API 10)
第 9 步:通關(guān)HarmonyOS應(yīng)用開發(fā)者高級認(rèn)證
1、HarmonyOS 系統(tǒng)特征介紹
2、HarmonyOS 應(yīng)用架構(gòu)介紹
3、準(zhǔn)備工作
4、應(yīng)用開發(fā)知識域
5、閉源庫集成指導(dǎo)
6、三方庫使用
7、HarmonyOS 上架
04第四站:項(xiàng)目實(shí)戰(zhàn)
本階段共四步,以下是具體:
第 1 步:WebView 適配開發(fā)
1、鴻蒙項(xiàng)目工程架構(gòu)分析
2、項(xiàng)目需求分析
第 2 步:鴻蒙手機(jī)端APP功能開發(fā)
1、首頁框架搭建
2、網(wǎng)絡(luò)請求組件開發(fā)
3、證件照分類頁框架搭建
4、登錄組件開發(fā)
5、制作證件照框架搭建
6、從相冊選擇:切換背景、美顏與換裝
7、相機(jī)拍攝
8、裁剪證件照
9、證件照換底
10、搜索功能
11、支付組件開發(fā)
12、“我的”頁面開發(fā)
第 3 步:項(xiàng)目測試
1、HarmonyOS應(yīng)用測試服務(wù)平臺概覽
2、DevEco Stutio 調(diào)試與單元測試
3、DevEco Tesing 上架預(yù)測試
第 4 步:項(xiàng)目應(yīng)用上架
1、創(chuàng)建項(xiàng)目
2、創(chuàng)建 HarmonyOS 應(yīng)用
3、編譯打包HarmonyOS 項(xiàng)目
4、上架 HarmonyOS 應(yīng)用