Skip to content

Latest commit

 

History

History
134 lines (98 loc) · 4.17 KB

File metadata and controls

134 lines (98 loc) · 4.17 KB

📚 LearnSphere

Revolutionizing Education for Teachers and Students

LearnSphere Banner


🚀 About the Project

LearnSphere is an online learning platform designed to bridge the gap between teachers and students by offering an interactive, streamlined, and user-friendly experience. Built for the [Hackathon Name], our platform is a one-stop solution for:

  • Empowering teachers to design and manage courses effortlessly.
  • Enabling students to explore and enroll in high-quality courses tailored to their needs.
  • Creating a seamless and modern learning journey for everyone involved.

🎯 Key Features

🧑‍🏫 For Teachers:

  • Course Creation: Add course details like title, description, difficulty, and duration with ease.
  • Lesson Management: Upload and organize lessons for structured learning.
  • Progress Tracking: Monitor student progress and engagement metrics.

👩‍🎓 For Students:

  • Personalized Dashboard: View enrolled courses, ongoing lessons, and progress.
  • Smooth Navigation: Toggle sidebar for quick access across the platform.
  • Course Details: Clear and concise course information to help students make informed decisions.

🌐 Universal Features:

  • Responsive Design: Fully functional across devices and screen sizes.
  • Modern UI/UX: Clean and aesthetic interface using Material-UI and smooth toggling sidebars.
  • Security: Robust authentication for account verification and password resets.
  • Email Notifications: Stay updated with account actions and course enrollments.

🛠️ Tech Stack

  • Frontend: React.js, Material-UI
  • Backend: Node.js, Express.js
  • Database: MongoDB
  • Cloud Storage: Cloudinary for media handling
  • Authentication: JWT (JSON Web Token)

⚙️ Setup and Installation

Prerequisites

Make sure you have the following installed:

  • Node.js
  • MongoDB
  • Cloudinary Account (for content storage)

Installation Steps

  1. Clone the repository:
    git clone https://github.com/yourusername/LearnSphere.git
    cd LearnSphere
  2. Install dependencies:
    npm install
  3. Configure environment variables in a .env file:
    PORT=3000  
    MONGO_URI=<your-mongodb-uri>  
    CLOUDINARY_CLOUD_NAME=<your-cloudinary-name>  
    CLOUDINARY_API_KEY=<your-cloudinary-key>  
    CLOUDINARY_API_SECRET=<your-cloudinary-secret>  
    JWT_SECRET=<your-jwt-secret>  
    DOMAIN=http://localhost:3000  
  4. Run the application:
    npm start

📖 How It Works

User Flow

  1. Sign Up/Login: Users can create accounts as students or teachers.
  2. Create or Enroll in Courses: Teachers can create courses, while students can enroll in available ones.
  3. Progress Tracking: Both students and teachers can track learning progress.

🏆 Highlights

  • Innovative Learning Management: Simplifying education with technology.
  • Hackathon-Driven Development: Aimed to deliver within a limited timeframe with precision.
  • Scalability: Designed with modularity for future enhancements.

🖼️ Screenshots

🔸 Landing Page

Landing Page

🔸 Teacher's Dashboard

Teacher's Dashboard

🔸 Student's Profile

Student's Profile


👩‍💻 Team

  • [Your Name] - Developer & Designer
  • [Team Member Name] - Backend Specialist
  • [Team Member Name] - UI/UX Expert

🌟 Contributing

Contributions are welcome! Feel free to open issues or submit pull requests.


📧 Contact

For queries or support, reach out to us at:
Email: support@learnsphere.com


🙌 Acknowledgments

We thank [Hackathon Name] for providing the platform to showcase our skills and bring our vision to life!