Professional Full Stack Web Developer AI Integrated

@ AICT

Module 1: The Foundation (Weeks 1-3)

Goal: Build static, responsive websites.

· Web Fundamentals: How the internet works (HTTP/HTTPS, DNS, Browsers).

· HTML5 Mastery: Semantic HTML, Forms, Validations, SEO basics.

· CSS3 & Modern Styling:

o Flexbox & Grid systems (Crucial for modern layout).

o Responsive Design (Media Queries) for Mobile-First development.

o Frameworks: Tailwind CSS (Trending) and Bootstrap 5.

· Project 1: Build a Personal Portfolio Website.

Module 2: JavaScript Logic & Algorithms (Weeks 4-6)

Goal: Make websites interactive and learn programming logic.

· Core JS: Variables, Data Types, Loops, Functions.

· DOM Manipulation: Selecting elements, Event Listeners (Click, Hover, Submit).

· Modern ES6+ Features: Arrow Functions, Destructuring, Spread Operator, Template Literals.

· Asynchronous JS: Promises, Async/Await, Fetch API (Consuming JSON data).

· Project 2: Weather App (Fetching live weather data from an open API).

Module 3: Frontend Mastery with React.js (Weeks 7-10)

Goal: Build Single Page Applications (SPAs) like Facebook or Instagram.

· React Basics: JSX, Components, Props.

· Hooks: useState, useEffect (The modern way to write React).

· Routing: React Router v6 (Navigating without page reloads).

· State Management: Context API (Managing data across the app).

· Project 3: E-commerce Product Page with Cart Functionality.

Module 4: Backend Engineering (Weeks 11-13)

Goal: Create your own server and API.

· Node.js Environment: Installing Node, NPM (Node Package Manager).

· Express.js Framework: Setting up a server, Routing (GET, POST, PUT, DELETE).

· RESTful APIs: Building API endpoints to send data to the frontend.

· Middleware: Handling errors and authentication checks.

· Tools: Using Postman to test APIs.

Module 5: Database Management (Weeks 14-15)

Goal: Store and manage user data permanently.

· MongoDB (NoSQL): Cloud setup with MongoDB Atlas (Free tier).

· Mongoose ODM: Creating Schemas and Models.

· CRUD Operations: Create, Read, Update, Delete data from the database.

· Project 4: “Task Manager API” (Backend only).

Module 6: Security & Authentication (Week 16)

· Authentication: User Registration & Login logic.

· Security: Hashing passwords (Bcrypt.js) and JWT (JSON Web Tokens) for secure sessions.

Module 7: Full Stack Integration & Deployment (Weeks 17-18)

Goal: Connect Frontend + Backend and go live.

· Connecting the Dots: Fetching data from your own backend into your React Frontend.

· Deployment:

o Frontend: Vercel or Netlify.

o Backend: Render or Railway.

o Database: MongoDB Atlas.

· DevOps Basics: Git & GitHub (Commit, Push, Pull requests).

Module 8: The “New Tech” Edge (Week 19)

Differentiation: This is what most other institutes don’t teach yet.

· AI for Developers: How to use ChatGPT and GitHub Copilot to debug code and write boilerplate faster.

· Next.js Intro: A brief 2-hour introduction to Next.js (The future of React) to show students the path forward.

Final Capstone Project (Weeks 20-24)

Students must build one of the following to graduate:

1. Full E-commerce Platform: (User login, Product catalog, Cart, Checkout simulation).

2. Social Media Dashboard: (Post updates, Like posts, User profiles).

3. School Management Portal: (Student login, View marks, Download reports).

Commencement

July 02, 2026

Duration

6 Months

Course Fee

48000

Course Level

Diploma , Certificate

Location

Colombo