Griffith / Wells Electron: From Beginner to Pro

Learn to Build Cross Platform Desktop Applications using Github's Electron
1. ed
ISBN: 978-1-4842-2826-5
Verlag: Apress
Format: PDF
Kopierschutz: 1 - PDF Watermark

E-Book, Englisch, 274 Seiten

Discover how to take your existing web development skills and learn how to create desktop applications for macOS, Windows, and Linux, using GitHub's Electron. Learn how to combine the power of Node.js and Chromium to provide a powerful development platform for creating web applications that break free from the browser. Electron: From Beginner to Pro guides you through the capabilities that you have available to create desktop applications. Learn to use features like file system access, create native menus, OS-specific dialogs and more. The authors will show you how to package your application for distribution for multiple platforms and enable auto-updating.
What You Will LearnLeverage your knowledge of HTML, CSS and JavaScriptUse current web applications for the desktop
Create and use Electron's main process and render process to create effective desktop applications
Communicate between processes and between windows
Build desktop applications that can be updated and distributed
Who This Book Is For
Web developers looking to leverage their HTML, CSS and JavaScript skills to create desktop widgets and applications. Developers wanting to leverage existing a Web application to extend functionality with a desktop application.

Chris Griffith is the User Experience Lead at a home automation and security company and is also an instructor at UCSD Extension teaching mobile application development. He has over 17 years of experience in developing user experiences for a variety of clients and platforms. He is also an Adobe Community Professional and is regularly invited to speak at conferences such as Adobe MAX, ngConf, UXPA and HTML5DevConf. He has developed several mobile applications, a variety of code hinters, and ConfiGAP for PhoneGap Build. In addition, he has served as a technical reviewer for several publications, and written for uxmag.com. You can follow him on twitter @chrisgriffith or at chrisgriffith.wordpress.com. Leif Wells is a web, mobile and desktop application developer. Leif's professional experience spans technologies from CD-ROM and desktop applications, Web sites and applications, as well as mobile applications. His current focus is building Web applications using Angular or React and building cross-platform hybrid mobile applications using Ionic. Leif provides insight into his experiences at his blog. Leif's Development Blog-o-rama as well as speaking at user groups and conferences.

Autoren/Hrsg.

Griffith, Chris

Wells, Leif

Inhaltsverzeichnis

