Running the Epic React Workshop App

In this project, I need to run the npm script npm start (this is shorthand for npm run start).

We can do this in a terminal. Some editors, like VS Code have them integrated.

Try to run this just in one place. If you run it in a second, it will ask you if you want to run on a different port. If you say yes, you’ll need to make sure that you’re using the right port or you may not see the updates.

Open localhost, port 3000 in a browser.

Here you’ll find an index off all of the lessons in this workshop.

Click into a lesson.

On the left, you’ll find the a lesson, assignment, and extra credit (where applicable).

On the right, you’ll see the exercise. This is where you’ll see your code appear (more on that later). A final tab. This is where you see the working final example to compare against. And finally, tabs for any extra credit finals.

Now let’s talk about this Open … in isolated page button. It does what it says (click). But why? If we open up the dev tools, we see that we’re getting this entiiiire page. This can greatly distract from the intent of the lesson. In the isolated page, we see only the application.

Something I do in my favorite browser (arc) is to open these into different tabs…

Read everything

I strongly recommend going thru every lesson. Each of these lessons packed with great links to documentation and supplamentary resources that will help you way-find in your day-to-day job.

I have been writing apps, professionally, since 2013. And I tell you what, I learned something new in every one of these lessons, from React Fundamentals thru to performance.

Fially,

There are a couple links at the end of each exercise that will point to a production build.

While this is most important for the perfombarenc workshop, these will point to hosted versions of these examples using the PRODUCIOTN build flag. Which we talk more about in the performance workshop.

As you’re done, just click on the name of the next lesson. Or go back whenever you need.