CodeCraft WebDev
CraftCode is a complete web development course crafted for individuals aged 21 and older, taking you from beginner to expert. Whether you’re just starting out or looking to sharpen your skills, this course covers everything from the foundational elements of HTML, CSS, and JavaScript to advanced frameworks and full-stack development. A standout feature of CraftCode is the requirement to complete Level 3 and Level 4 together, as they complement each other, providing an integrated learning experience that guarantees proficiency in both front-end and back-end development. With 16 hours of instruction spread over 8 weeks (2 hours per week), CraftCode offers a structured and immersive path to mastering web development. Join today and elevate your web development career to new heights!
First Steps in Front-End
🎯 Objective: Teach the fundamentals to those who have never programmed before.
📌 Content:
✅ What is a Front-End Developer? (difference between BE and FE)
✅ How does the Web work? (HTTP, DNS, Hosting)
✅ Installing essential tools (Browser DevTools and VSCode)
✅ Introduction to HTML5 (basic tags, lists, tables, links)
✅ Introduction to CSS3 (colors, fonts, selectors, classes, and IDs)
✅ Introduction to JavaScript (variables, operators, console.log)
💡 Practical Project: Create your first personal page with HTML and CSS!
Intermediate – Building Professional Layouts
🎯 Objective: Create responsive and dynamic pages with HTML, CSS, and JS.
📌 Content:
✅ Advanced HTML5 (semantics, forms, ARIA accessibility)
✅ Advanced CSS3 (Flexbox, Grid, Transitions, and Animations)
✅ Media Queries (techniques for responsiveness)
✅ Introduction to Modern JavaScript (ES6+)
✅ DOM Manipulation (selectors, events, classes)
✅ Introduction to Git and GitHub (version control)
💡 Practical Project: Create a responsive landing page
Advanced – Interactive Web Applications
🎯 Objective: Create interactive and dynamic applications with JS.
📌 Content:
✅ Advanced JavaScript (Arrow Functions, Arrays, Objects)
✅ API Consumption with Fetch/Axios (HTTP requests)
✅ Local Storage (LocalStorage and SessionStorage)
✅ Introduction to JSON and data manipulation
✅ Asynchronous Programming (Promises, Async/Await)
✅ Introduction to modern frameworks and libraries (Bootstrap, Tailwind CSS)
✅ Project Deployment with Vercel/Netlify
💡 Practical Project: Create an interactive To-Do List
Pro Front-End – React + TypeScript
🎯 Objective: Build complex and scalable applications with React and TypeScript.
📌 Content:
✅ React Fundamentals (Components, Props, States)
✅ Hooks (useState, useEffect, useContext)
✅ React Router (Page Navigation)
✅ API Consumption in React
✅ Introduction to TypeScript (typing, interfaces, generics)
✅ Styled Components and CSS-in-JS
✅ Unit Testing in React (Jest)
💡 Practical Project: Create a Dashboard with React + TypeScript
Epic Front-End – Advanced React + Project Architecture
🎯 Objective: Build robust applications and master the Front-End ecosystem.
📌 Content:
✅ Advanced React (Context API, Redux, Zustand)
✅ React Performance Optimization (Memoization, Lazy Loading)
✅ Next.js (Server Side Rendering and Static Site Generation)
✅ Advanced State Management
✅ Advanced TypeScript (Utility Types, Polymorphism)
✅ Automated Testing (E2E with Cypress)
✅ Project Architecture and Best Practices
💡 Final Project: Build a complete E-commerce with Next.js + TypeScript
🎖 Certification and Rewards
✔️ Certificate of Completion at each level
✔️ Challenges and Hackathons for practice
🎯 Course Highlights
🔹 100% based on real-world projects
🔹 Learn GitHub, CI/CD, Webpack, Tailwind, and more!
🔹 From Zero to React + TypeScript Specialist!