Electron+React+七牛云 实战跨平台桌面应用

第1章 进入 Electron 的世界
介绍了整个课程的背景知识,项目简介,学习流程,可以掌握的知识点,以及学习方法和前置知识。

第2章 我们的第一个应用
本章讲述了 Electron 的基础用法,包括搭建 Electron 开发环境、进程和线程的知识、BrowserWindow 模块、跨进程访问等内容。

第3章 神奇的 React
本章回顾了 React 的基础知识,从而引出了全新的 React Hooks,详细讲解了 useState、useEffect、自定义Hook 等内容。

第4章 双剑合璧与庖丁解牛
本章分析了整个应用的需求,将整个应用分割成组件,然后打造一个 适配 Electron 和 React 的开发环境

第5章 左侧面板开发
本章开始分别开发左侧面板的各个 React 组件,同时在开发过程中选用样式库、图标库,重构公共自定义 Hook。

第6章 右侧面板开发
本章开发了应用右侧的 TabList 和编辑器部分,同时在整个过程中穿插了如何选取一个好用的开源库的思路。

第7章 功能结合
本章遵循 React 哲学的最后步骤,从分析应用 state 结构入手,从上至下的给应用添加状态和逻辑处理,然后提出了 flatten state 的概念, 最后用这个概念进化了整个应用的状态。

第8章 持久化保存数据
本章开始进入 Node.js 的世界,使用 FS 模块完成文件的增删改,同时还使用 Electron store 完成文件索引的持久化保存。

第9章 Electron 锦上添花
本章使用 Electron 提供的模块 - Dialog、Menu、BrowserWindow 等模块进一步进化应用。在这之中,还穿插了 Node.js、DOM 遍历以及操作等一系列知识。

第10章 认识七牛云平台
本章从对象存储云平台简介开始,引出七牛云使用的流程,以及七牛云 SDK 的下载。然后使用 SDK 写一些小 Demo,最后抽象到一个云文件操作类。

第11章 使用 SDK 同步到七牛云
本章使用上一章完成的云文件操作类将云文件同步功能添加到应用当中。

第12章 应用打包与分发
本章主要以 MacOS 和 Windows 系统为例,讲解如何通过 Electron Builder 打包 Electron 应用程序。

第13章 课程总结
本课程的回顾与总结。

下载地址:Electron+React+七牛云 实战跨平台桌面应用

原文地址:https://www.cnblogs.com/spysor/p/11495069.html

时间: 2024-07-31 01:15:46

Electron+React+七牛云 实战跨平台桌面应用的相关文章

