Getting Started With Parcel JS and React
[Step 4 — Auto Install Modules Through Parcel]
Okay, so here’s the cool part about Parcel! If possible I’d like you to have your terminal open (the Server Running At view shown in the image above) so you can see these changes in real time.
With React, we need both the React and React-DOM packages. To get these, let’s navigate to our App.js
import React from "react";
Parcel will now go out, fetch the appropriate package, install it, and rebuild for you. All it takes is a simple line of code!
Here’s a quick screenshot of what the process should look like:
Your package.json
file should also be updated will the new React package.
Now that we are aware that Parcel handles installation for us, let’s go ahead and add the following lines of code at the top of app.js
import { render } from "react-dom";
import { Guitar } from "./Guitar";
The second line is simply for including the subcomponent and has nothing to do with installing packages.
Last of all, let’s go in to our Guitar.js
file and add the following line of code at the top:
import React from "react";
Now launch your web browser and visit localhost:1234
to view the results which should look similar to: