这门课解决什么问题
很多做 Web 前端的开发者都会遇到一个痛点：用 React 写界面已经很熟练，但一旦业务需要把工具封装成 Windows 或 Mac 上的客户端软件，就会卡在主进程与渲染进程的通信、本地文件读写、跨平台打包和自动更新这些环节上。这门以 Electron 与 React 结合七牛云存储为核心的实战课，解决的就是从浏览器到桌面的跨越问题。它不是泛泛讲组件库，而是聚焦在怎么用 Web 技术栈搭出一个能独立运行、能读写本地数据、能对接云存储并且能打包分发的完整桌面端应用。如果你之前只做过网页，这能帮你把现有的前端能力直接迁移到客户端开发场景。
适合什么基础，建议先看哪几块
资料不适合纯零基础的人直接看。你需要对 React 有基本认知，至少写过组件、用过状态控制，对 JavaScript 异步操作有概念。从内容编排看，主进程与渲染进程的机制是理解整个桌面应用运行逻辑的基石，建议先看环境配置与进程通信这一块，搞懂主进程怎么管理窗口、渲染进程怎么通过 IPC 互相传消息。之后再进入 React 部分的环境搭建和组件拆分，这部分讲的是怎么把界面逻辑落到桌面端项目里。全局需求和代码规范那一节也建议早点看，它能帮你建立合理的项目结构，避免后期代码越写越乱。状态结构设计和数据处理行为这一块是重点，讲的是如何设计扁平化的状态结构并组织数据流，这是应用能不能稳定扩展的关键，不要跳过。
资料怎么配合练习，学完能做什么
看视频时不要只过眼，要跟着把项目从零搭起来。每看完一个讲通信或状态处理的片段，就停在自己的编辑器里把对应逻辑补全，确保窗口能正常创建、进程间能传数据、组件状态能按预期更新。涉及七牛云的部分，建议自己注册账号拿到测试凭证，跟着视频把上传逻辑跑通，不要只看不动手。最后关于打包和自动更新的内容，一定要亲自走一遍生成安装包的流程，哪怕只在本地机器测试，也能暴露出路径配置和依赖打包的真实问题。学完这套资料，你应该能独立完成一个具备基础 UI、本地数据管理、云存储对接和自动更新能力的跨平台桌面应用，并且知道怎么把它打包成可分发的安装文件。
课程目录
📁 3 3-7 自定义 Hook（一）【整理不易‖记得关注：CunWorKNotes】.mp4 [35.7 MB] 3- 10 Hook 规则和其他 Hook.mp4 [18.6 MB] 3-4 useEffect 不需要清除的 Effect【公重号：CunWorkNotes】.mp4 [15.3 MB] 3-8 HOC 的概念和缺点.mp4 [21.8 MB] 3-5 useEffect 需要清除的 Effect.mp4 [39.8 MB] 3-9 自定义Hook（二）.mp4 [87.5 MB] 3-3 useState Hook.mp4 [41.5 MB] 3-6 useEffect 可控 effect.mp4 [66.7 MB] 3-1 React 简介和缘起.mp4 [13.3 MB] 3-2 配置 React 开发环境1.mp4 [31.6 MB] 📁 2 2-2 进程和线程【更多精选‖公众号：CunWorknotes】 .mp4 [10.7 MB] 2-6 使用 IPC 进行通信.mp4 [48.4 MB] 2-4 创建 BrowserWindow【资源精选‖更多关注：CunworkNotes】.mp4 [54.7 MB] 2-7 使用 remote 实现跨进程访问.mp4 [22.4 MB] 2-3 主进程和渲染进程.mp4 [11.6 MB] 2-1 配置 Electron 开发环境.mp4 [24.8 MB] 2-5 进程间的通信.mp4 [21.1 MB] 📁 7 7-7 Flatten State 介绍.mp4 [65.3 MB] 7-4 添加数据处理行为（一）.mp4 [109.8 MB] 7-2 分析应用数据流.mp4 [67.4 MB] 7-1 分析设计 State 结构.mp4 [13.2 MB] 7-8 修改 State 为 Flatten 结构编码.mp4 [85.5 MB] 7-6 添加新建文件流程逻辑.mp4 [95.9 MB] 7-3 给 App 组件添加状态.mp4 [93.2 MB] 7-5 添加数据处理行为（二）.mp4 [74.9 MB] 📁 4 4-4 配置开发环境（二）【优质资源‖关注：cunWorkNotes 解锁】.mp4 [64.5 MB] 4-2 将 UI 拆分成组件.mp4 [18.3 MB] 4-3 配置开发环境（一）【持续更新‖免费提供：CunworknoteS】.mp4 [22.1 MB] 4-1 全局需求.mp4 [15.3 MB] 4-5 文件结构和代码规范.mp4 [36.4 MB] 📁 12 12-1 安装 Electron builder.mp4 [26.4 MB] 12-9 自动更新第一部分 - 自动发布 release.mp4 [67.1 MB] 12-6 生成安装包.mp4 [68.6 MB] 12- 10 自动更新第二部分 - 添加自动更新功能.mp4 [67.5 MB] 12-4 调试整个pack流程.mp4 [78.3 MB] 12-5 探究打包过程和生成文件内容.mp4 [35.4 MB] 12-7 Electron 打包体积优化第一部分- 质的飞跃.mp4 [50.0 MB] 12-3 添加配置文件.mp4 [65.6 MB] 12- 11 自动更新 第三部分 - 本地调试自动更新功能.mp4 [53.3 MB] 12-8 Electron 打包体积优化第二部分-极限优化.mp4 [64.4 MB] 12-2 为生产环境 build 代码.mp4 [32.5 MB] 📁 11 11-10 完成全部文件同步到七牛云功能编码【持续更新‖免费提供：CunworknoteS】.mp4 [90.1 MB] 11-9 为应用添加 Loading 效果.mp4 [58.6 MB] 11-6 自动同步单个文件至七牛云（二）.mp4 [75.0 MB] 11-2 在设置窗口添加七牛云参数（二）.mp4 [51.5 MB] 11-4 动态修改菜单项.mp4 [60.0 MB] 11-7 自动下载云文件至本地（一）.mp4 [72.1 MB] 11-3 添加云同步菜单.mp4 [64.8 MB] 11-5 自动同步单个文件至七牛云（一）.mp4 [82.7 MB] 11-8 自动下载云文件至本地（二.mp4 [101.1 MB] 11-11 使用流程图和伪代码解决剩下需求.mp4 [54.0 MB] 11-1 在设置窗口添加七牛云参数（一）.mp4 [81.2 MB] 📁 5 5-6 FileList 组件开发（一）【整理不易‖记得关注：CunWorKNotes】.mp4 [78.6 MB] 5-4 为项目选择图标库.mp4 [74.2 MB] 5-2 FileSearch 组件（一）【持续更新‖免费提供：CunworknoteS】.mp4 [71.2 MB] 5-1 为项目选择样式库.mp4 [63.0 MB] 5-9 左侧收尾工作.mp4 [81.7 MB] 5-7 FileList 组件开发（二）.mp4 [97.9 MB] 5-5 使用 PropTypes 进行类型检查.mp4 [44.8 MB] 5-8 第一个自定义 Hook - useKeyPress.mp4 [42.3 MB] 5-3 FileSearch 组件（二）.mp4 [89.2 MB] 📁 6 6-1 TabList 需求和属性分析.mp4 [10.8 MB] 6-2 TabList 组件代码（一）.mp4 [97.8 MB] 6-5 引入 easyMDE 编辑器.mp4 [50.0 MB] 6-4 选择 MarkDown 编辑器.mp4 [27.8 MB] 6-3 TabList 组件代码（二）.mp4 [73.5 MB] 📁 8 8-4 在 App 中集成文件操作.mp4 [103.3 MB] 8-1 在 React 中使用 Nodejs.mp4 [31.1 MB] 8-8 由一个 Bug 引发的思考.mp4 [49.2 MB] 8-3 FS 模块使用 Promise 改造.mp4 [67.3 MB] 8-5 数据持久化解决方案.mp4 [31.1 MB] 8-6 将 Electron store 集成到 App 中.mp4 [106.3 MB] 8-2 FS 模块初试牛刀.mp4 [33.3 MB] 8-7 添加持久化数据逻辑代码.mp4 [34.5 MB] 📁 9 9-9 设置窗口解决方案和流程分析【持续更新‖免费提供：CunworknoteS】.mp4 [54.2 MB] 9-4 添加上下文菜单第二部分【整理不易‖记得关注：CunWorKNotes】.mp4 [73.6 MB] 9-3 添加上下文菜单（一）.mp4 [60.0 MB] 9-11 添加设置窗口编码（二）【资源精选‖更多关注：CunworkNotes】.mp4 [74.9 MB] 9-6 原生应用菜单简介.mp4 [31.7 MB] 9-2 导入文件对话框（二）.mp4 [132.6 MB] 9-10 添加设置窗口编码（一）.mp4 [94.6 MB] 9-1 导入文件对话框（一）.mp4 [110.4 MB] 9-7 添加原生应用菜单编码（一）.mp4 [82.3 MB] 9-5 添加上下文菜单最终实现.mp4 [100.3 MB] 9-8 添加原生应用菜单编码（二）.mp4 [87.4 MB] 📁 10 10-6 获得下载链接.mp4 [119.2 MB] 10-4 云文件操作类编码（一）.mp4 [90.0 MB] 10-3 初始七牛 SDK.mp4 [103.1 MB] 10-1 对象存储平台简介.mp4 [32.5 MB] 10-9 实现文件下载方法.mp4 [115.5 MB] 10-2 七牛云平台使用简介.mp4 [29.3 MB] 10-5 云文件操作类编码（二）.mp4 [106.9 MB] 10-8 stream 流的简单用法.mp4 [25.6 MB] 10-7 stream 流的概念.mp4 [24.0 MB] 📁 13 13-1 课程总结.mp4 [12.6 MB] 📁 1 1-1 学习本课程的收获以及案例展示（内附彩蛋）.mp4 [52.2 MB] 课件.zip [2.6 MB]
