Full Stack Web Development with React and Node JS

INTRODUCTION TO HTML

• What is static/Dynamic Website
• What is SEO Friendly Website
• What is Responsive Website
• What is HTML
• HTML4 VS HTML5
• EDITORS IN HTML

WORKING WITH BASIC TAGS

• DOCTYPE In HTML
• Tag and Attributes
• Title and Meta tag
• Headings and Paragraph
• Formatting Tags
• EDITORS In HTML

ANCHORS AND HYPERLINKS

• Internal link
• External link
• Text link
• Image link
• Email link
• Phone link
• target attribute

WORKING WITH LISTS

• Ordred List
• Unordred List
• Definition List
• Nested List
• List Attributes

WORKING WITH GOOGLE MAP & YOUTUBE

• Google Map Insertion in Webpage
• Youtube Video Insertion in Webpage

WORKING WITH TABLES

• Creating Tables on a Web Page
• Altering Tables and Spanning Rows & Columns
• Placing Images & Graphics into Tables
• Aligning Text & Graphics in Tables
• Adding a Background Color

WORKING WITH HTML FORM

• HTML Input tags
• HTML Input Attributes
• Setting up form
• Form attributes
• Submit and Reset Button

HTML5 SEMANTIC TAGS

• header and footer tag
• section tag
• figure and figcaption
• nav and aside tag

HTML5 AUDIO & VIDEO

• Audio Tag
• Video Tag

HTML5 API'S

• Drag & Drop
• Local Storage
• Geolocation

COURSE CONTENTS OF CSS

INTRODUCTION TO CSS

• What is CSS?
• How CSS Works?
• Types of CSS,Internal,Inline,External
• CSS Selectors
• Comments In CSS
• How to Link External CSS

WORKING WITH BASIC CSS PROPERTIES

• Selectors : Class or Elements
• Colors
• Height / Width
• Border
• Margin and Padding
• CSS Box Model

WORKING WITH WEB LAYOUTS

• Aligning Div
• Two Div Align
• Three Div Align
• Four Div Align
• Use of floats
• Clearing float
• Inline or Block Element

WORKING WITH BACKGROUND,GRADIENT OR IMAGE SPRITE

• Background Color
• Background Image
• Background Position
• Background Attachment
• Gradient Colors
• Image Sprite

WORKING WITH TEXT PROPERTIES

• Text Alignments
• Line height(Leading)
• Letter Spacing(Kerning)
• Font Family
• Font Size with Font Weight
• Tips For Improving Text Readability

WORKING WITH ICONS & FONTS

• Use of Font Awesome
• Use of Flat Icons
• Use of Google Fonts

WORKING WITH MENUS AND POSITIONS

• Static Position
• Fixed Position
• Absolute Position
• Relative Position
• Creating Menu
• Menu With Multi Dropdown

WORKING WITH BORDER AND SHADOW

• Border
• Border Image
• Rounded Corner
• Box Shadow
• Text Shadow

WORKING WITH OUTLINE AND UI

• Outline
• Outline Offset
• Resize

WORKING WITH IMAGE STRETCHING PROBLEM

• Object Fit : Fill
• Object Fit : Contain
• Object Fit : Cover

WORKING WITH HTML FORM & CSS

• labels with inputs
• Form-based selectors
• Changing properties of form elements
• Formatting text in forms
• Formatting inputs
• Formatting form areas
• Changing the appearance of buttons
• Laying out forms

WORKING WITH 2D & 3D TRANSFORMS

• translate
• rotate
• skew
• scale

WORKING WITH HOVER,TRANSITIONS & ANIMATIONS

• Hover Effects
• Transitions
• Animations
• Creating Web Ads Using Animation

INTRODUCTION TO BOOTSTRAP

• What is a Responsive Website
• What is Bootstrap
• Where to Download
• How to Use Bootstrap
• Bootstrap Directory Structure

WORKING WITH GRID IN BOOTSTRAP

• What is Grid System
• Use of Grid System
• small, medium, large Grid System
• Container Vs Container-fluid

