Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS AWS Certified Developer - Associate CompTIA Security+
Photoshop Graphic Design Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Mindfulness Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Data Science
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee

This course includes:

  • 6 hours on-demand video
  • 2 articles
  • 8 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
Development Web Development Electron Framework

Electron From Scratch: Build Desktop Apps With JavaScript

Create 3 useful desktop applications with web technologies using Electron
Highest Rated
Rating: 4.7 out of 54.7 (647 ratings)
4,366 students
Created by Brad Traversy
Last updated 5/2020
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Learn how to build desktop apps with Electron
  • Create and package 3 complete cross-platform applications
  • Use IPC to communicate between Main & Renderer Processes
  • Use Vanilla JS & React with Electron
  • Create custom menu items, system tray apps and more
  • Work with local data as well as MongoDB Atlas database
Curated for the Udemy for Business collection

Course content

10 sections • 59 lectures • 5h 47m total length

  • Preview04:18
  • Preview04:34
  • Preview03:11
  • Environment & Code Repo
    05:15
  • Links
    00:03

  • Preview03:18
  • Preview06: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

  • Creating a Menu Template
    07:21
  • Menu & Global Shortcuts
    05:00
  • Menu Roles
    04:52
  • Open Window From Menu
    05:07

  • 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

  • Preview03:15
  • Boilerplate Setup
    03:51
  • Template Assets Setup
    04:41
  • Creating The Interface
    10:48

  • 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

  • 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

  • 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

  • Preview02: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

  • 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

Requirements

  • JavaScript Fundamentals

Description

This is a hands on, project based course on learning how to build and package cross-platform desktop applications using Electron. Many popular apps including VSCode, Slack and Skype are built on Electron.

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

Who this course is for:

  • Developers that want to build desktop apps with web technologies

Featured review

Fabi
Fabi
16 courses
3 reviews
Rating: 5.0 out of 57 months ago
Very happy about the course. I have been getting into some new areas lately and I'm super happy every time I see that there is a Video/Udemy-course on that topic by Brad Traversy :) Keep up the good work!

Instructor

Brad Traversy
Full Stack Web Developer & Instructor at Traversy Media
Brad Traversy
  • 4.7 Instructor Rating
  • 97,794 Reviews
  • 252,172 Students
  • 14 Courses

Brad Traversy has been programming for around 12 years and teaching for almost 5 years. He is the owner of Traversy Media which is a successful web development YouTube channel and specializes in everything from HTML5 to front end frameworks like Angular as well as server side technologies like Node.js, PHP and Python. Brad has mastered explaining very complex topics in a simple manner that is very understandable. Invest in your knowledge by watching Brad's courses.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.