← Home
Day 3 Live
Web Fundamentals & AI Tools 📝 Task

KEC Workshop · Day 3

Web Fundamentals
& AI-Powered Tools

Explore how the web works and how AI coding assistants like Antigravity are changing the way developers build, design, and deploy websites.

📚 Today's Topics — Click Open to explore

🌐
Developer Mindset & Web Basics
How the internet works, client-server model, HTTP vs HTTPS, request & response lifecycle, DevTools & developer mindset.
HTTP Client-Server DevTools Mindset
🖥️
What is a Website?
Components, types, how browsers work, static vs dynamic, and website categories.
HTML CSS JavaScript Hosting
🎨
UI/UX & Modern Layout Skills
UI vs UX, responsive design, Flexbox, CSS Grid, mobile-first, accessibility basics & component thinking.
UI/UX Flexbox Grid Responsive
🤖
Antigravity — AI Code Editor
Download, use Antigravity to build portfolios, edit templates, and deploy to Netlify & Render.
AI Portfolio Netlify Deploy
🧰
Developer Tools Reference
21 essential tools across 14 categories — Postman, Git, Figma, VS Code, Chrome DevTools, Netlify, Burp Suite, Wappalyzer & more with direct links.
Postman VS Code Figma DevTools
🌐
Project 1 — AI Portfolio Website
Build a personal portfolio using HTML, CSS & JS with AI prompts. Covers both building from scratch and using free templates. Deploy live with GitHub Pages.
HTML/CSS/JS AI Prompts GitHub Pages Portfolio
⛅
Project 2 — SkyCast Weather Dashboard
Build a premium weather dashboard using React.js + WeatherAPI. Covers API integration, Recharts charts, Framer Motion animations, .env security, and Netlify deployment.
React.js WeatherAPI Netlify Recharts
🔀
Git & Version Control
16 commands with examples, architecture diagram, daily workflow, best practices, cheat sheet & student assignment.
git init Branching GitHub Assignment
🌐
DNS, Hosting & Infrastructure
DNS, how websites work, domain buying, DNS records, hosting types, deploy methods, load balancers & scaling to 1M users.
DNS Hosting Deploy 1M Users
☁️
Cloud Computing Basics
What is cloud? AWS, Azure, GCP providers. IaaS, PaaS, SaaS service models. Virtualization, containers, serverless. Cloud vs Traditional IT. Career paths in cloud.
AWS IaaS/PaaS/SaaS DevOps Serverless
🚀
Deployment Optimization
.env config, build modes, SEO basics, performance optimization, image optimization & professional deployment checklist.
.env SEO Performance Images
💼
Professional Skills
README writing, project documentation, developer resume, LinkedIn & GitHub optimization, presenting projects professionally.
README Resume LinkedIn GitHub
🗺️
Project Ideas Roadmap
14 projects across 5 levels — Frontend, UI/UX, React, Deployment & Freelancing. Skill-based progression from beginner to portfolio-ready developer.
React Freelancing API Projects Deployment
💰
Freelancing & AI
Earn using portfolio skills, find clients, pricing strategy, AI website builder, ₹50K roadmap & premium brand guide.
Earn Clients ₹50K Plan Brand