这门课适合谁：先看你的工作场景对不对得上
如果你已经会写 React，但一直停留在浏览器里，想往外扩一步做桌面软件，Electron 是目前最省力的入口——它本质上是把 Chromium 和 Node.js 打包进一个可执行程序，你原有的前端能力几乎可以直接迁移。反过来，如果你连组件、状态、副作用这些基本概念都没写过，这门课的前半段会比较吃力，建议先把 React 基础补上再来。
另一个常见的适用人群是：手里有一些重复性的本地工作流，比如整理文档、批量处理文件、调用系统能力，用网页做不方便，用原生客户端开发又成本太高。Electron 正好卡在中间，而这门课选的实战项目——云同步 Markdown 文档管理应用——就是这个区间里比较典型的场景。
学完能独立做出什么
课程围绕一个完整项目展开，不是零散知识点演示。走完之后，你应该能自己独立完成这几件事：搭起一个 Electron 主进程与渲染进程分离的工程结构，用 React Hooks 管理界面状态和数据流，把本地 Markdown 文件读写、目录监听这类 Node 原生能力接进应用，再通过七牛云的对象存储把文档同步到云端。
说得具体一点，就是你能做出一个「打开就能写、写完自动传、换台机器能拉回来」的桌面工具。中间涉及的主进程与渲染进程通信、打包分发、云端上传的签名与鉴权，都是真实项目里绕不开的环节，不是练习题式的玩具。
内容侧重：偏工程落地，不是原理科普
从资料结构看，这门课的重心放在「怎么把东西拼起来跑通」上。React Hooks 的部分不是重新讲一遍官方文档，而是放在桌面应用这个语境下用；Electron 的部分也没有铺开讲底层机制，而是直接落到窗口管理、进程通信、系统调用这些实际要用到的能力上。
七牛云那一段值得单独说一句：对象存储的接入在真实工作里很常见，但多数前端教程不会碰，因为它牵扯到密钥管理、上传策略、回调处理。这门课把它放进项目主线上，对想补这块经验的人是有价值的。
资料怎么用：按顺序走，别跳
- 建议从第一节按顺序推进。Electron 的工程结构有自己的约定，跳着看容易在进程通信那一块卡住。
- 每完成一个章节，尽量把代码自己敲一遍，而不是只看。桌面端踩的坑大多在环境配置和打包环节，看是看不出来的。
- 配套的章节笔记适合两个时间点用：一是学完当节做复盘，二是项目做完后回看，会发现当时没理解的取舍现在能看懂了。
- 如果你只是想先探个路，可以先跳到项目搭建和进程通信两段，判断一下自己是否适应这种开发方式，再决定要不要完整走完。
一点提醒
Electron 打包出来的应用体积偏大、内存占用也不低，这是它的固有代价，课程不会帮你回避这一点。如果你的目标只是做个轻量小工具，或者对安装包大小有硬要求，需要提前想清楚。另外，云同步涉及账号和密钥，跟着练的时候注意不要把自己的真实密钥提交到公开仓库里。
整体来说，这是一门方向明确、项目完整的实战课，适合已经具备 React 基础、想把能力延伸到桌面端的人。基础不够的话，先补再上，不用急。
Electron几乎是 Web 开发人员开发桌面客户端的唯一途径，它天然适配任何前端开发框架，我们结合 React Hooks 这个新特性进行教学，结合七牛云和很多 Node 原生模块进行开发，来完成一个非常有吸引力的云同步 Markdown 文档管理应用。
课程推荐
《Electron+React+七牛云实战跨平台桌面应用》Electron几乎是 Web 开发人员开发桌面客户端的唯一途径，它天然适配任何前端开发框架，我们结合 React Hooks 这个新特性进行教学，结合七牛云和很多 Node 原生模块进行开发，来完成一个非常有吸引力的云同步 Markdown 文档管理应用。【技能收获】学完可掌握：React 前端。课程以实战为导向，覆盖从基础概念到完整项目落地的关键步骤，配套章节笔记便于课后复盘与面试前快速回顾。【学习建议】建议按目录顺序学习，先打基础再进入综合实战章节；每完成 2～3 节可结合笔记整理一份学习小结，最终尝试独立复现一套完整 Demo 写入个人作品集。【就业发展】可面向岗位：Linux 运维工程师、SRE、云计算工程师、DevOps 工程师。云原生与自动化运维仍是企业 IT 刚需方向，认证 + 实战项目组合能显著提升面试通过率，适合向中高级运维或架构岗进阶。 若你已有一定编程或运维基础，本课程可帮助你在现有技能栈上快速叠加热门方向能力，提升求职时的项目说服力与薪资谈判空间。
视频目录（97 节）
课程目录
* 1-1 学习本课程的收获以及案例展示（内附彩蛋） (1808).mp4
* 2-1 配置 Electron 开发环境 (0711).mp4
* 2-2 进程和线程 (0802).mp4
* 2-3 主进程和渲染进程 (0704).mp4
* 2-4 创建 BrowserWindow (1309).mp4
* 2-5 进程间的通信 (0620).mp4
* 2-6 使用 IPC 进行通信 (0842).mp4
* 2-7 使用 remote 实现跨进程访问 (0518).mp4
* 2-8 升级到 electron 7.0 以上的注意事项 (0514).mp4
* 3-1 React 简介和缘起 (0715).mp4
* 3-2 配置 React 开发环境..1 (0950).mp4
* 3-3 useState Hook (1122).mp4
* 3-4 useEffect 不需要清除的 Effect (0550).mp4
* 3-5 useEffect 需要清除的 Effect (0927).mp4
* 3-6 useEffect 可控 effect (1131).mp4
* 3-7 自定义 Hook（一） (0835).mp4
* 3-8 HOC 的概念和缺点 (0528).mp4
* 3-9 自定义Hook（二） (1319).mp4
* 3-10 Hook 规则和其他 Hook (0505).mp4
* 4-1 全局需求 (0809).mp4
* 4-2 将 UI 拆分成组件 (0647).mp4
* 4-3 配置开发环境（一） (0814).mp4
* 4-4 配置开发环境（二） (1048).mp4
* 4-5 文件结构和代码规范 (0754).mp4
* 5-1 为项目选择样式库 (0926).mp4
* 5-2 FileSearch 组件（一） (1553).mp4
* 5-3 FileSearch 组件（二） (1159).mp4
* 5-4 为项目选择图标库 (1227).mp4
* 5-5 使用 PropTypes 进行类型检查 (0728).mp4
* 5-6 FileList 组件开发（一） (1441).mp4
* 5-7 FileList 组件开发（二） (1229).mp4
* 5-8 第一个自定义 Hook - useKeyPress (0854).mp4
* 5-9 左侧收尾工作 (1231).mp4
* 6-1 TabList 需求和属性分析 (0541).mp4
* 6-2 TabList 组件代码（一） (1444).mp4
* 6-3 TabList 组件代码（二） (1102).mp4
* 6-4 选择 MarkDown 编辑器 (0613).mp4
* 6-5 引入 easyMDE 编辑器 (0702).mp4
* 7-1 分析设计 State 结构 (0647).mp4
* 7-2 分析应用数据流 (0522).mp4
* 7-3 给 App 组件添加状态 (1130).mp4
* 7-4 添加数据处理行为（一） (1433).mp4
* 7-5 添加数据处理行为（二） (1133).mp4
* 7-6 添加新建文件流程逻辑 (1343).mp4
* 7-7 Flatten State 介绍 (0506).mp4
* 7-8 修改 State 为 Flatten 结构编码 (1044).mp4
* 8-1 在 React 中使用 Node.js (0618).mp4
* 8-2 FS 模块初试牛刀 (0855).mp4
* 8-3 FS 模块使用 Promise ** (0924).mp4
* 8-4 在 App 中集成文件操作 (1315).mp4
* 8-5 数据持久化解决方案 (0653).mp4
* 8-6 将 Electron store 集成到 App 中 (1402).mp4
* 8-7 添加持久化数据逻辑代码 (0650).mp4
* 8-8 由一个 Bug 引发的思考 (0834).mp4
* 9-1 导入文件对话框（一） (0946).mp4
* 9-2 导入文件对话框（二） (1831).mp4
* 9-3 添加上下文菜单（一） (0909).mp4
* 9-4 添加上下文菜单第二部分 (1125).mp4
* 9-5 添加上下文菜单最终实现 (1402).mp4
* 9-6 原生应用菜单简介 (0649).mp4
* 9-7 添加原生应用菜单编码（一） (1129).mp4
* 9-8 添加原生应用菜单编码（二） (1037).mp4
* 9-9 设置窗口解决方案和流程分析 (0539).mp4
* 9-10 添加设置窗口编码（一） (1512).mp4
* 9-11 添加设置窗口编码（二） (1203).mp4
* 10-1 对象存储平台简介 (0532).mp4
* 10-2 七牛云平台使用简介 (0442).mp4
* 10-3 初始七牛 SDK (1300).mp4
* 10-4 云文件操作类编码（一） (1222).mp4
* 10-5 云文件操作类编码（二） (1116).mp4
* 10-6 获得下载链接 (1451).mp4
* 10-7 stream 流的概念 (0750).mp4
* 10-8 stream 流的简单用法 (1009).mp4
* 10-9 实现文件下载方法 (1403).mp4
* 11-1 在设置窗口添加七牛云参数（一） (1001).mp4
* 11-2 在设置窗口添加七牛云参数（二） (0702).mp4
* 11-3 添加云同步菜单 (0803).mp4
* 11-4 动态修改菜单项 (0906).mp4
* 11-5 自动同步单个文件至七牛云（一） (1015).mp4
* 11-6 自动同步单个文件至七牛云（二） (0956).mp4
* 11-7 自动下载云文件至本地（一） (0848).mp4
* 11-8 自动下载云文件至本地（二） (1153).mp4
* 11-9 为应用添加 Loading 效果 (0759).mp4
* 11-10 完成全部文件同步到七牛云功能编码 (0956).mp4
* 11-11 使用流程图和伪代码解决剩下需求 (0853).mp4
* 12-1 安装 Electron builder (0442).mp4
* 12-2 为生产环境 build 代码 (1022).mp4
* 12-3 添加配置文件 (0741).mp4
* 12-4 调试整个pack流程 (1031).mp4
* 12-5 探究打包过程和生成文件内容 (0714).mp4
* 12-6 生成安装包 (0907).mp4
* 12-7 Electron 打包体积优化第一部分- 质的飞跃 (0521).mp4
* 12-8 Electron 打包体积优化第二部分-极限优化 (1004).mp4
* 12-9 自动更新第一部分 - 自动发布 release (0936).mp4
* 12-10 自动更新第二部分 - 添加自动更新功能 (0727).mp4
* 12-11 自动更新 第三部分 - 本地调试自动更新功能 (0638).mp4
* 13-1 课程总结 (0752).mp4
