Introducing Bootstrap and Setting Up the Project Bootstrap – Color, Margin, Padding, Background, Border Bootstrap – Display, Text-Color, Flex, Opacity, Overflow Bootstrap – Position, Shadow, Rounded Bootstrap – Sizing, Spacing, Vertical-Align, Visibility, and Introducing Components Bootstrap – Accordion, Alerts, Badge, Breadcrumb Bootstrap – Buttons, Button-Group, Card Bootstrap – Carousel, Close Button, Collapse Bootstrap – Dropdown, List Group, Modal Bootstrap – Navbar, OffCanvas, Pagination Bootstrap – Placeholders, Popover, Progress, Scrollspy, Spinner, Toast, Tooltip Bootstrap – Image-Responsive, Thumbnail, Table, Typography, Responsive Layout Bootstrap e-commerce Website Project Setup, Navbar Design, and GitHub link Carousel Slider Design and GitHub Hosting Product Category Section Design, Gutter, and Push to GitHub Popular Product Section Design Pagination and Footer Section, Entities, Project Deploy GitHub and Netlify Introduction with the Tailwind, Connect with HTML File and Testing, Tont Size Margin, Padding, Space Between, Container, Width Min Width, Max Width, Height, Min-Max height List-Style, List-Style-Position, Text-Align, Text-Color Vertical-Align, Word Break, Background-Attachment Background-Image-Gradient, Gradient-Color-Stop Box-shadow, Hover, Box Shadow Color, Opacity Transform: Scale, Rotate, Translate Cursor, Caret Color, User select, flex, Grid and Responsive Design Sense Project Planning, How to Set a Project and Connect with GitHub Header Part Done, Text Gradient, Button Gradient Why Choose us Section Done with Responsive Top Selling Product Part Design Top Selling Product Final Part Popular Product Design Done with Responsive and Upload to GitHub Our Policy Section Done with Responsive Footer Section Done and Code Upload to GitHub, Project Deploy in GitHub and Netlify

Getting Started with React, What is Component React Installation, folder Structuring, and Basic Edit, What is the State Create react app, JSX, JavaScript Emmet, Dynamic Content, Dynamic Style In React Create Component, Return Html From A Component Pass Dynamic Data To Components, Props In React Create Multiple Components From an Array and Array of Objects State, Component State Hook And Set State Method Using Use State Load Dynamic Data, API Call Use Effect Integrate State React Extension Pack, Code Snippet, Folder Structure, Create new Component and Import Load Countries from API Using Use State and Use Effect Pass Data to Child Components Using Props, Unique key for Mapping Components Pass Multiple Data to a Child Component, Props and Destructuring Responsive Design, Build React App and Project host in Netlify What is JSX and Bable Transpiler Components, React Unidirectional Data Flow How Use State and Use Effect Work Stateful Component, Stateless Component or Presentational Component Hook, React Component Lifecycle and re-render, Defaults Import-Export JSON generator, Create and Load Fake Data Intro to Array Reduce React Install, title, Favicon, Header Component Design and Logo Import, JSON File Intro Header Part is Done, Menu Styling, Banner Component Creation Banner Component Design, Image Hosting and Live link, Grid Shop Component Creation and React F.ont-Awesome Font Awesome Component Styling, Child Component Creation Product Component UI Design All Products load from JSON file, UI Design and Bug Fixing Add to Cart Component Design Product Summary, Total Amount Count, Selected Product Show, UI Styling Project Code Build and Upload to GitHub, project Deploy to Netlify, and Live Site Creation Product Search System Rating Dynamic by React Rating, Project Upload and Deploy

Install React Bootstrap in Your React Application, Exploring React-Bootstrap News API Load with React-Bootstrap React router 6 Installation and Dynamic Component load by Routers Default Page load, Link, not Found Page load Conditional Rendering, Spinner, Active Class by nav link React-Router, isActive Class Dynamic Router Part-1 Dynamic Router Part-2 React Component Children, Multiple Components Creation with Relation Props Drilling, React Context API Part-1 Context API Part -2, Create Context and Use Context React Tailwind CSS Installation, Exploring Tailwind and Confidence Grow up

Full Stack Web Development (MERN)

প্রফেশনাল ওয়েব ডেভেলপমেন্ট স্কিল অর্জন করুন MERN স্ট্যাকের মাধ্যমে!

