Nowadays, starting a React app is as simple as typing a line of command into the terminal, taking for granted what happens under the hood. We use create-react-app or other boilerplates to start the development process and dive straight into the actual React code.

However, it would be a great learning experience (especially for those who are beginners) to set up a react app from scratch on your own. It will cement your understanding of the bits and pieces that goes into a react application from scratch to deployment. As people say, you learn stuff from breaking things apart and putting it all back together.

In this article I will show you how to set up a react app from an empty directory using the latest Webpack and Babel. On the way, I will explain the ‘parts’ needed to have a react app working. Hopefully, by the end, you will get the big picture and understand the concepts of building and serving a react application. These concepts and understanding may hopefully aid you elsewhere in web development process using other React, other JavaScript libraries, or even other languages!

This article is intended for those who have some basic understanding of JavaScript. It will make it easier going forward. Although, I expect total beginners in coding could follow along too. As always, you can use the mighty internet for reference of parts you still have trouble understanding. Meanwhile, I will try to explain each part as best as I can.

I recommend you to follow along and code on your own while observing this ‘tutorial’. Speaking from experience, coding on your own will help cement the concepts and understanding rather than just reading along.

#web-development #javascript #react #programming #reactjs