Path Courses
Introduction to React : Getting Started
Get started with React, the widely used JavaScript library for building modern and highly responsive web applications. In this course, you'll learn about React History, React Ecosystem, React advantages and setting up an environment for React development. Further, discover how to work with the React CLI to create and run your React Application.
What you will learn:
- Introduction to React
- React Top Level APIs
- React CLI
- JavaScript XML (JSX)
- JSX Transpiler : Babel
- JSX Fundamentals
React Fundamentals
React is one of the most popular JavaScript libraries to build rich applications for browsers and mobiles. In this course, you will learn the fundamentals of React of building applications using React CLI and VS Code. Learn to discover, React powerful features such as components, props, state, data binding, events and comprehensive routing.
What you will learn:
- Introduction to React Component
- Types of React Components
- Props
- State
- Data Binding
- Events in React
React Routing
Routing is one of the important concepts in terms of features while developing a Single Page Application (SPA). Using routing you can load the view partially without loading the web page again from the server which makes our web app very much faster in terms of performance.
React doesn't support built-in routing. You need to use third-party routing packages. The most popular package is react-router. Learn to leverage the React Routing basic and advanced concepts along with bootstrap integration.
What you will learn:
- React Router Basics
- NavLink and Link
- React Routes
- Route Parameters
- Routing with Login and Logout State
- Nested Routes
- Lazy Loading
React Advanced Concepts
Get started with React advanced topics and best practices to build a full-stack JavaScript application. In this course, you'll learn the React most advanced features including component inheritance, reusable components, data sharing among components, passing data to a child component, component lifecycle and React hooks.
What you will learn:
- React Components Inheritance
- React Components Composition
- Passing Data to Child Components
- Component Life Cycle
- React Hooks
- State and useEffect Hooks
React Forms and Validations
Forms are one of the few HTML elements that are interactive by default. React helps us to make HTML Forms much more interactive as well as to validate user input. In this course, discover how to create controlled and uncontrolled forms in React and finally, validate the form's input controls.
What you will learn:
- Introduction to React Forms
- Controlled Form
- Uncontrolled Form
- Creating React Form
- React Form Validations
- Custom Validations
React Unit Testing
Testing an application building blocks are really important to make a robust application. This course is all about testing React applications with Jest. Here, you'll learn everything you need to test your React components and applications. Next, you’ll dive into the various testing techniques, setup and mocking that you can use to make your tests more readable and efficient.
What you will learn:
- Introduction to Unit Testing
- React Jest Test Setup
- Unit Testing Enzyme
- Simulate Event
- Testing Component
React State Management Using Redux
Redux is a powerful library which help to store and manage your JavaScript application state globally. In this course, you'll learn how to manage your React application state globally.
What you will learn:
- Introduction to Redux
- When to Use Redux?
- Introduction to React Redux
- Setting Up React App with React Redux
- Redux Flow
- Creating Actions, Reducers and Store
- Connecting React Components to Store
- Accessing and Updating Store
React Form Validation With Formik And Yup
Forms are an integral part of any web applications. Validating the user input data through the form is a critical aspect of our jobs as web developers. In this article, we’ll learn how Formik handles the state of the form data, validates the data, and handles form submission.
Lab Objectives
Upon completion of this Lab you will be able to:
- Create SignUp Form Using Formik and Bootstrap
- Apply Validations Using Yup
- Design UI using Bootstrap
Lab Prerequisites
You should be familiar with:
- React
- Bootstrap
- Formik
Building a React Autocomplete Component From Scratch
Autocomplete provides a superior user experience to your website visitors. It also helps to avoid redundant spelling errors while searching. In this course, you'll learn how to build a React auto-complete component from scratch.
Lab Objectives
Upon completion of this Lab you will be able to:
- Create UI For Auto Complete Using Bootstrap
- Auto Complete Search
- Highlight Chars
Lab Prerequisites
You should be familiar with:
- React
- Bootstrap