আপনি যদি একজন পরিপূর্ণ ওয়েব ডেভেলপার হতে চান তাহলে এই কোর্সটি আপনার জন্য। এই কোর্সটি আপনাকে আধুনিক ওয়েব ডেভেলপমেন্টের জন্য প্রয়োজনীয় দক্ষতা অর্জনে সাহায্য করবে। এই কোর্সে আপনি শুরু থেকে ওয়েবসাইট তৈরির বিভিন্ন ধাপ শিখবেন, যা একটি দক্ষ ডেভেলপার হওয়ার পথে আপনার আত্মবিশ্বাস বাড়াবে। এই কোর্সটি শুরু করার জন্য আপনার আগে থেকে কোন কিছু জানা লাগবে না। শুধুমাত্র ইন্টারনেট কানেকশান আর একটি ল্যাপটপ থাকলেই আপনি শুরু করে দিতে পারেন আপনার ফুলস্টাক ওয়েব ডেভেলপার হওয়ার জার্নি।

এই কোর্সটি কেন করবেন?

এই কোর্স সম্পন্ন করার পর, আপনি কি কি দক্ষতা অর্জন করবেন

কোর্স আউটলাইন

Become Proficient in HTML

Environment Setup
VS Code Extension, HTML Structure, Head, Body, Meta Tag
First Website, HTML Attributes, HTML-Tag ( p, h1-h6, a )
VS Code Extension, HTML Tag – B, Bold, Strong, i, Em, Br, Sub, Sup
HTML Tag – Online Image, Local Image and folder Image Load on Website, Alt
HTML Tag – List, Ordered list, Unordered List, List-Types, Iframe, Comments
HTML Tag – Button, Input Types, Div, Small
HTML Tag – Table, Border, Audio, Video, Autoplay
HTML Tag – Title, Tooltip, Abbr, Html Attributes vs html Tags vs html Elements, Eemantic Elements
HTML Tag – Label, Select Option, Text Area, Value, Description List, with Terms and Descriptions, Span

Become Proficient in CSS

Introducing CSS (syntax), Internal CSS, Inline CSS
Compare 3 Types of CSS, Apply CSS Class and Id, Background-Color
CSS Comments, Height, Width, Background-Image, Repeat, Size
Vertical-height, Font-size, Position, Linear-Gradient, Radial-Gradient, Border
Border (Color, Width, Radius, Image), Introducing Margin, Padding, Outline, Image Round
Font Awesome, Position – Absolute
Fixed, Sticky-Top, Relative, National Flag Project , Display —• Inline, Inline-Block, Block
Overflow ( visible, hidden, scroll ), Pseudo-Class ( Hover, Active, Visited), Box-Sizing
CSS Media Query, CSS Measuring Unit
Display-None vs Visibility Hidden, CSS Animation
Transform , CSS Animation Library (Animate CSS)
More Flex, CSS Grid
CSS Media-Query, CSS Measuring Unit (px, in, cen, em, rem, vh, vw, % )
Web1 Project ( Part-1 )
Web1 Project ( Part-2 )
Web1 Project ( Part-3 ) and Upload Code to GitHub

CSS Framework

Introducing Bootstrap and Setting Up the Project
Bootstrap – Color, Margin, Padding, Background, Border
Bootstrap – Display, Text-Color, Flex, Opacity, Overflow
Bootstrap – Position, Shadow, Rounded
Bootstrap – Sizing, Spacing, Vertical-Align, Visibility, and Introducing Components
Bootstrap – Accordion, Alerts, Badge, Breadcrumb
Bootstrap – Buttons, Button-Group, Card
Bootstrap – Carousel, Close Button, Collapse
Bootstrap – Dropdown, List Group, Modal
Bootstrap – Navbar, OffCanvas, Pagination
Bootstrap – Placeholders, Popover, Progress, Scrollspy, Spinner, Toast, Tooltip
Bootstrap – Image-Responsive, Thumbnail, Table, Typography, Responsive Layout
Bootstrap e-commerce Website Project Setup, Navbar Design, and GitHub link
Carousel Slider Design and GitHub Hosting
Product Category Section Design, Gutter, and Push to GitHub
Popular Product Section Design
Pagination and Footer Section, Entities, Project Deploy GitHub and Netlify
Introduction with the Tailwind, Connect with HTML File and Testing, Tont Size
Margin, Padding, Space Between, Container, Width
Min Width, Max Width, Height, Min-Max height
List-Style, List-Style-Position, Text-Align, Text-Color
Vertical-Align, Word Break, Background-Attachment
Background-Image-Gradient, Gradient-Color-Stop
Box-shadow, Hover, Box Shadow Color, Opacity
Transform: Scale, Rotate, Translate
Cursor, Caret Color, User select, flex, Grid and Responsive Design Sense
Project Planning, How to Set a Project and Connect with GitHub
Header Part Done, Text Gradient, Button Gradient
Why Choose us Section Done with Responsive
Top Selling Product Part Design
Top Selling Product Final Part
Popular Product Design Done with Responsive and Upload to GitHub
Our Policy Section Done with Responsive
Footer Section Done and Code Upload to GitHub, Project Deploy in GitHub and Netlify

