Module 1: Introduction to Photoshop

• Raster And Vector
• Set Image Size, Unit, Resolution & Color Mode
• Color Profile
• Photoshop Overview

Module 2: Selection

• Make Selection With Tools
• Rectangular Marquee
• Elliptical Marquee
• Single Row
• Single Column
• Lasso
• Polygonal Lasso
• Magnetic Lasso
• Quick Selection
• Magic Wand

Module 3: Crop & Select Color

• Crop Tool
• Perspective Crop
• Slice
• Slice Selection
• Eyedropper
• Color Sampler

Module 4: Image Editing Tools & Color Correction

• Spot Healing
• Healing
• Patch
• Content-Aware Move
• Red Eye
• Adjustments
• Brightness/Contrast
• Levels
• Curves
• Exposure
• Vibrance
• Hue/Saturation
• Color Balance
• Black & White
• Photo Filter
• Channel Mixer
• Color Lookup

Module 5: Brush Tools

• Brush
• Create Brush
• Upload Brush
• Use Brush Setting
• Pencil
• Color Replacement
• Mixer Brush
• Clone Stamp
• Pattern Stamp
• Eraser
• Background Eraser
• Magic Eraser
• Blur
• Sharpen
• Smudge
• Dodge
• Burn
• Sponge

Module 6: Color

• Fill Color In Selection
• Pattern
• Gradient
• Paint
• Bucket

Module 7: Create Path

• Use Pen
• Freeform Pen Tool
• Add Anchor Point
• Convert Point

Module 8: Text

• Use Horizontal & Vertical Type
• Use Horizontal & Vertical Type Mask
• Character & Paragraph Palette
• Font Size
• Font Family
• Font Style
• Leading
• Kerning
• Tracking
• Horizontal & Vertical Scale
• Baseline Shift
• Paragraph Align
• Left & Right Indent
• Before & After Paragraph Space
• Module 9: Create Shape
• Rectangle
• Rounded Rectangle
• Ellipse
• Polygon
• Line
• Custom Shape Create And  Add Shape

Module 10: Work Mask

• Clipping Mask
• Layer Mask
• Type Mask
• Vector Mask
• Quick Mask

Module 11: Layer Style

• Bevel & Emboss
• Stroke
• Inner Shadow
• Inner Glow
• Satin
• Color Overlay
• Gradient Overlay
• Pattern Overlay
• Outer Glow
• Drop Shadow

Module 12: Practice Work

• Create Banner
• Poster
• Mobile App UI
• Website UI (Responsive)
• Social Media Post

Module 13: Filter

• Filter Gallery
• Camera Raw
• Liquify
• Oil Paint
• Vanishing Point
• Blur
• Distort
• Noise
• Pixelate
• Render
• Sharpen
• Stylize

Module 14: 3D

• Create 3D Shape
• 3D Text
• 3D Custom Shape
• Apply Texture
• Use 3D Material Eyedropper 
• Use 3D Material Drop

Module 15: Use Adv. Option

• Action
• Animation
• Create GIF File

Module 16: Export File In

• .Psd
• .Jpg
• .Png
• .Gif
• .Pdf
• .Pdf

Module 1: Introduction to Bootstrap

• What is Bootstrap?

• Advantages of using Bootstrap

• Setting up Bootstrap (CDN vs. local installation)

• Bootstrap file structure

• Basic Bootstrap template

Module 2: Bootstrap Grid System & Layout

• Understanding the 12-column grid system

• Container types (container, container-fluid)

• Rows and columns (row, col-*)

• Responsive breakpoints (sm, md, lg, xl, xxl)

• Column ordering (order-*)

• Offsetting columns (offset-*)

• Nesting grids

• Gutters (spacing between columns)

Module 3: Bootstrap Utilities & Helpers

Spacing Utilities

• Margin & padding classes (m-*, p-*)

• Responsive spacing (mx-sm-*, py-md-*)

Text & Typography

• Text alignment (text-start, text-center, text-end)

• Text transformation (text-uppercase, text-lowercase)

• Font weight (fw-bold, fw-light)

• Text colors (text-primary, text-success, etc.)

Background & Colors

• Background colors (bg-primary, bg-dark, etc.)

• Gradient backgrounds (bg-gradient)