WORKING WITH IMAGES, TEXT, TABLES

• image responsive
• rounded image
• circle image
• text-align
• text colors
• responsive table

WORKING WITH BOOTSTRAP FORM

• labels
• form inputs
• input classes
• type of buttons
• form layouts

WORKING WITH WEB LAYOUTS, MENUS

• Container Layout
• Container Fluid Layout
• Proper Use of Rows and Columns
• Menu
• Single Dropdown Menu, Multilevel Dropdown Menu
• Mobile Menu / Collapse Menu

WORKING WITH SLIDER, TAB PANEL, MODAL BOX

• Responsive Slider
• Tab Panel
• Modal Box
• Menu
• Single Dropdown Menu, Multilevel Dropdown Menu

WORKING WITH CSS HELPERS, RESPONSIVE UTILITIES

• Class Helpers
• Responsive Utilities

INTRODUCTION TO JAVASCRIPT

• What is Javascript
• Use Of Javascript in Web Development/Designing
• Javascript vs Ecmascript
• Developer Console
• How To Use Javascript

JAVASCRIPT BASICS

• Variables
• let,var,const
• Hoisting
• Data Types (Premitive,Non-Premitive types)
• Operators
• Pop Ups (alert,prompt,confirm)

JAVASCRIPT CONDITIONS,LOOPS

• if condition
• if else condtions
• nested if else
• switch statement
• while loop
• for loop
• Operators
• Pop Ups (alert,prompt,confirm)

JAVASCRIPT ARRAY,STRING

• What is Array
• Accessing array
• array methods
• What is string
• accessing string
• string methods

JAVASCRIPT FUNCTIONS

• What is function
• function with arguments
• return function
• closure
• higher order / callback function

JAVASCRIPT OBJECTS,CLASS,INHERITANCE

• What is objects
• when to use object
• how to use object
• getters and setters
• prototypal inheritance
• native prototype
• methods for prototype
• class inheritance

JAVASCRIPT EVENTS

• Mouse Events
• Input Events
• Click Events
• Load Events
• Keyboard Key Events

JAVASCRIPT DOM (HTML AND CSS MANIPULATION)

• What is DOM
• DOM Selectors
• DOM with HTML
• DOM with CSS
• DOM Animations
• DOM Nodes
• DOM Nodes Collections

JAVASCRIPT BOM (WINDOW EVENTS)

• What is BOM
• BOM Screen
• BOM Location
• BOM History
• BOM Navigator
• BOM Cookies
• BOM Timings

JAVASCRIPT AJAX AND JSON

• What is AJAX
• Ajax XMLHttp
• Ajax Request
• Ajax Response
• Ajax XML Files
• What is JSON
• JSON vs XML
• JSON Data Types
• JSON Parse
• JSON Stringify
• JSON Objects
• JSON Array
• JSON HTML
• JSON JSONP

JAVASCRIPT ADVANCE CONCEPTS

• this keyword
• closure in detail
• Immediately Invoked Function Expression (IIFE)
• Event Bubbling vs Event Capturing
• apply,call and bind methods
• variable scope and hoisting
• object in details
• callback (higher order) function
• ecmascript
• HTML API's

Course Content : 
ES6 Concepts

• Arrow Function
• Map
• Object.keys
• Destructuring
• let,const,var
• ...(Spread Operator or Transpiler)
• backticks (``)
• Class and Objects
• Inheritance
• bind()
• this keyword

React Introduction

• Introduction to React
• Why React ?
• Virtual DOM
• npm,npx,yarn
• Basic CMD Commands for React
• React Installation
• React Folder Structure
• Running React App

Components In React

• Significance of component architecture
• Types of Components
• Functional Component
• Class Component
• Component Composition
• state
• props
• default export & named export component
• Introduction to Component Life Cycles
• ComponentDidMount
• ComponentDidUpdate

React Router

• Overview & Installation of React Router
• How to use in Project
• Nested Routing

React Bootstrap

• React Bootstrap Installation & Setup
• Working with React Bootstrap Components

Styling React Components

