Cluab / Coders-Hub-Front-End

Coders-Hub application allows users to reverse different online classes depending on their preferences. They are assigned a mentor for each course and also get to choose how long they want to participate in the course.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

logo

πŸ“— Table of Contents

πŸ“– Coders Hub

Coders-Hub application allows user to reverse different online classes depending on their preferences. They are the assigned a mentor for each course and also get to choose how long that want to participate on the course.

logo

πŸ›  Built With

  • HTML
  • CSS
  • JS
  • React
  • Redux
  • Rails API

Tech Stack

Client

Key Features

Using the project will help you to :

  • See online classes to attend
  • Reserve a class to attend

(back to top)

πŸš€ Live Demo

(back to top)

πŸ’» Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

In order to run this project you need:

  • Node js installed on your computer
  • Npm Node package manager
  • Terminal
  • Code editor preferably Vscode.

Setup

πŸ‘‰ Clone this repository by using the command line :

  • git clone https://github.com/manq2010/Book-An-Appointment-Front-End

πŸ‘‰ Clone back end repository by using the command line :

  • git clone https://github.com/Cluab/Book-An-Appointment-Back-End

πŸ‘‰ Add the .env file to the root folder of the current repo (Front-End)

πŸ‘‰ Add the following lines on the .env file

REACT_APP_BACKEND="http://localhost:3000/api/v1"
REACT_APP_CLIENT_ID="tqiRUMtQta0eEw6lp3X9iPQK8n5ZlS7OmiKLK0eHJoI"
REACT_APP_CLIENT_SECRET="sAaKljs__17vKbKoVT8G_Jsw-dMrOP8N4i_aPBEjcLQ"

NB: Using the above details on your .env file will not work as each devices needs its unique REACT_APP_CLIENT_ID and REACT_APP_CLIENT_SECRET details, use the step below to generate for your device

πŸ‘‰ Please use this link to go to the back-end part of this project.

πŸ‘‰ On the Back-End Repo, run the seed file by using the command line :

  • rails db:seed

πŸ‘‰ Open rails console by using the command line from the Back-End repo cloned above:

  • rails c

πŸ‘‰ Run the following code on the rails console :

  • Doorkeeper::Application.find_by(name: 'React')

πŸ‘‰ Replace the REACT_APP_CLIENT_ID on the .env file with the id shown on the console :

uid: "tqiRUMtQta0eEw6lp3X9iPQK8n5ZlS7OmiKLK0eHJoI"

πŸ‘‰ Run the following code on the rails console :

  • Doorkeeper::Application.find_by(name: 'React').secret

πŸ‘‰ Replace the REACT_APP_CLIENT_SECRET on the .env file with the id shown on the console :

=> "sAaKljs__17vKbKoVT8G_Jsw-dMrOP8N4i_aPBEjcLQ"

NB: The .env file should look similar to the example above once your unique id and secret key are generated

Install

Install this project with:

  • for the front end rep

npm install

  • for the back end repo

bundle install --force

Usage

To run the project, execute the following command:

  • for the back end repo

rails s

  • for the front end rep

npm start

NB: Start the back end server first

Login

Use the below details to login as admin

email: admin@example.com
password: password

NB: Ensure the rails db:seed was run from above for the admin role to work.

If you want to login as normal user, follow the sign-up process.

NB: If you not able to sign-in, kindly refresh page and try to sign-in again

Run tests

To run tests, run the following command:

npm test

Deployment

You can deploy this project using:

npm run deploy

(back to top)

Authors

πŸ‘€ Mancoba Sihlongonyane

πŸ‘€ Ibrahim Suhail Al-Yousefi

πŸ‘€ Krishna Prasad Acharya

πŸ‘€ Frehiywot Nega

πŸ‘€ Idrissa makoba omar

(back to top)

Kanban board

πŸ‘‰ Kanban board link

πŸ‘‰ Kanban board Development link

πŸ‘‰ This project was authored by Four contributors as described in the the Authors section bellow.

πŸ‘‰ Please use this link to go to the back-end part of this project.

πŸ”­ Future Features

  • Remove reservations made by user
  • Add email confirmation to access website when creating a profile
  • Edit online classes and reservation

(back to top)

🀝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

Give a ⭐️ if you like this project!

(back to top)

πŸ™ Acknowledgments

(back to top)

❓ FAQ

  • How to use the project

    • git clone https://github.com/manq2010/Book-An-Appointment-Front-End
  • How to contribute to the project

    • Fork it by using fork button, or you can contact me.

(back to top)

πŸ“ License

This project is MIT licensed.

(back to top)

About

Coders-Hub application allows users to reverse different online classes depending on their preferences. They are assigned a mentor for each course and also get to choose how long they want to participate in the course.

License:MIT License


Languages

Language:JavaScript 97.1%Language:CSS 1.5%Language:HTML 1.4%