Display & Visibility

• Display properties (d-block, d-flex, d-none)

• Responsive visibility (d-md-none, d-lg-block)

Flexbox Utilities

• Flex direction (flex-row, flex-column)

• Justify content (justify-content-start, justify-content-between)

• Align items (align-items-start, align-items-center)

Borders & Shadows

• Border classes (border, border-top, border-danger)

• Border radius (rounded, rounded-circle)

• Shadows (shadow-sm, shadow-lg)

Module 4: Bootstrap Components

Buttons & Button Groups

• Button styles (btn-primary, btn-outline-secondary)

• Button sizes (btn-sm, btn-lg)

• Disabled buttons

• Button groups (btn-group, btn-toolbar)

Navbar & Navigation

• Basic navbar structure

• Navbar color schemes (navbar-dark, navbar-light)

• Responsive navbar (toggle button for mobile)

• Navs & tabs (nav-tabs, nav-pills)

Cards

• Card structure (card, card-body, card-title)

• Card images (card-img-top)

• Card groups & decks

Forms

• Form controls (form-control, form-select)

• Form validation (is-valid, is-invalid)

• Input groups (input-group, input-group-text)

• Floating labels

Alerts, Badges & Progress Bars

• Alert styles (alert-success, alert-warning)

• Dismissible alerts

• Badges (badge bg-primary)

• Progress bars (progress-bar)

Breadcrumbs, Pagination & List Groups

• Breadcrumb navigation

• Pagination (pagination, page-item)

• List groups (list-group, list-group-item)

Modals, Tooltips & Popovers

• Modal dialogs (modal, modal-dialog)

• Tooltips (data-bs-toggle="tooltip")

• Popovers (data-bs-toggle="popover")

Carousel & Dropdowns

• Image carousel (carousel, carousel-item)

• Dropdown menus (dropdown, dropdown-menu)

Module 5: Advanced Bootstrap Features

Customizing Bootstrap

• Using Sass variables to customize Bootstrap

• Theme colors & fonts

• Creating a custom build

Bootstrap Icons

• Installing Bootstrap Icons

• Using icons in buttons, navbars, etc.

Bootstrap & JavaScript

• Bootstrap’s JavaScript components

• Using data attributes (data-bs-toggle, data-bs-target)

• Modal events (show.bs.modal, hidden.bs.modal)

Module 6: Bootstrap Best Practices & Projects

• Mobile-first approach

• Accessibility considerations

• Performance optimization

• Project 1: Portfolio Website

• Project 2: E-commerce Product Page

• Project 3: Admin Dashboard

Module 1: Introduction to Web Development

• How websites work

• Client-server architecture

• Introduction to HTML, CSS, and JavaScript

• Web development tools (browsers, text editors, IDEs)

• Setting up your development environment

Module 2: HTML Fundamentals

HTML Basics

• HTML document structure (<!DOCTYPE>, <html>, <head>, <body>)

• Basic HTML tags (<h1>-<h6>, <p>, <br>, <hr>)

• HTML attributes

• Comments in HTML

Text Formatting

• Headings and paragraphs

• Text formatting tags (<strong>, <em>, <mark>, etc.)

• Special characters and symbols

Links and Images

• Anchor tags (<a>) and href attribute

• Linking to external pages, internal pages, and page sections

• Image tags (<img>) and attributes

• Image formats for the web (JPG, PNG, GIF, SVG, WebP)

• Figure and figcaption

Lists

• Ordered lists (<ol>)

• Unordered lists (<ul>)

• Definition lists (<dl>, <dt>, <dd>)

• Nested lists

Module 3: HTML Intermediate Concepts

Tables

• Table structure (<table>, <tr>, <td>, <th>)

• Table headers and footers

• Colspan and rowspan

• Styling tables with CSS

Forms

• Form element (<form>) and attributes

• Input types (text, password, email, number, etc.)

• Textarea, select, and option elements

• Radio buttons and checkboxes

• Buttons (<button>, <input type="submit">)

• Form validation

• Fieldset and legend

Semantic HTML

• Semantic vs non-semantic elements

• <header>, <footer>, <nav>, <main>

• <article>, <section>, <aside>

• <figure>, <figcaption>

• Accessibility considerations (ARIA attributes)