• Styled Components Overview
• Advantage of using styled components
• work with styled components

Working with API calls

• Api overview
• fetch
• axios

Working with Form and Events

• Working with Forms
• Events (keyup,click etc.)
• this.bind
• Arrow function

Code Splitting

• What is code splitting
• Why do you need code splitting
• React.lazy
• Suspense
• Route-based code splitting

Context Api

• Introduction to Context API
• When to Use Context
• Create Context
• Context.Provider
• Context.Consumer
• Reading Context in Component

React Hooks

• What are Hooks
• Why do you need hooks
• Different types of hooks
• useState()
• useEffect()
• useContext()
• useDispatch()
• useSelector()
• useReducer()

Redux & React Redux

• Introduction to Redux
• Why Redux
• Redux Principles
• Installation of Redux ,React-Redux
• CreateStore,Action,Dispatch
• Understand higher order component
• Understanding mapStateToProps and mapDispatchtToProps usage

• What is NodeJS?
• Node JS Installation
• Hello World NodeJS
• Modules in NodeJS
• File Handling in NodeJS
• How NodeJS Works?
• Building HTTP Server in NodeJS
• Handling URL's in NodeJS
• HTTP METHODS
• Getting Started with Express and NodeJS
• How Versioning Works in NodeJS?
• What is REST API?
• Building REST API's using Node and Express.js
• Introduction to POSTMAN for REST API's
• Express Middleware
• What are HTTP Headers in API
• HTTP Status Codes
• Getting Started with MongoDB
• Connecting NodeJS with MongoDB | Mongoose + Express
• Model View Controller in NodeJS | MVC Pattern
• Create a Custom URL Shortener using Node.JS and MongoDB
• Server Side Rendering with EJS and Node.JS
• Building Node.js Authentication from Scratch
• JWT Authentication in NodeJS
• What are Cookies in NodeJS?
• Authorization in NodeJS
• Creating Discord Bot in NodeJS
• Uploading Files with NodeJS and Multer
• Setting Up Project - NodeJS Blogging Application with MongoDB
• Setting up Authentication - NodeJS Blogging Application with MongoDB
• Deploy NodeJS Application on AWS - Amazon Web Services | NodeJS
• WebSocket in NodeJS | Socket.IO - Real Time Messaging
• NodeJS Streams
• How to scale NodeJs applications using the cluster module.
• What is Nginx?
• Install and Setup Nginx
• Serve Static Content with Nginx
• Full Node.js Deployment - NGINX, SSL With Lets Encrypt
• Serverless Framework with NodeJS
• What is Serverless? | Serverless Vs Monolith | AWS Lambda
• GraphQL Crash Course - GraphQL NodeJS
• Threads App GraphQL Clone
• Setting up Graphql Server
• Graphql Prisma Postgresql Setup
• Refactoring GraphQL Code
• Authentication with GraphQL Server
• JWT Authentication and Context in GraphQL

• Middleware
• Routing
• Request & Response Objects
• Template Engines
• REST API
• Static Files
• MongoDB Concepts
• NoSQL
• Documents
• Collections
• Schemas
• Indexes
• Aggregation
• Replica Sets

DATABASE BASICS

• What is Database
• Need of Database
• Tables
• primary key
• foreign key
• data types

NORMALIZATION IN DATABASE

• What is Normalization
• Need of Database Normalization
• 1nf
• 2nf
• 3nf
• bcnf

PHP WITH MYSQL

• mysqli vs mysqli
• Connect to database
• create database
• drop database
• select database
• create table
• insert data into table
• update data
• select data
• delete data

FILTERING DATA IN MYSQL

• where
• and
• or
• between
• in
• like
• limit
• is null

MYSQL JOINS

• mysql join
• inner join
• left join
• right join
• cross join
• self join

MYSQL GOUPING DATA

• Group By
• Having
• RollUp

MYSQL TRANSACTION

• MySql Transaction
• MySql Table Locking

MYSQL IMPORT & EXPORT

• Import CSV to MySql
• Export Mysql to CSV