• RAM vs. I/O latency
• Blocking vs. Non-Blocking
• Event-driven Programming
• Event Loop
• Blocking The Event Loop
• js Philosophy

• Download and Install
• First Hello World

• Anatomy of a module
• Private code
• Accessing and using modules
• npm commands
• json

• What are callbacks
• Callback-last
• Error-first

• When to use Event Emitters
• Binding Functions to Events
• Event Requests
• Event Listening

• Callbacks: Error-first
• Errors in Event Emitters
• Uncaught Exceptions
• Using Domains

• Why Buffers exist
• Creating Buffers
• Reading and Writing Buffers
• Manipulating Buffers

• What are streams
• Read and Write Stream API
• Flow Control
• Piping
• Duplex Stream
• Transform Stream

• Listening for
• Broadcasting
• Answering questions

• No SQL and Document Stores
• Relational DBs
• Configuration and platform setup
• CRUD Operations

React is a JavaScript library created by Facebook. It enables developers to create massive web apps by connecting simple components together, much like Lego parts. It offers speed, simplicity, and scalability.

In just a few years, React has grown to become the world’s most popular JS library. It is now utilised by millions of websites, such as Facebook, Netflix, Instagram, Uber, and Airbnb.

Introduction to React

• Presenting React?
• Specs, pros and cons
• Setup requirements
  • Node JS
  • nvm
• React Hello World!
• Fast refresh and hot reloading
• Building and deploying a React application

JSX and rendering

• Adding React to the root
• JSX Language
• JSX abstractions: createElement() and React Elements
• Special attributes: className, style, key, etc.
• Commit Optimizations

Components

• Functional Components
• Properties (React Props and destructuring)
• React State
• Scheduling of setState
• setState and mutations

Component Architecture

• UI is a function of state
• Three phases of change: trigger, render, commit
• Component render and pure functions
• State immutability (objects and array)

Managing Events

• Event listeners
• Synthetic Events

Functional programming using Hooks

• What are Hooks
• Rules of Hooks
• Custom Hooks

Layouts

• CSS, styles and CSS-in-js
• Sass and Less
• Post-CSS and autoprefixer
• StyleX

Routing

• Using the key atribute
• Navigation, NavBars and Links
• Hash Links, History API, Navigation API
• Using usesyncExternalStore()
• React-Router-DOM

Forms

• Controlled components
• Uncontrolled components
• Refs
• PreventDefault

Loading data into State

• Using Promises with use()
• Using fetch() to get data from REST API
• Modify data with a REST API
• Asynchronous programming with JS
• Using notifications

Loading data with Routing

• Data loaders with the new React-Router-Dom
• Modifying Data with actions
• The role of Forms
• Suspense

React tooling

• Intro to the React Dev tools
• Debugging Extension
• Viewing the component tree
• Analyzing performance with profiler
• Detecting what is re-rendered

Once you’ve mastered the fundamentals of React, you’re ready to progress to the next level. We cover all of the obscure issues, including React architectural patterns, custom hooks, render props, higher order components, performance optimisation, shared context, lazy loading, reducer pattern, Redux, suspense loader, Next.js, Remix, security, and many more.

We even use complex components such as charts and maps.

Context

• Property drilling
• Why use context?
• Creating context using createContext()
• Using providers
• Consuming context with hooks
• Updating Context

Effects and useEffect()

• Sync external systems with Effects
• Make your component renders pure
• Cleanup functions
• Effects LifeCycle

React Architecture Patterns

• Separation of concerns in Components
• Higher-Order Components
• Render Props
• Custom Hooks
• Reusing Components

Reducer pattern

• Replacing state with reducers
• Pillars: Storage, Dispatch, and Reducer
• Action helpers
• Calling useReducer()
• Write mutative code with “immer”

TanStack Query

• Requests, deduplication, caching
• Data Fetch
• Data Updates
• Plugins

Optimize React performance

• Using production build
• Avoiding re-renders
• Memoizing components with the memo() Higher Order Component
• useCallback() to make it work properly with memoized callbacks
• useMemo() to memoize results instead of callbacks

Error Boundaries and Display management with Suspense

• Managing Errors using ErrorBoundaries
• Using Suspense for Lazy Loading
• Using Suspense for Data Fetching

React Server Components (RSC)

• RSC Architecture
• Components: Server vs. Clients
• Client boundaries
• Client-Server separation
• Async data and Suspense

React 19

• Forms and actions
• Transitions and animations
• Metadata
• Directives: “use client” and “use server”

Advanced UI

• Animating transitions using React-Spring
• Charts using Chart.js
• Adding maps using Leaflet and ESRI

Logins and Authentication

• Basic authentication in React
• Implementing a login form and a logout button
• Storing and managing user credentials
• Protecting routes and components
• JSON Web Tokens (JWT)
• Understanding and preventing common security vulnerabilities

It is safe to say that you are searching for proficient React.js course in Islamabad Pakistan? Your hunt finishes here. Nizi Solutions offers a best React.js course in Islamabad.