electron入门及仿客户端QQ简易版

项目: electron仿客户端QQ简易版

简单讲解electron的起源 --- 学习 -- 从入门到放弃！

仿qq项目地址

启动

---

• npm install
• npm run dev

---

---

• 进度：已完成 -- 简易登陆页，简易聊天页
• 目的：学习electron的开发
• 技术栈：electron + vue全家桶 + elementUi + frozenui
• 学习参考文章：苏南大叔的博客--electron官网--electron-VUE官网
• electron入门-简单传值
• electron用react快速搭建项目

---

效果图

登陆页：

Electron是什么?

这是一个由GitHub的工程师Cheng Zhao（又名zcbenz）发起的开源项目,Electron是一个实时框架，容许您使用HTML5，CSS和JavaScript建立桌面应用程序。

Chromium和Node自己就是广受欢迎的应用程序平台，它们都被独立用于建立雄心勃勃的应用程序。 Electron将两个平台结合在一块儿，容许您使用JavaScript构建一个全新的应用程序类。您能够在浏览器中执行任何操做

优点：

1.若是你有nodeJS开发经验，和web开发经验，你能够很容易的上手electron

2.作客户端比作网页更值钱

图解：

electron由Node.js+Chromium+Native APIs构成。你能够理解成，它是一个获得了Node.js和基于不一样平台的Native APIs增强的Chromium浏览器，能够用来开发跨平台的桌面级应用。

它的开发主要涉及到两个进程的协做——Main（主）进程和Renderer（渲染）进程。简单的理解两个进程的做用：

• 1.Main进程主要经过Node.js、Chromium和Native APIs来实现一些系统以及底层的操做，好比建立系统级别的菜单，操做剪贴板，建立APP的窗口等。同时，也能够在electron中使用node的api，是否是以为很亲切，很舒服？

• 2.Renderer进程主要经过Chromium来实现APP的图形界面——就是平时咱们熟悉的前端开发的部分，不过获得了electron给予的增强，一些Node的模块（好比fs）和一些在Main进程里能用的东西（好比Clipboard）也能在Render进程里使用。

• 3.Main进程和Renderer进程经过ipcMain和ipcRenderer来进行通讯。经过事件监听和事件派发来实现两个进程通讯，从而实现Main或者Renderer进程里不能实现的某些功能。

electron通讯的方式：

• localstory

• ipcMain---ipcRenderer 基友通讯

• webContents 渲染以及控制 web 页面，强行操做！

• node写接口

electron入门-简单传值

简单传值代码地址