Become proficient in JavaScript as a Beginner

Introduction JS and Variable
JS Variable, Naming Convention, Data Types
JavaScript Data Types Examples
JavaScript Type Conversions, Comment
JS Operators Introduction (Arithmetic, Assignment, Comparison, Logical )
JS Condition (if, else if, else)
JS Statement, Math Function, String Function
JS Switch Case Statements Break, Default
Ternary Operator, Difference Among ( =, ==)
Declare Array, Array Length, and Array Index
Index of, Not in Array Check, Get and Set by Index Number
While Loop, Do while Loop, for Loop, odd Numbers, and Even Numbers
Array Traversing with for loop and Conditions
Truthy Value and Falsy Value in Javascript
Function Declaration, Function Call, and Function Return
Function Parameter and Arguments
Unit Conversion Inch to Feet, Miles to Kilometer Normal and BMI Calculation by Function
Even and odd Number Checking by Function, Checking Leap-year or not by Function
Introduction with Object, Multiple Objects with Multiple Parameters
Break and Continue in Loop, Swapping and Distracting
Sum of Array Values Normal Process and Functional Process
String Comparison to Uppercase and to Lowercase
Convert string to Array by a Split, Array to String by Join, Slice
Array Slice, Splice, Array sort, more than 2 Decimal Number Array Sorting, Array Reverse
Unlimited Parameters to a Function Using Arguments

Integrated JavaScript and JavaScript DOM ( Document Object Model )

What is DOM, Internal and External JavaScript, HTML Elements
Explore Get Element by Tag Name and ld.
QuerySelector, QuerySelectorAll, DOM Tree
Get Attribute, Set Attribute, Styling by JavaScript
InnerHTML, InnerText, Create HTML Elements using JavaScript and AppendChild, CIassList. Add
What is an Event, Different Types of Events on the web, Add on Click Handler Directly or via JavaScript
Different Ways to Use Add Event Listener on a Button, Most Common Ways to Set Event Handlers
Comment Box Simple DOM Project
Key events, Change, Blur event, Confirm to Delete Button DOM Project
Event bubble , Stop Propagating and Stop Immediate Propagation
DOM Projects- Login page Design by Tailwind and Code Upload to GitHub
Login Page Design by Tailwind and Username and Password Testing by DOM
Simple Authentication, page Redirect, Tailwind Grid
Home Page Design by Tailwind with Responsive
Deposit Part is Done by DOM
Deposit and Total Balance Section Done by DOM
Withdraw and Total Balance Done and Simple Assignment
Website Bug Fixing, Project Upload to GitHub and Live Website Hosting

Intermediate JavaScript and REST API