1;Contents;4
2;About the Authors;11
3;About the Technical Reviewer;12
4;Chapter 1: Welcome to Electron;13
4.1;What Is Electron?;13
4.1.1;What Is Node?;14
4.1.2;What Is Chromium?;14
4.2;Who Is Using Electron?;14
4.3;What Do I Need to Know?;15
4.4;Why Should I Choose Electron?;15
4.4.1;Electron’s Advantages;16
4.4.2;Beyond the Sandbox;17
4.4.3;Offline First Design;17
4.5;How Does Electron Work?;17
4.5.1;The Main Process;18
4.5.2;The Render Process;18
4.5.3;Other Solutions;19
4.6;Summary;19
5;Chapter 2: Installing Electron;20
5.1;Before Installing;20
5.2;Installing Node;20
5.2.1;Installing Node for macOS;22
5.2.2;Installing Node on Windows;27
5.3;Installing Git on macOS;31
5.3.1;Installing Node on Windows;33
5.3.2;Installing Git on Windows;39
5.4;Installing Electron;49
5.5;Summary;51
6;Chapter 3: The Electron Quick Start;52
6.1;Getting the Quick Start Code;52
6.2;Updating the Project to Make It Yours;53
6.3;The Main Process File;55
6.4;The Quick Start’s Renderer Process;59
6.5;Summary;62
7;Chapter 4: BrowserWindow Basics;63
7.1;Getting Started;63
7.1.1;Disabling Chrome DevTools;63
7.2;Update Code to Use the ready-to-show Event;66
7.3;BrowserWindow Options Argument;67
7.3.1;Basic Window Properties (width, height, minWidth, minHeight, maxWidth, maxHeight);69
7.3.2;The center, x and y Properties;69
7.3.3;The resizable and movable Properties;70
7.3.4;The title Property;71
7.4;Other Window Types;76
7.4.1;Frameless Windows;76
7.4.2;Transparent Windows;80
7.5;Summary;82
8;Chapter 5: Adding Custom Menus;83
8.1;Getting Started;83
8.2;Menu Templates;85
8.3;macOS’s Application Menu;86
8.4;Defining Keyboard Shortcuts and Menu Item Roles;86
8.5;Creating Submenus and Checkmarks;90
8.6;Completing the macOS’s Application Menu;93
8.6.1;macOS’s Window Menu Modifications;94
8.7;Contextual Menus;100
8.8;Summary;102
9;Chapter 6: Understanding the IPC Module;103
9.1;Getting Started;103
9.2;Synchronous IPC Messaging;104
9.3;Asynchronous IPC Messaging;108
9.4;Managing Event Listeners;111
9.5;Summary;112
10;Chapter 7: Working with the Dialog Module;113
10.1;Getting Started;113
10.2;The File Open Dialog;113
10.2.1;Additional Open Dialog Properties;116
10.2.2;Selecting a File;118
10.2.3;The BrowserWindow Parameter;120
10.2.4;A Brief Look at Node’s FS Module;122
10.2.4.1;Opening a File;122
10.2.4.2;Getting File Information;123
10.2.4.3;Writing a File;124
10.2.4.4;Reading Files;124
10.2.4.5;Deleting a File;125
10.2.4.6;Watching for Updates;125
10.2.5;Working Directories;125
10.2.5.1;Reading the Directory Contents;126
10.2.5.2;Deleting a Directory;126
10.3;The File Save Dialog;126
10.4;The Message Dialog;129
10.4.1;Custom Icons;135
10.4.2;Handling the Response;137
10.5;Error Dialogs;137
10.6;Summary;138
11;Chapter 8: WebContents, Screens, and Locales;139
11.1;Getting Started;139
11.2;Discovering Electron’s WebContents;140
11.3;A Little Setup Before We Begin;144
11.4;WebContents Events;147
11.5;The “did-start-loading” Event;149
11.6;The capturePage Method;154
11.7;The printToPDF Method;159
11.8;Getting Information about Screens;162
11.9;Finding Locales;166
11.10;Summary;167
12;Chapter 9: The Dock Icon on macOS;168
12.1;Getting Started;168
12.2;The Application’s Dock Icon;169
12.3;Making the Dock Icon Bounce;172
12.4;Changing the Dock Icon;173
12.5;Dock Icon Badges;174
12.6;Summary;176
13;Chapter 10: Shell;177
13.1;Getting Started;177
13.2;Making the System Alert Sound;178
13.3;Showing Files in the Operating System;179
13.4;Opening Files with the Operating System;180
13.5;Opening HTML Files with the Operating System;181
13.6;Summary;182
14;Chapter 11: Online/Offline Detection;183
14.1;Getting Started;183
14.2;Using the Renderer Process to Detect Online Status;184
14.3;Pros and Cons of the Renderer-Only Solution;190
14.4;The Main Process-Only Solution;191
14.5;Pros and Cons of a Main Process-Only Approach;195
14.6;The Combined Approach;195
14.7;Summary;196
15;Chapter 12: Advanced BrowserWindow;197
15.1;Loading an Application;197
15.2;Splash Window;197
15.3;Installing the Quick Start;198
15.4;Setting Up a Splash Window;198
15.5;Creating the Splash Window File;199
15.6;Showing the Version in Our Splash Window;201
15.7;Loading the Main Window;204
15.8;Setting Up the Main Window;205
15.9;Summary;206
16;Chapter 13: Debugging Your Electron Application;207
16.1;Chromium’s Dev Tools;207
16.2;Debugging the Main Process;209
16.2.1;Debugging the Main Process in VS Code;209
16.2.2;Debugging the Main Process in node-inspector;212
16.3;Chrome DevTools Extensions;214
16.4;Devtron;215
16.4.1;Require Graph;216
16.4.2;Event Listeners;217
16.4.3;IPC Monitor;218
16.4.4;Linter;219
16.4.5;Accessibility;220
16.5;Spectron;220
16.6;Summary;220
17;Chapter 14: Testing with Spectron;221
17.1;Getting Started;221
17.2;Adding a Test File;223
17.3;Using Spectron’s browserWindow API;226
17.4;Testing the Size of the browserWindow;230
17.5;Testing Interactions in the Renderer Process;231
17.6;Make the Example Interactive;232
17.7;Summary;237
18;Chapter 15: Building Your Application;238
18.1;Installing Electron Builder;238
18.1.1;Adjusting your Build Directories;238
18.1.2;Updating the package.json file;239
18.1.3;Building for Windows on macOS;240
18.1.4;Building for Linux on macOS;240
18.2;Configuration Options;240
18.3;Testing Our First Build;242
18.4;Configuring the App Icon;245
18.4.1;Configuring the macOS DMG;245
18.4.2;Configuring the Windows Installer;246
18.5;Summary;251
19;Chapter 16: Auto Updating Your Application;252
19.1;Auto Updating macOS;252
19.1.1;User Feedback;254
19.1.2;Auto Update Server Options;255
19.1.2.1;Setting Up Heroku;255
19.1.2.2;The Auto-Update Server;256
19.1.3;Testing Our Auto Update;257
19.1.4;Signing Your Application;257
19.1.5;Building the Application - macOS;258
19.1.6;Generating an Update;258
19.2;Auto Updating Windows Applications;259
19.2.1;Signing Your Windows Application;261
19.2.2;Customizing the Squirrel Installer;262
19.2.3;Generating Our First Build;265
19.2.4;Generating an Update;266
19.2.5;Alternative Solutions;267
19.3;Summary;268
20;Chapter 17: Additional Resources;269
20.1;Additional Electron APIs;269
20.1.1;desktopCapturer;269
20.1.2;crashReporter;269
20.1.3;ClientRequest;269
20.1.4;net;270
20.1.5;DownloadItem;270
20.2;Electron Forge;270
20.3;Community Resources;270
20.4;Summary;271
21;Index;272