Do It Yourself – Tutorials – ReactJS Frontend Web Development | Learn By Building Projects (including Hooks, React Router, Redux)

by | Feb 14, 2021 | 0 comments

Do It Yourself – Tutorials – ReactJS Frontend Web Development | Learn By Building Projects (including Hooks, React Router, Redux)

by | Feb 14, 2021 | Do It Yourself - Build Your Own Website | 0 comments

Do It Yourself – Website Tutorials



Welcome to this course on React Tutorial of Beginners. This React Developer Online Course will teach you the basics of Front End web development. React is a declarative, efficient, and flexible JavaScript library for building user interfaces. React is a JavaScript library for building Front end interfaces.

👨🏼‍💻React for Beginners👨🏼‍💻
00:00:01 1 – Introduction to React JS
00:13:40 2 – Setting up a React Development Environment from Scratch
00:18:30 3 – How To Build Your First App
00:28:30 4 – Class Component Overview + Understanding JSX (Start COVID-19 – App)
00:38:40 5 – Handling Dynamic Content + Data Fetching
00:49:56 6 – Build Your Own React Components
01:02:03 7 – Styling Components In React
01:11:23 8 – Search Bar React Component in React
01:20:36 9 – Building Your Own methods
01:29:13 10 – How to deploy React App to GitHub Pages
01:38:29 11- React Lifecycle Methods
01:44:42 12- Understanding React Router + Getting started with Insta-app
01:54:52 13 – How To Create a User Login with React.js
02:03:35 14 – How To Create a User Login with React.js (Styling)
02:12:59 15 – How to Creating a custom 404 Page with React Routers
02:23:29 16 – Build A Header Component + Using the NavLink Components to Navigate to a Route
02:34:09 17 – Nested Routes with React Router
02:44:56 18 – Building Home Page with APIs
02:58:10 19 – Displaying contents at Feeds component
03:07:26 20 – Displaying content at suggestions component
03:14:30 21 – withRouter and Dynamic Routing with React Router
03:28:40 22 – client-side logout with React Router
03:40:26 23 – Getting Started with Redux
03:51:56 24 – Using Redux and react-redux
04:11:00 25 – Todo-List with Redux | Rendering Lists React/Redux
04:17:14 26 – Todo-List with Redux | Remove an Item from a List on Delete click
04:29:00 27 – Todo-List with Redux | Editing Todo-List
04:36:54 28 – Todo-List with Redux | Saving an Edited Todo-List
04:49:54 29 – Todo-List with Redux | Deleting Todo-List
05:08:24 30 – Todo-List with Redux | Adding Persistence on changes in Todo-List
05:18:21 31 – Insta App Local state management To Redux state-management
05:29:41 32 – React + Redux – Login Tutorial
05:38:47 33 – Get started with Redux Thunk
05:55:24 34 – Fetching Suggestions in Insta App
06:09:07 35 – Iterators and generators
06:15:43 36 – Getting Started With Redux Saga
06:29:56 37 – running sagaMiddleware
06:38:26 38 – Fetching Suggestions In Insta App
06:45:03 39 – React Hooks | Getting Started With The React Hooks
06:54:56 40 – React Hooks | useState() | Using the State Hook
07:02:10 41 – React Hooks | useEffect() | How to use useEffect React hook
07:12:32 42 – React Hooks | useEffect() | React useEffect hook with Code Example
07:25:45 43 – React Hooks | useReducer() | Using the useReducer Hook
07:37:05 44 – React Hooks | useCallBack() | Using the useCallBack Hook
07:48:31 45 – React Hooks | useMemo() | Using the useMemo Hook
07:58:45 46 – Introduction to Refs in React
08:09:51 47 – Creating Refs Using React.
08:22:54 48 – Working with the React Context API
08:32:54 49 – Toggling Light/Dark Theme in React

link of api – https://api.covid19api.com/countries
Code link -https://github.com/Anshuman301/covid19-cases.git
Covid-19 Stats Web App link – https://anshuman301.github.io/covid19-cases/

