In this video we are going to learn about React – Redux using Redux toolkit by build a project movie rating application from scratch. This video course is specially if you are planning to learn React with Redux Toolkit State Management library as a beginner. We will build a movie rating application and along with that we will use Axios for API calls, React Router DOM for Routing and Node-SASS for our SCSS compile to CSS.
We will continue to enhance the application we will see how we can convert a synchronous action creator into a asynchronous action creator using Redux Middleware Thunk.
You will find the topics covered in the timestamp below.
🔥 Unacademy 👇
Use my code “dipesh01” to get 10% discount
You get all of this and much more for a nominal fee of Rs999/- for the entire year and with my code you get this for Rs 899!
Career as a Developer: https://unacademy.com/goal/career-as-a-software-developer/FOBOI
Placement Tips & Hacks: https://bit.ly/Unacademy-Anshul-SoftwareDevelopmentEvent
⭐️React Redux Toolkit with Project – Part 1⭐️
⭐️GitHub link for Reference⭐️
https://github.com/dmalvia/React_Redux_ToolKit_Movie_App
⭐️OMDB API⭐️
https://www.omdbapi.com/
⭐️ Support my channel⭐️
https://www.buymeacoffee.com/dipeshmalvia
***React Roadmap for Developers in 2021***
How to Learn React JS ? – https://youtu.be/06yVj8pcO5c
React Fundamentals Project – https://youtu.be/QoJGKwo20is
Learn React Redux with Project – https://youtu.be/0W6i5LYKCSI
What is Redux ? – https://youtu.be/qNjNn9BCWCc
Learn React Redux Thunk with Project – https://youtu.be/JDZRfLGNWdc
Learn CSS GRID Tutorial – https://youtu.be/zs7JzkWixPo
***Checkout these video to understand better***
JavaScript ES6 Arrow Functions – https://youtu.be/TgzVxiPdCDU
JavaScript Higher Order Functions & Arrays Methods – https://youtu.be/m2_kagsc3_c
JavaScript ES6 Destructuring – https://youtu.be/rpYg2M2lNAE
🔥 Video contents… ENJOY 👇
0:00:00 – Intro
0:00:24 – Application Demo
0:02:23 – Unacademy Promo
0:05:00 – Code Walkthrough Sync Action Creators
0:05:30 – Redux Middleware Thunk – Redux Toolkit
0:06:36 – Create Async Action Creator
0:08:57 – Create extraReducers
0:09:22 – Async Action Creator Lifecycle
0:13:41 – Async Action – Fetch Shows
0:15:53 – Add Shows to Movie Listing Component
0:18:57 – Add CSS Transition
0:20:13 – Navigation – Movie Detail Component
0:23:19 – Async Action – Fetch Movie Details
0:25:49 – useParams Hook
0:30:00 – Movie Detail Component with SCSS
0:42:10 – UseEffect Cleanup Function
0:43:00 – Sync Action – Remove Selected Movie/Show
0:45:04 – Conditional Movie Detail Loading
0:47:33 – Outro
***More videos***
JSON Crash Course – https://youtu.be/6OhMbf2v_jI
Asynchronous Vs Synchronous Programming – https://youtu.be/oesicy3CcXE
Async JavaScript Callback – https://youtu.be/1zeuvEvw5uw
Async JavaScript Promises Tutorial – https://youtu.be/JvV4Rz2PpzA
***Checkout my crash courses for get started with web development***
JavaScript Tutorial For Beginners – https://youtu.be/sptS-bgg8Ro
HTML5 Crash Course in 1 Hour – https://youtu.be/Aj3QFsmsagc
CSS Crash Course in 1 Hour – https://youtu.be/nYsk_U_A_lc
🔗 Social Medias 🔗
Twitter: https://twitter.com/IMDmalvia
Facebook: https://www.facebook.com/programmingwithdipesh
Instagram: https://www.instagram.com/dipeshmalvia
LinkedIn: https://www.linkedin.com/in/dmalvia/
⭐️ Tags ⭐️
– React Redux Toolkit
– React Redux Toolkit Tutorial
– React Redux Toolkit Crash course
– React Redux Toolkit Project
– React Redux For Beginners
⭐️ Hashtags ⭐️
#React #Redux #Toolkit #Beginners#Tutorials
Disclaimer:
It doesn’t feel good to have a disclaimer in every video but this is how the world is right now.
All videos are for educational purpose and use them wisely. Any video may have a slight mistake, please take decisions based on your research. This video is not forcing anything on you.
Comments