Recap SIX core Parts of JavaScript(Variable, Condition, Loop, Array, function, Object
Let’s Start with ES6
Function Declaration and Function Expression
Spread Operator, Array Max, copy Array
Destructuring Object and Array and Extracts Values to Variable and Optional Chaining
Array Map and Output in Single Line, Filter, Find and Findlndex in JavaScript
Getting Started with API, JSON Structure, JSON Parse, JSON Stringify
JSON Placeholder, Get Data and Display Data on the Console
JSON Placeholder more Data load and send Data by Function
Dynamically load Data from API and Display on the Website
Load JSON Placeholder Post and Dynamically load on Website with Styling
Get, Post, Patch(Update), Delete, Crud, Get vs Post, Debug API
Kanye rest API Load Data on UI by Arrow Function
Display Random User Data and Handle Nested API Data ( part-1 )
Display Random User Data and Handle Nested API Data ( part-2 )
Load All Countries Information from API Dynamically with Details
Create Dynamic URL and Display Data, add Spinner meal DB API
JavaScript Object keys, Values, Entries, Delete, seal, Freeze, Difference between Seal and Freeze
JavaScript Object Method, this Property, for of and for in loop

Browser and Debugging

How the Internet Works, How Browser Work, DOM Tree, Render Tree, V8 Engine
Set Timeout Simple Asynchronous JS Using, Fetch as an Asynchronous Activity
BOM, Browser Alert, Confirm, Prompt with examples
Browser Location API, URL parts, Query-String

React Core Concepts

Getting Started with React, What is Component
React Installation, folder Structuring, and Basic Edit, What is the State
Create react app, JSX, JavaScript Emmet, Dynamic Content, Dynamic Style In React
Create Component, Return Html From A Component
Pass Dynamic Data To Components, Props In React
Create Multiple Components From an Array and Array of Objects
State, Component State Hook And Set State Method Using Use State
Load Dynamic Data, API Call Use Effect Integrate State
React Extension Pack, Code Snippet, Folder Structure, Create new Component and Import
Load Countries from API Using Use State and Use Effect
Pass Data to Child Components Using Props, Unique key for Mapping Components
Pass Multiple Data to a Child Component, Props and Destructuring
Responsive Design, Build React App and Project host in Netlify
What is JSX and Bable Transpiler
Components, React Unidirectional Data Flow
How Use State and Use Effect Work
Stateful Component, Stateless Component or Presentational Component
Hook, React Component Lifecycle and re-render, Defaults Import-Export
JSON generator, Create and Load Fake Data
Intro to Array Reduce
React Install, title, Favicon, Header Component Design and Logo Import, JSON File Intro
Header Part is Done, Menu Styling, Banner Component Creation
Banner Component Design, Image Hosting and Live link, Grid
Shop Component Creation and React F.ont-Awesome
Font Awesome Component Styling, Child Component Creation
Product Component UI Design
All Products load from JSON file, UI Design and Bug Fixing
Add to Cart Component Design
Product Summary, Total Amount Count, Selected Product Show, UI Styling
Project Code Build and Upload to GitHub, project Deploy to Netlify, and Live Site Creation
Product Search System
Rating Dynamic by React Rating, Project Upload and Deploy

Intermediate React

Install React Bootstrap in Your React Application, Exploring React-Bootstrap
News API Load with React-Bootstrap
React router 6 Installation and Dynamic Component load by Routers
Default Page load, Link, not Found Page load
Conditional Rendering, Spinner, Active Class by nav link React-Router, isActive Class
Dynamic Router Part-1
Dynamic Router Part-2
React Component Children, Multiple Components Creation with Relation
Props Drilling, React Context API Part-1
Context API Part -2, Create Context and Use Context
React Tailwind CSS Installation, Exploring Tailwind and Confidence Grow up

Firebase Authentication

Initial Setup, Firebase Apps run, File Configuration
Final Configuration with Firebase and Users info Console log
Recap React authentication and sign in with popup and User Info console log
Login User Data Show on UI and Conditional Rendering
GitHub o-auth Connection with Firebase and Image add to Button
Sign ln with GitHub by Firebase Authentication and User data Display in UI
Small Tasks and Small Motivation
Components Design and Link by React Router DOM
Create a Custom hook and Folder Structuring for Firebase
Data load from Custom hook, Data Manage from Multiple Components Using Context API
Private Route and Navigate
Private Route and Navigate Using Nested Route

Backend Integration (NodeJS, MongoDB)

Introduction of NodeJS and npm in It
First Express Data Creation and Data Load and Console Log
Nodemon, Users Route and Data Sort by Id, Create the First API
Dynamic API with Query Parameter and Filtering
Load Data From Our API and Shown on UI, Cors, Gitignore
MongoDB, Connect the Application with MongoDB
MongoDB, Connect the Application with MongoDB
Insert Multiple Documents into the MongoDB Database
Receive Data from Input Field Using Use Ref. hook and POST API Create
Data Send to Database from UI and Express JSON Middleware
Get API and Data Load from Database to UI
Delete API, Data Delete from the Database and Instantly Preview to UI
Single User View by GET API and Preloader
Controlled and Uncontrolled from, Value Props Warning Solved
Update Data by PUT API and Shown in UI, Database Data Update, Upsert
Image Upload to Database and Image Hosting
Dotenv, Username, Password Secure and CRUD Server Upload to GitHub
Server Upload to Heroku Cloud and live Website Hosting

প্রফেশনালদের ডিমান্ড

স্কিলস গ্যাপ

ইন্ডাস্ট্রি এডপশন

রেপিড জব গ্রোথ

ক্যারিয়ার ইমপেক্ট

কোর্স মূল্য

Original price was: ৳ 3,000.Current price is: ৳ 499.

ডেলিভারি মেথডঃ সেলফ-পেসড
লেভেলঃ বিগিনার
সময়কালঃ ৫২.৭১ ঘন্টা
লেকচারঃ ১৯৯টি ক্লাস
প্রফেসনাল সার্টিফিকেট
ভাষাঃ বাংলা
ক্যাটাগরিঃ Professional Certificate, Software Development, Web Design & Development

এই কোর্সে আপনি যা যা পাবেন

এই কোর্সটি যাদের জন্য

এই কোর্স করতে কি কি লাগবে

লার্নারস কোর্স করে কি বলছেন

মেহেদী হাসান শাকিল

ফ্রিল্যান্স অ্যাকাউন্টিং এক্সপার্ট

অগণিত চ্যালেঞ্জের মধ্য দিয়েও, আমি আমার সংকল্পে অবিচল এবং অটল থেকেছি। শেষ পর্যন্ত আমি সফল হয়েছি। এই কঠিন জার্নিতে CodersTrust-এর অমূল্য সাপোর্ট এবং গাইডেন্সের জন্য আমি তাদেরকে আন্তরিক কৃতজ্ঞতা জানাই।

আয়শা আক্তার বিপাশা

ফ্রিল্যান্সার - ডিজাইনার

একজন সফল ফ্রিল্যান্সার হতে প্রয়োজনীয় স্কিল ও প্রশিক্ষণ প্রদান করার জন্য CodersTrust-এর প্রতি আমি আন্তরিকভাবে কৃতজ্ঞ। তাদের নির্দেশনা আমাকে এই ইন্ডিপেন্ডেন্ট ওয়ার্ক স্টাইলে দক্ষতা অর্জনে সাহায্য করেছে।

আরফিয়াস ইসলাম রুদ্র

ডিজিটাল মার্কেটার

এই দ্রুত পরিবর্তনশীল ইন্ডাস্ট্রি-তে সফল হতে প্রয়োজনীয় দক্ষতা অর্জনে তাদের ডেডিকেশন সত্যিই প্রশংসনীয়। ডিজিটাল মার্কেটিংয়ে সফল হতে যারা আগ্রহী, তাদের জন্য CodersTrust-কে আমি হাইলি রেকমেন্ড করি।

আসরাফুল আলম সানি

ফ্রিল্যান্সার

আমি আনন্দিত যে আমি Fiverr লেভেল ওয়ান সেলার র‍্যাঙ্ক অর্জন করেছি! CodersTrust-এর দেওয়া সুযোগ এবং সাহায্যের জন্য আমি তাদের কাছে আজীবন কৃতজ্ঞ থাকব।

মাইশা কে. দিয়া

অ্যাকাউন্টিং এক্সপার্ট

আলহামদুলিল্লাহ, আমি একটি রিমোট বুককিপিং চাকরি পেয়েছি! HSC সম্পন্ন করার পর পরই, UK কোম্পানিতে মান্থলি স্যালারি বেজড জব পাই। ডিজিটাল অ্যাকাউন্টিং কোর্স শেষ করার পর মাত্র দুই মাসেই জব পাওয়াটা আমার জন্য বিশাল অর্জন, যা CodersTrust-এর মেন্টরশিপের কারণে সম্ভব হয়েছে।

জারিন তুসনিম শিফা

গ্রাফিকস ডিজাইনার

অবশেষে, আমি আমার জীবনের একটি গুরুত্বপূর্ণ মাইলফলক অর্জন করেছি: সফলভাবে প্রথম ফ্রিল্যান্সিং কাজ সম্পন্ন করা। আমার ট্রেনিং জার্নি এবং পরবর্তীতে সময়েও সাপোর্ট করার জন্য, CodersTrust এবং এর ইন্সট্রাকটরদের প্রতি আমি অনেক কৃতজ্ঞ। তাদের গাইডেন্স এবং সহযোগিতা আমার এই সাফল্যের পেছনে মূল ভূমিকা রেখেছে, এবং আমি সত্যিই তাদের কাছে ঋণী।

মোস্তফা জাবেদ

কনটেন্ট রাইটার

আমি শেয়ার করতে পেরে খুবই আনন্দিত যে, আমি আমার প্রথম ব্লগটি একজন আপওয়ার্ক (Upwork) ক্লায়েন্টের কাছে $200-এ বিক্রি করতে সফল হয়েছি, যা আমি কোর্সের সময় ধরে রিফাইন করছিলাম। CodersTrust-এর ট্রেনিং এবং সাপোর্ট আমার ফ্রিল্যান্সিং জার্নির এই অসাধারণ মাইলফলকের পথ তৈরি করেছে। তাই, আমি তাদের প্রতি আন্তরিক কৃতজ্ঞতা প্রকাশ করছি।

আদ্রিয়ান আফরাহাম

কেডিপি স্পেশালিস্ট

আমি খুবই খুশি যে CodersTrust Bangladesh-এ গ্রাফিক ডিজাইনি কোর্স সম্পন্ন করতে পেরেছি। এই অপরচুনিটির জন্য আমি মহান আল্লাহর কাছে সীমাহীন কৃতজ্ঞ। কোর্স শেষ করার পরপরই, আমি সফলভাবে আমার প্রথম ফ্রিল্যান্স কাজটি পেয়েছি, যা পরে একটি আকর্ষণীয় চাকরির অফারে রূপান্তরিত হয়েছে।

Full Stack Web Development (MERN)

প্রফেশনাল ওয়েব ডেভেলপমেন্ট স্কিল অর্জন করুন MERN স্ট্যাকের মাধ্যমে!

এই কোর্সটি কেন করবেন?

এই কোর্স সম্পন্ন করার পর, আপনি কি কি দক্ষতা অর্জন করবেন

কোর্স আউটলাইন

প্রফেশনালদের ডিমান্ড

স্কিলস গ্যাপ

ইন্ডাস্ট্রি এডপশন

রেপিড জব গ্রোথ

ক্যারিয়ার ইমপেক্ট

কোর্স মূল্য

এই কোর্সে আপনি যা যা পাবেন

এই কোর্সটি যাদের জন্য

এই কোর্স করতে কি কি লাগবে

লার্নারস কোর্স করে কি বলছেন

Certified Cybersecurity Professional – Advance (Live Online Course)

Complete IELTS Preparation (Live Online Course)

Mastering AI with Prompt Engineering (Live Online)

App Development with Lovable & Cursor AI (Live Online Course)

Cybersecurity Career Accelerator – Fundamental (Live Online Course)

Responsive Web Design by Samira Kabir

Advanced Persuasion and Negotiation Skills

Designing Books with Graphics Tab

Export Expert: A Global Market to Develop

আমাদের ক্যাম্পাসসমূহ

ইমেইল

প্রফেশনাল ওয়েব ডেভেলপমেন্ট স্কিল অর্জন করুন MERN স্ট্যাকের মাধ্যমে!

এই কোর্সটি কেন করবেন?

এই কোর্স সম্পন্ন করার পর, আপনি কি কি দক্ষতা অর্জন করবেন

কোর্স আউটলাইন

প্রফেশনালদের ডিমান্ড

স্কিলস গ্যাপ

ইন্ডাস্ট্রি এডপশন

রেপিড জব গ্রোথ

ক্যারিয়ার ইমপেক্ট

কোর্স মূল্য

এই কোর্সে আপনি যা যা পাবেন

এই কোর্সটি যাদের জন্য

এই কোর্স করতে কি কি লাগবে

লার্নারস কোর্স করে কি বলছেন

আরও অন্যান্য কোর্স সমূহ