Creating the project structure

In this section, we are going to create a new project structure and use the React view library to set up the frontend. You are also going to set up the Monaco Editor and its React wrapper component with your Electron application.

We are going to cover the following important aspects when setting up the project:

• Generating a new React application with the official create-react-app tool
• Installing the Monaco Editor, which has been developed by Microsoft
• Configuring and testing the web application
• Integrating the Electron shell wrapper and verifying that it works

First, let's learn how to generate a new application scaffold.

Generating a new React application

When creating a new Electron...