Ezzywealth/cab_bookings_frontend

Cab Booky is an innovative application that empowers users to easily create, delete, and reserve cabs. With seamless integration of React, Ruby on Rails, Tailwind CSS, and Cloudinary, users can reserve available cabs from the cab store with convenience and efficiency.

Carbooky

📗 Table of Contents

• 📖 About the Project
  • Kanban
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Usage
  • Deployment
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• 📝 License

Carbooky

• Click this link to access the backend app that was built using rails and postgres.

Kanban Board

• Click this link to access the Kanban Board.
• Click this link to view the initial screenshot of the project Kanban Board.

Team Members

• At the culmination of this project, only three team members remained, and detailed information about them can be found in the 👥 Authors

• Click this link to view the description of each team members role in the project.

🛠 Built With

Tech Stack

Client

• ReactJS
• React Router
• Redux Toolkit

Key Features

• User Authentication
• Navigation Panel
• Cab Index page
• Cab details page
• Add cab page
• Delete cab page
• Reservation page
• Add Reservation Page
• Responsiveness
• Unit Testing

(back to top)

🚀 Live Demo

• Clike Here!!!

(back to top)

💻 Getting Started

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

Prerequisites

In order to run this project you need:

• A browser (e.g. Firefox)
• An IDE (e.g. Visusal Studio Code)
• npm
• Terminal

Setup

To clone this repository to your desired folder, follow the steps below:

Using the command line

• Use the following commands

  cd my-folder
  git clone https://github.com/Ezzywealth/cab_bookings_frontend

Using GitHub Desktop app

• Follow the steps below

  • Visit this link "https://github.com/Ezzywealth/cab_bookings_frontend"
  • Click the green button labelled "code"
  • Select the "Open with GitHub Desktop" option
  • After the GitHub Desktop add opens, click the "clone repo" button

Usage

To run the project, execute the following command:

• npm install
• npm start
• Click Sign up button on the homepage

To be able to upload a cab image in development, kindly follow this step,

• Cloudinary
• sign up to get your upload preset and cloud name
• Run the api server first before the frontend server, this would ensure the api runs at port 3000
• Add the following information in your .env file of the frontend application with their respective values

  REACT_APP_CLOUDINARY_CLOUD_NAME
  REACT_APP_CLOUDINARY_UPLOAD_PRESET
  REACT_APP_API_URL=http://127.0.0.1:3000/api/v1
  REACT_APP_API_USERS=http://127.0.0.1:3000/api/v1/users

TO test the project using react testing library, execute the following command:

• npm run test

  npm install
  npm run test

Deployment

You can deploy this project by:

• visiting your repository on GitHub
• Click on settings
• Go to the "Pages" option
• Select the main branch and save

(back to top)

👥 Authors

👤 Ezekiel Udiomuno

• GitHub: @Ezzywealth
• Twitter: @Ezzywealth
• LinkedIn: Ezekiel Udiomuno

👤 John Kpordje

• GitHub: @outkarm
• Twitter: @outkarm
• LinkedIn: John Kpordje

👤 Abdimulhin Adan

• GitHub: @AbdimulhinYussuf3675
• Twitter: @abdimulhin
• LinkedIn: Abdimulhin Adan

🔭 Future Features

• [Account Profile Page]
• [Reservation Details page]
• [Reservation History page]

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

(back to top)

⭐️ Show your support

If you like this project, give it a star and let me know what you like in particular.

(back to top)

🙏 Acknowledgments

We would like to thank...

• Microverse for learning the oppotunity

• Murat Korkmaz for the design.

(back to top)

📝 License

This project is MIT licensed.

(back to top)