Education Company Website

A modern, responsive education platform with light/dark theme support and yellow accent colors.

Project Structure

├── backend/
│   └── index.ts             # Main Hono server (HTTP trigger)
├── frontend/
│   ├── components/
│   │   ├── App.tsx          # Main React app
│   │   ├── Header.tsx       # Navigation header
│   │   ├── Footer.tsx       # Footer with social links
│   │   ├── CoreSection.tsx  # Individual core section
│   │   ├── LessonCard.tsx   # Lesson card component
│   │   └── CoreDetail.tsx   # Detailed core page
│   ├── pages/
│   │   ├── Home.tsx         # Main landing page ✅
│   │   ├── About.tsx        # About page ✅
│   │   └── Contact.tsx      # Contact page ✅
│   ├── index.html           # Main HTML template
│   ├── index.tsx            # Frontend entry point
│   └── style.css            # Custom styles
├── shared/
│   ├── types.ts             # Shared TypeScript types
│   └── data.ts              # Course data
└── README.md

Features

  • Responsive Design: Works on desktop, tablet, and mobile
  • Light/Dark Theme: Toggle between themes with yellow accent ✅
  • Core-Based Learning: 5 core sections with individual lessons
  • Detailed Views: Individual pages for each core with lesson details
  • Modern UI: Clean, professional design for education
  • Navigation: Header with logo and menu, footer with social links

Pages

  • Home: Main page with all 5 core sections
  • About: Company information
  • Getting Started Guide: Opens PDF guide in new tab
  • Contact Us: Contact information and form
  • Core Detail Pages: Detailed view for each core (Core 1-5)

Technology Stack

  • Backend: Hono (TypeScript)
  • Frontend: React 18.2.0 with TypeScript
  • Styling: TailwindCSS
  • Theme: Light/Dark mode with yellow (#FCD34D) accent