Hi everyone! This is the very first post of mine on hashnode. Hope it will guide most of the beginners to start with their react journey.
Moving forward, let's look at the basic question What is React? React is not a framework, it is a Javascript library used for the frontend development of a website.
Why? A framework is a platform for developing software applications. It contains a set of core libraries, code compiler, and other programs used for development. Whereas on another hand, a library refers to a single unit consist of the pre-defined function used as a part of the framework. React is a library that can be used along with other libraries for software development. It does not provide a platform or compiler for development.
Now let's look at our main question How?
There are multiple ways you can start with.
- You can embed react scripts directly into HTML itself.
- If you are looking to create a single page application you can start with a create-react-app tool or start from scratch.
Create react app
React recommends using create-react-app for beginners and creating single page application. It sets up a development environment by pre-installing dependent libraries. Create-react-app will be better to start with rather than scratch.
Installing To start with create-react-app we need to install it using the package manager.
npm install -g create-react-app
The above statement would install create-react-app globally.
Creating To create a react app we need to run the create-react-app command. For that, we need to use npx package runner tool that comes with npm5.2+.
npx create-react-app myapp
It will create myapp project with dependent libraries installed.
Execute To execute the react app you need to run the start command.
npm start
The server will start and running on port 3000.
Next step🤔, let's decorate our plate with other cuisines.
Redux
We need to keep our food fresh, so we need to store them in the refrigerator. We have a refrigerator as well for our website, we call it redux.😇 we need to install the redux on our system using the below command.
npm install redux
There are other complimentary packages listed over at redux official site
Testing library
Well! the dish is ready 🍲 but we can't serve them directly, we need to test them. There is various testing library just like jest, you can use them within your project. The testing library is used to assert our codebase for correctness.
Starting from scratch
Create-react-app creates an outer structure of your building leaving the interior and decoration up to the developer. The developer needs to add features to the building making it more attractive to the user. If the developer wishes to change the outer structure he can do so by using his own blueprint. For that, the important things that you need would be a package manager, bundler, and compiler. You can check out the official site for the steps to get you started. If you are looking for building a larger project it's better you build your own stack.
Quick go through
At times starting a project from scratch can be quite a time-consuming process. How can we fix this? You could cut down the time factor by developing a boilerplate and then just use that boilerplate every time, just like I did 😉 github.com/Ravina-Deogadkar/react-boilerplate
Happy Coding!