Skip to content

Education Website UI built with HTML, CSS, JavaScript, React.js, and Next.js. Collaborative project for a frontend web development bootcamp by Caree180 and Learnit.

License

Notifications You must be signed in to change notification settings

IMostafaR/edu-ui-project

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Education Website UI Project

This repository hosts the collaborative project for building an Education Website UI. It is part of the frontend web development bootcamp organized by Caree180 in partnership with Learnit. The project will evolve through three levels, utilizing different technologies.


Project Structure

The project is divided into three development levels, each focusing on a specific set of tools and technologies:

Level 1: HTML, CSS, and Vanilla JavaScript

  • Build the foundational UI using native web technologies.
  • Create responsive and accessible web pages.

Level 2: React.js

  • Enhance the UI with dynamic, component-based architecture using React.js.

Level 3: Next.js


Website Navigation Analysis

This project includes a detailed navigation system for an educational website. The navigation flow ensures smooth transitions between pages and provides an intuitive user experience.

Navigation Structure

  • Home (Page 1):

    • Acts as the landing page.
    • Provides links to all key sections of the website.
  • Courses (Page 2):

    • Displays a list of available courses.
    • Clicking on any course card navigates to:
      • Course Details (Page 3): Contains more information about the selected course.
  • Pages:

    • About (Page 4): Provides information about the platform.
    • Teacher (Page 5): Lists all teachers.
      • Clicking on a teacher card navigates to:
        • Teacher Details (Page 6): Displays details about the selected teacher.
    • Price (Page 7): Lists pricing plans for courses.
    • Signup (Page 8): Allows users to register for the platform.
  • Blog (Page 9):

    • Displays a list of blog posts.
    • Clicking on a blog card navigates to:
      • Blog Details (Page 10): Shows the full content of the selected blog.
  • Contact (Page 11):

    • Provides a contact form and details to reach out to the platform.

Visual Navigation Map

Below is a visual representation of the website navigation:

Website Navigation


About the Bootcampt

This project is part of the Frontend Web Development Bootcamp, hosted by Caree180 in collaboration with Learnit. The program aims to equip participants with hands-on experience in modern web development.


License

This project is licensed under the MIT License.

About

Education Website UI built with HTML, CSS, JavaScript, React.js, and Next.js. Collaborative project for a frontend web development bootcamp by Caree180 and Learnit.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •