The Course
When crafting this course from the ground up, I had one goal in mind: to make your journey into frontend development both empowering and enjoyable. With a laser focus on the practical side of things, every lesson is organized into bite-sized, actionable steps, allowing you to quickly grasp key concepts and put them to use in real project scenarios. I've included plenty of examples, best practices, and hands-on exercises to ensure that as a beginner, you effortlessly transition from understanding the basics to creating dynamic and efficient web applications. Plus, I'm always here to help guide you through any bumps along the way, making sure you gain the confidence and skills to shine in the tech world.
What you will learn
When crafting this course from the ground up, I had one goal in mind: to make your journey into frontend development both empowering and enjoyable. With a laser focus on the practical side of things, every lesson is organized into bite-sized, actionable steps, allowing you to quickly grasp key concepts and put them to use in real project scenarios. I've included plenty of examples, best practices, and hands-on exercises to ensure that as a beginner, you effortlessly transition from understanding the basics to creating dynamic and efficient web applications. Plus, I'm always here to help guide you through any bumps along the way, making sure you gain the confidence and skills to shine in the tech world.
Curriculum
- Managing state with useState Hook (27:28)
- Mastering the 3 usages of the useEffect Hook (31:56)
- Prop Drilling, and Context API in React (41:51)
- Creating Custom Hooks (22:58)
- Introduction to Redux (13:29)
- API calls with Redux Thunk (51:36)
- Mini Project 1 | React-Redux Notifications (48:02)
- Quiz on State Management in React
- Introduction to Testing in React (11:38)
- Setting up Vitest for testing React Components (16:08)
- Writing unit tests with Vitest (20:07)
- Testing Async Behavior - Mocking props and files (43:43)
- Writing Integration tests (30:19)
- Writing end-to-end tests with Playwright (33:43)
- Running the tests on GitHub actions (15:54)
- Quiz on Testing in React
- Project Introduction (5:36)
- Setting up application routes (4:31)
- Configuring the Root Layout for UI consistency (3:25)
- Configuring the Redux Store and adding items to Cart (13:57)
- Implementing Menu item Redux actions & selectors (22:33)
- Persisting Redux state in the browser (9:53)
- Implementing the Cart page (5:15)
- Implementing the Checkout page (20:00)
- Creating Orders and saving in Redux (25:50)
- Render Orders and Search from the header (28:45)
- Quiz for Pizza Restaurant App
Your instructor
Muhammad Ahsan Ayaz brings a wealth of experience to his role as an educator in the field of web development, with a particular focus on React. Ahsan is an author of multiple world-wide published books (https://ng-cookbook.com) and is acknowledged by Google for his expertise in Angular. Over the years, Ahsan has honed his skills, working on numerous projects that have utilized Web Technologies, Angular, and React for their dynamic capabilities and efficiency. He also has published several open-sourced projects with more than 10 Million installs overall. His industry experience has provided him with a rich understanding of the practical applications of React in modern web development, and his expertise is reflected in the successes of his projects and the proficiency of his teaching.
Comprehensive
Mastering the Fundamentals of React for Real-World Applications
Hands-On
Interactive Learning with React: From Basics to Advanced Techniques
Streamlined
Efficient React Development: Essential Concepts for Rapid Prototyping