CodePath Web Development 102 - Labs

This repository contains all my lab assignments from the CodePath Web Development 102 course. Each lab focuses on different aspects of modern web development, from basic HTML/CSS to advanced JavaScript frameworks.

Course Overview

Program: CodePath Web Development 102
Duration: [Course Duration]
Focus: Full-stack web development fundamentals

Labs Completed

📁 Lab 1: Weekly Calendar Grid

Skills: React components, CSS Grid/Flexbox, JSX, responsive design
Description: Built a grid-style weekly calendar with one-hour time slots using React. Created a personalized schedule for [who you chose - friend/family/historical figure] with a creative theme. Implemented reusable components and responsive design.

📁 Lab 2: Samosa Selector Game

Skills: React state management, event handling, conditional rendering, React hooks
Description: Created an incremental clicking game inspired by Cookie Clicker using React. Players click a samosa to earn points and unlock upgrades (Double Stuffed at 10 samosas, Party Pack at 100, Full Feast at 1000). Implemented dynamic scoring and upgrade system with useState and conditional rendering.

Upcoming Labs

• Lab 3: [Coming soon]
• Lab 4: [Coming soon]
• Lab 5: [Coming soon]
• Lab 6: [Coming soon]
• Lab 7: [Coming soon]
• Lab 8: [Coming soon]

Technologies Used

• Frontend: React, JSX, CSS3, JavaScript (ES6+)
• Build Tool: Vite
• Tools: Git, VS Code, npm
• Currently Learning: [Add what you're working on next]

Key Learning Outcomes So Far

• ✅ React component architecture and JSX syntax
• ✅ CSS Grid and Flexbox for complex layouts
• ✅ React state management with useState hook
• ✅ Event handling and conditional rendering in React
• 🔄 Currently working on: [Next lab topic]

Running the Labs Locally

Each lab is a React application built with Vite:

# Navigate to specific lab
cd lab-[number]

# Install dependencies
npm install

# Start development server
npm run dev

The app will open at http://localhost:5173 (Vite's default port)

Reflection

Throughout this course, I gained hands-on experience building full-stack web applications. The progression from static HTML/CSS to dynamic React applications with backend APIs gave me a solid foundation in modern web development practices.

Biggest Challenge: [Your biggest challenge]
Most Valuable Skill Learned: [Most valuable skill]

Connect With Me

• LinkedIn: [linkedin.com/in/darreyes]
• GitHub: [github.com/decoder3064]

---

Completed as part of CodePath's Web Development 102 program