This repository contains a step-by-step tutorial and code snippet to learn reactjs.
- Install NodeJS and NPM
- Install IDE of your choice. We recommand Visual Studio Code
- Install React from terminal
- Install reactjs library :
npm install -g create-react-app - Check reactjs installation:
create-react-app -version - Create reactjs project:
create-react-app <projectname>
17.0.1- see
package.jsonfile of a project for detail.
npm start- browse
http://localhost:3000/
- link of tutorial series: https://tinyurl.com/y9rqjzj2
- ReactJS Environment Setup :
#4 - Hello World, Program structure, babel, jsx:
#5(code:tut1) - JSX (javascript extension) in React JS
#6 - How to Render Multiple Elements inside
ReactDOM.render():#7,#8,#9(code:tut2) - JavaScript Expressions, template literals in JSX:
#10,#11,#12(code:tut3) - JSX Attributes, JSX and CSS Style :
#13,#14(code:tut4) - Internal CSS & Inline CSS Styling:
#16(code:tut5) - Simple Greeting Website:
#17 - ReactJS Component:
#18(code:tut6) - React Project into Components:
#19(code:tut7) - ES6 Modules Import Export :
#20,#21(code:tut8) - React JS Props (Netflix App), map, fat arrow:
#22,#23,#24(code:tut9) - Debugging & Error Handling :
#25 - useState in Hook in React JS:
#30,#45(Code:tut10) - Handling Events in ReactJS:
#33(Code:tut11) - Reactjs Forms:
#34,#35(code:tut12) - Spread Operator, "..." three dots do in ReactJS :
#38,#39 - React and other UI framework (e.g., Material UI):
#42,#43,#45 - React component through npm:
#44 - Context API ,
createContext(),useContext():#51,#52(code:tut14) useEffect()after rendering the page:#54(1),#54(2) (code:tut15)- React router (client-side rendering), useParams Hooks :
#56,#57,#60,#61(code:tut16) - Live Search Filter using Hooks & Router:
#62 - Create React 404 Error Page Not Found using React Router:
#64
- Building a Todo List App Project: https://tinyurl.com/ycm42a7b (code:
tut13)