Module 4: CSS Fundamentals

Introduction to CSS

• Inline, internal, and external CSS

• CSS syntax (selectors, properties, values)

• CSS comments

• The cascade and specificity

CSS Selectors

• Element selectors

• Class and ID selectors

• Attribute selectors

• Pseudo-classes and pseudo-elements

• Combinators (descendant, child, adjacent sibling, general sibling)

Colors and Backgrounds

• Color values (keywords, HEX, RGB, RGBA, HSL, HSLA)

• Background properties (color, image, repeat, position, size)

• Opacity vs RGBA/HSLA transparency

• Gradients (linear and radial)

Text Styling

• Font properties (family, size, weight, style)

• Text properties (alignment, decoration, transformation)

• Line height and letter spacing

• Text shadows

• Web fonts (@font-face, Google Fonts)

Module 5: CSS Box Model and Layout

Box Model

• Understanding margin, border, padding, content

• Box-sizing property

• Margin collapse

• Display property (block, inline, inline-block)

Positioning

• Static, relative, absolute, fixed, sticky positioning

• Z-index and stacking context

• Float and clear

• Overflow property

Flexbox

• Flex container and items

• Main axis and cross axis

• Flex-direction, justify-content, align-items

• Flex-wrap, align-content

• Flex-grow, flex-shrink, flex-basis

CSS Grid

• Grid container and items

• Grid template columns and rows

• Grid gap

• Grid line placement

• Grid areas

• Responsive grid patterns

Module 6: Responsive Design

• Mobile-first approach

• Viewport meta tag

• Media queries (min-width, max-width)

• Responsive units (rem, em, vh, vw, %)

• Responsive images (srcset, sizes)

• Common responsive patterns (fluid layout, column drop, etc.)

• CSS frameworks overview (Bootstrap, Tailwind, etc.)

Module 7: Transitions, Animations, and Transforms

• CSS transitions (property, duration, timing function, delay)

• CSS transforms (translate, rotate, scale, skew)

• CSS animations (@keyframes, animation properties)

• Performance considerations

Module 8: Advanced CSS Topics

• CSS variables (custom properties)

• CSS preprocessors (SASS/SCSS overview)

• BEM methodology

• CSS architecture

• Browser prefixes and feature detection

• CSS methodologies (OOCSS, SMACSS, ITCSS)

Module 9: Project Work

• Building a complete website from scratch

• Portfolio website project

• E-commerce product page

• Blog layout

• Dashboard UI

Module 10: Deployment and Best Practices

• Code organization and file structure

• Performance optimization

• Cross-browser compatibility

• Basic SEO for HTML

Module 1: Introduction to React

Fundamentals

• What is React? (Library vs Framework)

• React's Virtual DOM concept

• JSX syntax and rules

• Setting up React environment:

  • Create React App (CRA)

  • Vite setup

  • Next.js overview

First React Application

• Folder structure of React project

• Functional vs Class components

• Basic component creation

• Props introduction

Module 2: Core React Concepts

Components Deep Dive

• Component composition

• Props drilling

• Children prop

• PropTypes

• Default props

• Fragments (<></> syntax)

State Management

• useState hook

• State lifting

• Controlled vs uncontrolled components

• Class component state (setState)

Module 3: React Hooks

Essential Hooks

• useEffect (side effects)

• useReducer

• useContext

• useRef

• useMemo

• useCallback

Custom Hooks

• Building reusable hooks

• useFetch example

• useLocalStorage

• useForm handling

Module 4: React Router

• Setting up React Router

• Route configuration

• Dynamic routing

• Nested routes

• Protected routes

• useNavigate hook

• useParams hook

• Lazy loading routes

Module 5: Advanced React Patterns

Performance Optimization

• React.memo

• useMemo/useCallback patterns

• Code splitting

• React.lazy

• Suspense

• Error boundaries

Advanced Patterns

• Render props

• Higher-Order Components (HOCs)

• Compound components

• Context API patterns

• Prop getters

Module 6: State Management

Context API

• Creating contexts

• useContext hook

• Performance considerations

Redux Toolkit

• Redux fundamentals

• RTK Query

• Slices

• Middleware

• Persisting state

Alternative State Managers

• Zustand

• Jotai