《介绍一款开源的类Excel电子表格软件》续:七牛云存储实战(C#)

?? 两个月前的发布的博客<介绍一款开源的类Excel电子表格软件>引起了热议:在博客园有近2000个View.超过20个评论. 同时有热心读者电话咨询如何能够在SpreadDesing中实现存储Excel云文件,既通过云方式读取.加载Excel文件.在本文,我们就大家关心的云存储进行实战操练---基于SpreadDesign源码基础. 系统必备: 本文选用的国内比较流行的七牛云存储. SpreadDesign.exe已经升级为最新的Spread Studio 8.35.20143.0内核 .

快速了解Electron:新一代基于Web的跨平台桌面技术

本文引用了作者“ ConardLi”的<用JS开发跨平台桌面应用,从原理到实践>一文部分内容,原文链接:segmentfault.com/a/1190000019426512,感谢原作者的无私分享. 1.引言 现在开发IM应用动不动就要求多端——即Android端.iOS端.PC端.Web端等,Android端和iOS端作为两种不同的移动端技术,单独开发和维护还能理解,PC端和Web端如果要单独开发那就有点头大了,必竟开发传统的PC桌面应用成本太高(QT这类技术跟Web技术相比,上手难度大的多

React Native 技术 开发跨平台 Native App 初探

转载请注明出处:http://blog.csdn.net/smartbetter/article/details/64190798 我们已经了解像 Titanium 和 PhoneGap 等框架,它们能让开发者用 Web 技术构建移动应用.这是一个优势,支持开发者使用原先网络和移动开发的相关技术.仅如此,相同的代码库经过小幅度的修改便能适用多个平台--这就是著名的一次编写,到处运行.然而,当涉及到构建应用的性能时,这些框架的缺点显露无遗,尽管它们有一些吸引力,但却一直更适用于构建原生应用.Rea

【腾讯Bugly干货分享】React Native项目实战总结

本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 "8小时内拼工作,8小时外拼成长"这是大家共同的理想.除了每天忙于工作外,我们都希望能更多地区吸收领域内的新知识与新技能,从而走向人生巅峰. Dev Club 是一个交流移动开发技术,结交朋友,扩展人脉的社群,成员都是经过审核的移动开发工程师.每周都会举行嘉宾分享,话题讨论等活动. 上一期我们邀请了腾讯SNG工程师&qu

七牛云徐晶:基于 WebRTC 架构的直播课堂实践

8 月 18 日下午,在七牛云架构师实践日第三十期,七牛云教育行业产品研发总监徐晶进行了<基于 WebRTC 架构的直播课堂实践>为题的实战分享.? 本文是对演讲内容的实录整理.??作者简介:??七牛云教育行业产品研发总监,拥有 12 年互联网行业经验.擅长将传统行业与互联网结合,形成具有 Plus 效果的互联网产品.曾在阿里巴巴大文娱负责整个优酷直播业务,目前任职七牛云教育行业产品研发总监,构建互联网教育云计算模型,打造在线教育行业的云计算解决方案,突破传统教育壁垒.? 流媒体协议与功能的演

共建公安标准体系 | 七牛云与锐安科技达成深度战略合作

2018 年 10 月 12 日,七牛云与北京锐安科技有限公司签署战略合作协议.锐安科技总经理谢永恒.副总经理帅佩章,七牛云总裁吕桂华.七牛云人工智能实验室负责人彭垚.市场副总裁钱骥华出席签约仪式. ? ? 七牛云与锐安科技将在警务安防.网络信息安全.大数据服务等重要领域达成全面长期战略合作.通过深度整合七牛云人工实验室自研的城市慧眼系统.内容安全.深度学习平台.智能城管.智能人像等久经实战检验的机器视觉产品和解决方案,锐安科技将与七牛云一起,打造国内顶尖的网络大数据产品. ? 双方将从以下三个

用ueditor上传图片、文件等到七牛云存储

ueditor上传文件,是用数据流的形式上传的. 而七牛云存储官方文档中,只提供了文件路径上传的方式. 但是,仅仅是在官方文档中写了这一种方式. 事实上,利用VS的对象管理器,打开Qiniu的dll,我们可以看到以下东西: 其实Qiniu提供的SDK中,是可以利用文件流上传文件的. 所以,根据官方文档提供的案例,我们可以将上传改写成下面的样子: /// <summary> /// 上传文件 /// </summary> /// <param name="key&qu

Python在七牛云平台的应用(二)图片瘦身

(一)七牛云平台的图片瘦身功能简介:(引用自官网) 针对jpeg.png格式图片 瘦身后分辨率不变,格式不变. 肉眼画质不变. 图片体积大幅减少,节省 CDN 流量 官网给的图片压缩率很高,官网给的「葡萄」图片瘦身在不改变分辨率和格式的情况下压缩率为65.49%,我自己测试了一张小图在后文中会有,原来的大小在「22kb」压缩后为「18kb」,据一般情况来看,压缩率虽然没有官网给的那么夸张,但是也能基本达到80%左右,所以这个压缩率还是很不错的. (二)需求分析 我们可以设想几个场景 『1:当你在

我为什么选择七牛云存储

在写这篇文章之前先给大家分享一个小福利:2017最新七牛云存储九折优惠券:61d1fd4d 接下来给大家谈一下我用七牛云存储的原因,从七牛一开始的时候我就开始用了,刚开始的时候七牛好像只是做静态存储,那时候我把自己的网站放在七牛上,当然只是一些静态的页面,但是对于一个初中生来说,能做出一个能访问的网站已经很高兴了,当然,那个网站是我自己用记事本一个一个打出来的代码.当时满满的自豪感. 经过了好几年,七牛已经迅速发展成国内数一数二的云存储服务商了.目前的七牛不知在云存储方面位居国内前列,在cdn加