DEV Community

Cover image for React- how to begin

Posted on

React- how to begin

Hello everyone, welcome back to my blog! Or, if you haven't been here before, welcome! This blog is all about react. I'll be showing you the basics of how to begin an application through react. So hang on tight, it's gonna be a bumpy ride. Just kidding, the start up is actually pretty simple to understand!

First off, we need to create the react app in the first place. This is done by going to a handy dandy place called the terminal. Mine is called "Ubuntu" but there are many to choose from. If you are working with ubuntu you are going to navigate to where you want your project to be located. For example, I want mine under "sheridan-codes" so I am going to type "cd sheridan-codes" it should look something like this :
Terminal Example

Once we are in the location we want, we can create our actual project. How exciting! Once in the location, type in "npx create-react-app (what my app is named)" this basically means create a react app that is called something. Let's say for example we want it to be called "practice-app". We would then write npx create-react-app practice-app. Easy enough right? See you're halfway there! This step will look something like this:
Terminal Example Two

Now just a heads up, this step will take a minute to work it's magic, don't be alarmed if it takes a minute or two to say it's done. Once it's completed the installation of the files you can run the usual "code ." to open your project.

Congratulations, you have officially created a project in react! Now you're ready to begin creating components and designing an awesome application. To start kicking butt and taking names. To show Tom, who thinks he is hot stuff and likes to show off, who is boss!

One final disclaimer I feel I need to mention before I leave you. If this is your first project do not, I repeat, do not change or alter the HTML file! Trust me, I have made that mistake before and I had to begin the whole project over again, which was not fun. This is the file you should stay away from:

I hope this information was helpful to you, thank you so much for reading and allowing me to lead you on this journey. Good luck coders, you got this!

Discussion (0)