פרסום פרויקט
התחבר עם פייסבוק
התחבר עם LinkedIn
A whole lot of talk about reactJS, redux, better alternative to Angular and more, but what is all that? Have you found a lot of learning material and went through the documentation but are still confused how to code? Here in this article we will break down all the big terms with reactJS like redux, axios, react router, JSX and more with explanation and how to code with that. For this part of the article, we will focus more onto the general setup, understanding how to start, create a basic skeleton with code alongside understanding. For reading this, I believe you have basic understanding of reactJS as this course mainly focuses on how to code reactJS, best practises, redux etc with their understanding.
A whole lot of talk about reactJS, redux, better alternative to Angular and more, but what is all that? Have you found a lot of learning material and went through the documentation but are still confused how to code?
Here in this article we will break down all the big terms with reactJS like redux, axios, react router, JSX and more with explanation and how to code with that. For this part of the article, we will focus more onto the general setup, understanding how to start, create a basic skeleton with code alongside understanding. For reading this, I believe you have basic understanding of reactJS as this course mainly focuses on how to code reactJS, best practises, redux etc with their understanding.
What is ReactJS?
ReactJS is a javascript library created by the facebook community to create user interface and mainly focuses on building single page application. Some of the core features of reactJS are:
JSX: Javascript and XML (JSX) is a simple javascript that lets creation of DOM elements more precisely without making use of HTML. It allow us to use HTML syntaxing and even old fashioned javascript for flexibility.
Single Way data flow: In component’s renderer, immutable values are passed as properties. Components are restricted to modify the properties directly by themselves but they can listen to the callback function.
Virtual DOM: Virtual DOM is a copy of the real DOM. Virtual DOM manages nodes of DOM elements and check for changes in any element. If it finds change in any of the element, it modifies that specific element in the real DOM instead of re-rendering the complete DOM tree.
Let’s get our hands dirty and understand things better by writing some code and creating a simple react project. To create a new project, we will use create-react-app, which provides us a complete boilerplate with configuration of babel and webpack setup and more. Make sure you have npm or any other package manager like yarn installed on your machine as we will be using this for managing our packages.