Normal Cost €1,950
Subsidised through TIAS to €800
CourseDescription
React is a JavaScript library for building user interfaces. It was originated by Facebook and is maintained by a community of individual developers and companies. React can be used as a base in the development of component based web sites and single-page applications.React depends on plugins and libraries for certain features that are a core part of other frameworks. This course will cover plugins for routing (ReactRouter), ajax calls (React Query) and state management (Redux) as well as the core React functionality. This course will highlight the current features inReact and highlight the things that have changed. React has evolved quite considerably over the years and some tutorials that you can find on the internet are out of date even if they are only a few years old.
Prerequisites
Understanding of HTML, CSS andJavaScript.
This is a beginners course and no experience of React, Angular or Vue isexpected.
Introduction
Using Components for WebApplication Development - React, Angular & Vue
History of React
The node.js ecosystem
Setting up a development environment
JavaScriptES6 Features
let and const
Destructuring
The Spread operator
Optional chaining (?.)
Arrow functions
Understanding map operations
Types of imports
React Core features
React Hello World
React Components
Rendering a component
Introduction to JSX
React Components
Class Components
Functional Components
JSX syntax
Fragments
Props
Events
Understanding how components are rendered and re-rendered
Styling components
Conditional rendering
Rendering a list
Higher order components
React Hooks
What is a "React Hook"?
useState; useEffect; useCallback; useMemo
React Forms
Binding to form elements
Event handling
Validation
Understanding state - state management
Custom validation
React Router
Single Page Applications
Adding react router to the project
Configuring react router
Query strings and url parameters
React Query
Understanding Ajax
A brief history of Ajax calls in React
React-Query
Create an api using json-server
Make an ajax call
Loading animation
Full Crud example
Authentication
Authentication and Authorisation
Using OAuth with React
Adding Authentication to React
Add a Login button
Add a Logout button
View logged in user profile
Create higher order component to apply authentication
Advanced Styling
What are "StyledComponents"?
Using Bootstrap
Material UI Library
Advanced State Management
Understanding State
The useState hook
What is "prop-drilling"?
The use Contect hook
Introducing Redux
Reducers
React Best Practices
Thinking in React
Some React anti-patterns
Understanding Virtual DOM
Component lifecycle
Integrating with other libraries
Deploying Your React App
Build your app
Upload to firebase
Apply a custom domain
