There are, of course, different ways to build desktop applications with web technologies. We built it with Electron, and, as a result, it’s faster, sports a frameless look, and has a number of behind-the-scenes improvements to make for a much better Slack experience.
Build Desktop Apps With we’ve just shipped a new version of the Slack Desktop application for macOS. Build Desktop Apps With - Electron From Scratch. PLEASE SUPPORT ME BY CLICK ONE OF MY LINKS IF YOU WANT BUYING OR EXTENDING YOUR ACCOUNT - Electron From Scratch.
Use electron api in javascript code#
We will build 3 apps ImageShrink - An app to optimize images for websites SystTop - RealTime CPU monitor with notifications and system tray BugLogger - CRUD app to track logs which uses React and the MongoDB Atlas cloud database Some stuff you will learn: Create app windows with BrowserWindow Create menus with custom items Menu roles Shell module to open files and folders Create system tray icons with context menus App events Main process & Renderer process Communication between processes with IPCMain & IPCRenderer Packaging Electron apps Creating log files Interact with system hardware Create a data store file with settings data Integrate React with Electron Integrate a MongoDB database with Mongoose Some javascript stuff that you may not have known - Introduction 17:21 Welcome To The Course Предварительный просмотр 04:18 Electron: What & Why? Предварительный просмотр 04:34 How Electron Works Предварительный просмотр 03:11 Environment & Code Repo 05:15 Links 00:03 - Project 1 - Image Shrink App & Getting Started With Electron 27:35 Project Intro Предварительный просмотр 03:18 Setup & BrowserWindow Предварительный просмотр 06:18 Loading a Window File & Adding an Icon 07:08 Important! Absolute Icon Paths 00:16 Environment & Platform Check 07:21 Using Nodemon With Electron 03:14 - Working With The Menu 22:20 Creating a Menu Template 07:21 Menu & Global Shortcuts 05:00 Menu Roles 04:52 Open Window From Menu 05:07 - Interface, IPC, ImageMin & Packaging 52:59 Creating The Interface 11:09 Renderer Node Integration 05:11 IPC Communication 07:00 Implementing Imagemin & Plugins 13:24 Send Events To Renderer 03:29 Creating Log Files 05:09 Package & Test Our App 07:37 - Project 2 - SysTop App 22:35 Project Intro Предварительный просмотр 03:15 Boilerplate Setup 03:51 Template Assets Setup 04:41 Creating The Interface 10:48 - System Stats & Renderer Process 40:25 Static System Stats 11:07 Interval/Dynamic System Stats 09:11 Progress Bar & CPU Overload 04:38 Notifications API 05:41 Notification Timing 09:48 - Storing Local Data 29:30 Creating a Store 10:01 Set Default Settings To Renderer 04:31 Saving Data To Our Store/File 09:25 Use Settings Data In Monitor 05:33 - Tray Icon & Wrap Up 29:47 Creating a Tray Icon 06:13 Tray Context Menu 05:26 Nav Toggle Menu Item 04:28 MainWindow Class 04:48 AppTray Class 05:43 Package & Test Our App 03:09 - Project 3 - BugLogger App & Creating The React UI 59:39 Project Intro Предварительный просмотр 02:32 React-Electron Boilerplate Setup 10:18 Log State & Table 08:14 LogItem Component 08:59 Formatting Dates With Moment 03:28 AddLogItem Component 08:46 Adding a Log (UI Only) 06:13 Displaying Alerts 07:12 Deleting a Log (UI Only) 03:57 - Main Process, IPC & MongoDB 45:35 Setup MongoDB Atlas 04:18 Connect To Database With Mongoose 04:40 Create Log Model 04:07 Get Logs From Database 08:39 Add Log To Database 04:55 Delete Logs From Database 04:44 Clear Logs Menu Item 08:05 Package & Test Our App 04:41 Custom Icon 01:26 Year: 2020 Manufacturer: Udemy Manufacturer Website: Author: Brad Traversy Duration: ~ 6h Type of material handed out: Videos English language Many popular apps including VSCode, Slack and Skype are built on Electron.
Use electron api in javascript how to#
Electron From Scratch: Build Desktop Apps With javascript 2020 TUTORiAL | 2.28 GB This is a hands on, project based course on learning how to build and package cross-platform desktop applications using Electron.
0 kommentar(er)