• Recoil

• MobX comparison

Module 7: Styling in React

• CSS Modules

• Styled Components

• Emotion

• Tailwind CSS integration

• CSS-in-JS patterns

• Theming solutions

Module 8: Forms in React

• Controlled forms

• Form validation

• Formik library

• React Hook Form

• Yup validation

• Form submission patterns

Module 9: Testing React Apps

• Jest fundamentals

• React Testing Library

• Testing components

• Testing hooks

• Mocking API calls

• Snapshot testing

• E2E testing with Cypress

Module 10: React Ecosystem

Server-Side Rendering

• Next.js fundamentals

• getStaticProps/getServerSideProps

• Static Site Generation

TypeScript with React

• Typing props

• Typing hooks

• Typing events

• Generic components

React Native Basics

• Core concepts

• Differences from React web

• Expo overview

Module 11: Advanced Topics

• WebSockets with React

• Web Workers

• Progressive Web Apps

• Performance profiling

• React 18 features:

  • Concurrent rendering

  • Transitions

  • Suspense for data fetching

Module 12: Real-World Projects

1. E-commerce Site

   • Product listing

   • Shopping cart

   • Checkout flow

2. Social Media Dashboard

   • Infinite scrolling

   • Real-time updates

   • Authentication

3. Task Management App

   • Drag and drop

   • Local storage

   • Offline capability

4. Portfolio Website

   • Animations

   • Theme switching

   • Contact form

Module 1: Introduction to jQuery

• What is jQuery?

• Why use jQuery? (Advantages & Use Cases)

• jQuery vs. Vanilla JavaScript vs. Modern Frameworks

• Setting Up jQuery (CDN, Local Installation, npm)

• Basic Syntax ($(selector).action())

• Document Ready ($(document).ready() vs. $(function() {}))

Module 2: jQuery Selectors & DOM Manipulation

Selectors

• Basic Selectors ($("p"), $(".class"), $("#id"))

• Attribute Selectors ($("[href]"), $("[type='text']"))

• Hierarchy Selectors ($("parent > child"), $("ancestor descendant"))

• Filtering Selectors (:first, :last, :even, :odd, :not())

DOM Manipulation

• Getting & Setting Content (.text(), .html(), .val())

• Changing Attributes (.attr(), .removeAttr())

• CSS Manipulation (.css(), .addClass(), .removeClass(), .toggleClass())

• DOM Insertion (.append(), .prepend(), .after(), .before())

• Removing Elements (.remove(), .empty())

• Cloning Elements (.clone())

Module 3: jQuery Events

Event Handling

• Click Events (.click())

• Form Events (.submit(), .change(), .focus(), .blur())

• Keyboard Events (.keypress(), .keydown(), .keyup())

• Mouse Events (.hover(), .mouseenter(), .mouseleave())

Event Delegation

• .on() vs .click() (Dynamic Elements)

• Event Bubbling & Prevention (.stopPropagation(), .preventDefault())

Module 4: jQuery Effects & Animations

Basic Effects

• Showing/Hiding Elements (.show(), .hide(), .toggle())

• Fading Effects (.fadeIn(), .fadeOut(), .fadeToggle(), .fadeTo())

• Sliding Effects (.slideDown(), .slideUp(), .slideToggle())

Custom Animations

• .animate() (Custom CSS Animations)

• Animation Queues (.queue(), .dequeue(), .clearQueue())

• Stopping Animations (.stop(), .finish())

Module 5: jQuery AJAX & APIs

AJAX Basics

• $.ajax() (GET, POST, PUT, DELETE)

• Shorthand Methods ($.get(), $.post(), $.getJSON())

• Handling Responses (.done(), .fail(), .always())

Working with APIs

• Fetching Data from REST APIs

• Dynamic Content Loading

• Error Handling in AJAX

Module 6: jQuery UI (User Interface)

Widgets & Interactions

• Accordion ($("#accordion").accordion())

• Datepicker ($("#datepicker").datepicker())

• Draggable, Droppable, Sortable

• Autocomplete ($("#tags").autocomplete())

Effects & Themes

• jQuery UI Effects (.effect(), .addClass("animated"))

• Theme Customization (ThemeRoller)

Module 7: Advanced jQuery

Performance Optimization

