Skip to content

Contact sales

By filling out this form and clicking submit, you acknowledge our privacy policy.

ElectronJS

Course Summary

The ElectronJS training course is designed to teach students how to build native desktop applications with ElectronJS using Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and Javascript. Electron is an open-source framework used to build cross-platform desktop applications using HTML, CSS, and Javascript. Electron's main purpose is to enable web developers to build native desktop applications leveraging existing skills. Popular applications such as Slack and Skype use Electron for the desktop versions of their products.

Students will begin learning about the ElectronJS framework and Application Programming Interface (API) so they can understand how to leverage them later in the course. Next, students will learn the fundamental concepts of ElectronJS. The course concludes with students using existing skills in HTML, CSS, and Javascript to build a desktop application starting with the initialization of a project through the deployment/packaging of the application.

Students in this course should have web development experience including HTML, CSS, and Javascript.

Purpose
 Learn about ElectronJS through hands-on labs and real projects.
Audience
 Web Developers with HTML, CSS, and Javascript programming experience that are interested in learning how to build desktop versions of their products.
Role
Software Developer
Skill Level
Introduction
Style
Workshops
Duration
3 Days
Related Technologies
JavaScript | CSS | HTML / HTML5

 

Productivity Objectives
  • Demonstrate how to build native desktop applications using ElectronJS.
  • Describe the ElectronJS API.
  • Differentiate using ElectronJS over other frameworks.
  • Internalize how to package ElectronJS applications for deployment to end-users.

What You'll Learn:

In the ElectronJS training course, you'll learn:
  • Introduction to ElectronJS
    • What is ElectronJS? Why do I need it?
    • What sets it apart from other applications?
  • Setting up an Application
    • What is an ElectronJS app structure like?
    • How do I run and debug an ElectronJS app?
  • Understanding ElectronJS processes
    • Main Process API
    • Renderer Process API
  • Inter-Process Communication (IPC) in ElectronJS
    • How to build synchronous and asynchronous communication
    • Organize communications between channels
  • Using Operating System Shared Functions
    • Understanding how to interact with local processes
    • Interact with screens in ElectronJS
    • Pass files to the local machine through the shell
    • Take control of images
    • Implement a copy & paste feature
  • Using Common Features in Desktop Applications
    • Detecting network connectivity
    • Render background processes
    • Create native system notifications
    • Implement a simple progress bar
  • Create an End-to-End Project
    • Analyze requirements for an image editor
    • Adding images
    • Viewing images
    • Deleting images
    • Add notifications when a user has made a change to an image
    • Rendering images in various formats and sizes
    • Creating an application menu
    • Packaging your application
real world content

Real-World Content

Project-focused demos and labs using your tool stack and environment, not some canned "training room" lab.
expert practitioners

Expert Practitioners

Industry experts that bring their battle scars into the classroom.
experiential learning

Experiential Learning

More coding than lecture, coupled with architectural and design discussions.
tailored outlines

Tailored Outlines

One-size-fits-all doesn't apply to training teams. That's where we come in!
“I appreciated the instructor's technique of writing live code examples rather than using fixed slide decks to present the material.”

VMware

Dive in and learn more

When transforming your workforce, it's important to have expert advice and tailored solutions. We can help. Tell us your unique needs and we'll explore ways to address them.

Let's chat

By filling out this form and clicking submit, you acknowledge our privacy policy.