This video is available to students only

Create React App

A lot of things need to be considered to create the scaffold of a modern React application, like allowing for a modular-based app, compiling ESNext code, transpiling TypeScript code, etc. To avoid spending too much time with build tools, we'll create a modern React/TypeScript application with a single command - create-react-app.

📝 This lesson's quiz can be found - here. 🗒️ Solutions for this lesson's quiz can be found - here.

Our focus thus far has been building a GraphQL API from the server-side of our app. We're now going to switch our focus to the client-side of our app. The core piece of our client application is going to be React.

For simple React applications, we're able to create a React app by introducing a few script tags in an HTML file. There are a few limitations to this approach which make it difficult to write complex applications. We're unable to use JavaScript modules and being able to compile TypeScript and ESNext code becomes difficult or practically impossible to maintain as an application becomes larger.

Webpack#

The Webpack JavaScript bundler can help us here.

Webpack is a third-party tool that helps bundle JavaScript code. A JavaScript bundler bundles all the JavaScript code used in an application, which includes the code we write and the code of any external libraries, and bundles them into a single bundle. This bundle could be a single file or a series of a few files.

Start a new discussion. All notification go to the author.