• Selector Optimization

• Event Delegation Best Practices

• Minimizing DOM Manipulation

Plugins & Extensions

• Using Popular jQuery Plugins (Slick, DataTables, Lightbox)

• Writing Custom Plugins

Module 8: jQuery Best Practices & Modern Alternatives

• When to Use jQuery vs. Vanilla JS

• Migrating to Modern Frameworks (React, Vue)

• Security Best Practices

Projects & Exercises

1. Interactive To-Do List (AJAX + DOM Manipulation)

2. Image Slider (Animations + Event Handling)

3. Form Validation (jQuery + AJAX)

4. Weather App (API Fetching with jQuery)

Module 1: Introduction to JavaScript

• What is JavaScript?

• JavaScript vs. ECMAScript

• Setting up the development environment (Browser Console, Node.js, VS Code)

• Writing your first JavaScript program (console.log())

• Linking JavaScript to HTML (<script> tag)

Module 2: JavaScript Fundamentals

Variables & Data Types

• var, let, and const

• Primitive data types (string, number, boolean, null, undefined, symbol, BigInt)

• Dynamic typing & type coercion

Operators

• Arithmetic (+, -, *, /, %, **)

• Assignment (=, +=, -=)

• Comparison (==, ===, !=, !==, >, <)

• Logical (&&, ||, !)

• Ternary operator (? :)

Control Flow

• Conditional statements (if, else if, else)

• Switch statements

• Truthy & falsy values

Loops

• for loop

• while & do...while loops

• break & continue

• for...of & for...in loops

Module 3: Functions & Scope

• Function declarations vs. expressions

• Arrow functions (() => {})

• Parameters & arguments

• Default parameters

• Rest parameters (...args)

• Return statements

• Scope (global, function, block)

• Closures

• Immediately Invoked Function Expressions (IIFE)

Module 4: Arrays & Objects

Arrays

• Creating arrays

• Accessing & modifying elements

• Array methods (push, pop, shift, unshift, slice, splice)

• Iteration methods (forEach, map, filter, reduce, find, some, every)

• Spread operator (...)

Objects

• Object literals

• Accessing properties (dot notation vs. bracket notation)

• Object methods

• this keyword

• Object destructuring

• Optional chaining (?.)

Module 5: DOM Manipulation & Events

• What is the DOM?

• Selecting elements (getElementById, querySelector, querySelectorAll)

• Modifying elements (textContent, innerHTML, style)

• Creating & removing elements (createElement, appendChild, remove)

• Event listeners (addEventListener)

• Common events (click, submit, keydown, mouseover)

• Event propagation (bubbling & capturing)

• Event delegation

Module 6: Asynchronous JavaScript

• Callbacks & callback hell

• Promises (then, catch, finally)

• async/await

• Fetch API (GET, POST, PUT, DELETE)

• Error handling (try/catch)

• AJAX & XMLHttpRequest (legacy)

Module 7: Modern JavaScript (ES6+ Features)

• Template literals (`Hello ${name}`)

• Destructuring arrays & objects

• Default parameters

• Rest & spread operators

• Modules (import/export)

• Classes (class, constructor, extends, super)

• Map & Set

• Symbols & Iterators

Module 8: Advanced JavaScript Concepts

• Prototypes & Prototypal Inheritance

• call, apply, bind

• Hoisting

• Event Loop & Concurrency

• Web Storage (localStorage, sessionStorage)

• Web Workers (Multithreading)

• Debouncing & Throttling

Module 9: JavaScript in the Browser

• Browser APIs (setTimeout, setInterval)

• window & document objects

• Form handling & validation

• Working with cookies

• Canvas & SVG basics

Module 10: Testing & Debugging

• console methods (log, warn, error, table)

• Debugging with Chrome DevTools

• Unit testing (Jest, Mocha)

• Error handling strategies

Module 11: JavaScript Frameworks & Libraries (Overview)

• Introduction to React, Vue, Angular

• Node.js & Express (Backend JavaScript)

• npm & package management

Module 12: Projects & Best Practices

• Project 1: To-Do List App

• Project 2: Weather App (API Fetching)

• Project 3: Quiz Game

• Project 4: E-commerce Cart System

• Code organization & best practices

• Performance optimization