Day 0 - 2020.05.14

Intrduction

This is 2020, and this is an era of data. And we are all connected to some networks to make our lives easier. Doesn't matter which and what type of network. And most of them are connected to WWW, we simply call it just Web. In web we perform may operations. One major operation is presenting data. To present data we can follow different methodologies. But most interesting and widely used method is HTML. HTML was so static. To make it more cool, different scripting languages were introduced and different styling sheets were introduced too, to make it gorgeous. And a trio was formed all on a sudden HTML + JS + CSS.

Now let's not waste time and try to know WHAT is REACT.JS ?

React.js is a JS library. So what does a library do ? It provides us with more functionalities.

Now, WHY we should learn REACT.JS ?

• Component based system
• Virtual DOM(As this tutorial is for begineers - I will skip this for now)
• Simple
• Easy to learn
• Data flow - one way
• Event - one way
• Performance
• JSX
• Really trendy
• Open sourced
• Developed and maintained by Facebook

Each and every one of them will be discussed if you guys stick to me.

Installation

I will be using Node on Windows and Codesandbox all over the tutorial. Although react.js provides CDN, we won't be using that, we will also disscuss that in a while why we won't be using that all over our journey. But maybe for two or three instances we will use that.

Node installation

Node can be downloaded from here : Node official

Select your configuration and download. Try to download a latest and also stable(LTS) version.

Validating Node installation

If you have made this far. Run this command to check its installation :

DOS-BLnode -v

React installation

Now run the following command to install react :

DOS-BLnpm install -g create-react-app

We will even discussing about all command in a while.

Validating React installation

If everthing works fine be the following command we will be able to generate an empty react application. This will take time, if you don't have SSD and a good network connection it will take a lot of time. So take a nap, or do some other thing. Check for this in while. When you see happy hacking, it's time do some hacking.

DOS-BLcreate-react-app project-name

Now run the following command : When the application is generated successfully we will be able to run it by this command.

DOS-BLnpm start

This will also take some times. Now you will seeing two IP addresses on the DOS-BL, enter anyone of them. Both will work. Local - is only for you. And netowrk is for, is you want to share it with someone over the network real-time. Keep in mind the user must be in same netowrk.

Web IDE

Those who have low configuration PC or having problem with installation, just carry on with a Web IDE. I personnally use codesandbox and recommend it. Here is the link : Codesandbox.io

Signup with Github. Now click on - "Create a sandbox, its free". There you should see under Official template - React(Codesandbox team)

Conclusion

We just setup our environment. We will start next week. Thanks. If you encountered any problem, feel free to mail : maifeeulasad@gmail.com with subject "React Tutorial - day - 0", or create a bug report in my git repository : here. Give title like - "Day - 0 - little description"