Create & Start React App
We are going to learn how to create react app using Node Package Runner. In short npx is the command for node package runner
npx command is available in node version 5.x onwards, please make sure you have Node.js & npm installed globally. If you have not installed, please visit this post on how to install node-js
Open terminal if you are using Mac or command prompt if you are using Windows and enter following command to ensure we have node and npm installed
node -vnpm -v
If you don’t see version number, then mostly like you don’t have npm or node is installed, either npm & node is not setup properly in environment variables.
I am going to using Visual Studio Code Editor for the development. I am launching VSCode and choose the folder I like to create my project. Open new terminal and typing following command
npx create-react-app classroomnpx is a replacement for installing global packages. It encourages you to install packages locally, but still be able run them as if they were global, just with npx.
Once installed successfully you will see below screen
Now navigate to react app and start the server. I created classroom as application name, so I will have folder name “classroom”
cd classroom
npm start
npm start command will start react-app we created and launch the default browser, you should be able to see app up and running shortly.
Nice to have tools for React app development
1.) Code Snippet
Code snippets for Visual Studio code is great for beginners to expertise to get things done quickly. It will allow us focus on building application.
Follow this link to Install Extension in your VSCode ReactJS Code snippet extension for Visual Studio or Go to extension sidebar in VSCode and search for Reactjs code snippet and click install button
2.) Chrome React Extension
React team has very good chrome browser based extension, it’s one of good tool to have for react app debugging, profiling, etc.
Follow this link to installChrome reactjs extension
