Table of Contents

• 🎓 ClassUp - Online Learning Platform
  • 📸 Screenshots
  • 🚀 Live Demo
  • 📋 Kanban Board
  • 🧰 Tech Stack
  • ✨ Key Features
  • 📘 Getting Started
    • 📋 Prerequisites
    • 📂 Setup
    • 📥 Installation
    • 💾 Database
    • 💻 Usage
    • 📃 API
    • 🧪 Tests
  • 👨‍💻 Authors
  • 🎯 Future Features
  • 🙏 Acknowledgements
  • 💎 Resources
  • 🤝 Contribution
  • 💖 Show Your Support
  • 📜 License

🎓 ClassUp - Online Learning Platform

ClassUp is a collaborative online learning platform developed as the final capstone project at Microverse.

Our website allows users to reserve online classes while also providing the opportunity to schedule study sessions with fellow learners in their area. By bridging the gap between virtual learning and real-world interactions, Classup creates a vibrant and collaborative learning environment for students of all backgrounds.

📸 Screenshots

(back to top)

🚀 Live Demo

You can checkout the live demo of our project at classup.onrender.com

(back to top)

📋 Kanban Board

We used a Kanban board to manage our tasks and track the progress of our project.

This is the link to our Kanban Board.

We're a group of 3 members: @tobuya, @tanveerisonline, @IndieCoderMM

(back to top)

🧰 Tech Stack

• Back-end 💻:

  • Ruby on Rails - Creating API endpoints and managing databases
  • PostgreSQL - Database management system

• Front-end 🎨:

  • React - Building user interfaces
  • Redux - Managing states and API calls
  • Bootstrap - Pre-built UI components

• Tools 🛠:

  • Rspec - Testing models and requests
  • RSwag - Documenting and testing API endpoints
  • Jest - Unit tests for frontend components
  • Webpack - Module bundler for React/javascript
  • Render - Cloud platform for deployment

(back to top)

✨ Key Features

• Browse list of available courses
• Log in with a username and access all features
• Reserve online classes according to preferred time and location
• View upcoming classes and reservations
• Mobile-friendly and responsive design

(back to top)

📘 Getting Started

To run this project locally, you'll need to follow these steps.

📋 Prerequisites

Make sure you have the following installed on your machine:

• Ruby 3.1.3 or higher
• Rails 7.0.4 or higher
• PostgreSQL 15.2 or higher
• Node 18.14 or higher

📂 Setup

Clone this repository to your desired foler.

cd my-project
git clone [email protected]:IndieCoderMM/e-learning-academy.git .

📥 Installation

Install the required gems with:

bundle install

Install the node dependencies with:

npm install

💾 Database

Create the databases and run migrations with:

rails db:create
rails db:migrate

To load the sample data, run:

rails db:seed

💻 Usage

Build the frontend assets with:

npm run build

To run the development server, execute the following command:

rails server

Once the server is up and running, you can access the website on http://localhost:3000

📃 API

To read the API documentation, visit https://localhost:3000/api-docs

🧪 Tests

To run tests, run the following command:

rspec spec --format doc

To test the frontend components, run:

npm test

(back to top)

👨‍💻 Authors

We worked collectively on both the frontend and backend development, dividing features among us to ensure a well-rounded and efficient system.

Feel free to reach out to us with your suggestions, ideas, or feedback. We are always eager to improve our website.

👤 Thomas Obuya

• GitHub: @githubhandle
• Twitter: @twitterhandle
• LinkedIn: LinkedIn

👤 Tanveer Ahmad

• GitHub: @tanveerisonline
• Twitter: Tanveer Ahmad
• LinkedIn: Tanveer Ahmad

👤 Hein Thant

• GitHub: @IndieCoderMM
• LinkedIn: @hthantoo
• Gmail: [email protected]

(back to top)

🎯 Future Features

• Implement secure User authentication
• Implement Authorization (Roles: Admin, Instructor, User)
• Add Join-study-sessions Feature
• Implement Edit-courses Feature
• Implement Search Feature

(back to top)

🙏 Acknowledgements

This app was designed based on an original design idea by Murat Korkmaz on Behance. We would like to thank Murat Korkmaz for this inspiring design.

• App Design Template

(back to top)

💎 Resources

🎨 Colors

• 🟢 Accent: #96bf01

🖌 Fonts

• Logo: Pacifico
• Title: Tilt Warp
• Normal: Roboto

🖼 Images

• Landscape Background
• Portrait Background

(back to top)

🤝 Contribution

Contributions, issues, and feature requests are welcome!

(back to top)

💖 Show Your Support

If you like this project, please consider giving it a ⭐.

(back to top)

📜 License

This project is MIT licensed.

(back to top)