#React #ReactJS #ReactTutorial #Router #Redux #Hooks #Node #Express #MongoDB #Nodejs #Rest #ProgrammingKnowledge
★★★Top Online Courses From ProgrammingKnowledge ★★★
Python Programming Course ➡️ http://bit.ly/2vsuMaS ⚫️ http://bit.ly/2GOaeQB
Java Programming Course ➡️ http://bit.ly/2GEfQMf ⚫️ http://bit.ly/2Vvjy4a
Bash Shell Scripting Course ➡️ http://bit.ly/2DBVF0C ⚫️ http://bit.ly/2UM06vF
Linux Command Line Tutorials ➡️ http://bit.ly/2IXuil0 ⚫️ http://bit.ly/2IXukt8
C Programming Course ➡️ http://bit.ly/2GQCiD1 ⚫️ http://bit.ly/2ZGN6ej
C++ Programming Course ➡️ http://bit.ly/2V4oEVJ ⚫️ http://bit.ly/2XMvqMs
PHP Programming Course ➡️ http://bit.ly/2XP71WH ⚫️ http://bit.ly/2vs3od6
Android Development Course ➡️ http://bit.ly/2UHih5H ⚫️ http://bit.ly/2IMhVci
C# Programming Course ➡️ http://bit.ly/2Vr7HEl ⚫️ http://bit.ly/2W6RXTU
JavaFx Programming Course ➡️ http://bit.ly/2XMvZWA ⚫️ http://bit.ly/2V2CoAi
NodeJs Programming Course ➡️ http://bit.ly/2GPg7gA ⚫️ http://bit.ly/2GQYTQ2
Jenkins Course For Developers and DevOps ➡️ http://bit.ly/2Wd4l4W ⚫️ http://bit.ly/2J1B1ug
Scala Programming Tutorial Course ➡️ http://bit.ly/2PysyA4 ⚫️ http://bit.ly/2PCaVj2
Bootstrap Responsive Web Design Tutorial ➡️ http://bit.ly/2DFQ2yC ⚫️ http://bit.ly/2VoJWwH
MongoDB Tutorial Course ➡️ http://bit.ly/2LaCJfP ⚫️ http://bit.ly/2WaI7Ap
QT C++ GUI Tutorial For Beginners ➡️ http://bit.ly/2vwqHSZ

DISCLAIMER: This video and description contains affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. This help support the channel and allows us to continue to make videos like this. Thank you for the support!

source

0 Comments

Submit a Comment

What Our Clients Are Saying

North Burnaby Boxing Club

Thanks so much for all the great work you have done in developing our website Leland!

Manny, North Burnaby Boxing Club

Dieno Digital Marketing Services
5
2018-04-27T01:06:02+00:00

Manny, North Burnaby Boxing Club

Thanks so much for all the great work you have done in developing our website Leland!

JB Consulting

Leland built us a great site at a great price. We can’t say enough about how pleasant it was dealing...

Dave, JB Consulting

Dieno Digital Marketing Services
5
2018-04-27T01:06:57+00:00

Dave, JB Consulting

Leland built us a great site at a great price. We can’t say enough about how pleasant it was dealing with him!

Kelicor Logistics

Leland created my website for my new venture. I found his service to be excellent,was always available to answer my...

Colin, Kelicor Logistics Solutions

Dieno Digital Marketing Services
5
2018-04-27T01:07:34+00:00

Colin, Kelicor Logistics Solutions

Leland created my website for my new venture. I found his service to be excellent,was always available to answer my questions and was always prepared to go the extra mile, in order to ensure my website conveyed it's intended message,, And the cherry on top was it was most affordable. Would definitely recommend. Thanks Leland !

McNeney McNeney Spieker LLP

Dieno Digital has been providing our firm with what we like to call the Royal Package in customer service for...

M, McNeney McNeney Spieker LLP

Dieno Digital Marketing Services
5
2018-04-27T01:08:19+00:00

M, McNeney McNeney Spieker LLP

Dieno Digital has been providing our firm with what we like to call the Royal Package in customer service for over 3 years now. The knowledge and skills Leland brings to the table has increased our business and streamlined our social media platform. Our requests are always dealt with in a timely manner and we are always given options and alternatives to better reach potential new clients. We highly recommend Dieno Digital to increase your life social media presence.
5
4
Dieno Digital Marketing Services
[newsletter_form]
<div class="tnp tnp-subscription"> <form method="post" action="https://www.dienodigital.com/?na=s"> <input type="hidden" name="nlang" value=""><div class="tnp-field tnp-field-firstname"><label for="tnp-name">First name or full name</label> <input class="tnp-name" type="text" name="nn" value=""></div> <div class="tnp-field tnp-field-email"><label for="tnp-email">Email</label> <input class="tnp-email" type="email" name="ne" value="" required></div> <div class="tnp-field tnp-field-button"><input class="tnp-submit" type="submit" value="Subscribe" > </div> </form> </div>