mwafrika / shift-plan-frontend

Shift Planner is a powerful web application designed to assist company owners in managing employee schedules and shift assignments. With Shift Planner, employers can easily create and manage shifts, and assign workers to those shifts with ease.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ“— Table of Contents

πŸ“– Shift PLanner

Shift Planner is a powerful web application designed to assist company owners in managing employee schedules and shift assignments. With Shift Planner, employers can easily create and manage shifts, and assign workers to those shifts with ease.

In addition, Shift Planner also provides employees with the ability to request absences whenever they are needed. This feature allows workers to easily communicate their scheduling needs to their employer, improving communication and reducing scheduling conflicts.

Overall, Shift Planner is an essential tool for any business looking to streamline their scheduling process and improve communication between employers and employees.

ScreenShots

1. Register/Login screen

2. Admin Actions

Upon successful login, an Admin will be directed to their dashboard where they can perform various actions, such as adding a department.

3. Manager Actions

After logging in successfully, a Manager will be directed to their dashboard, where they can carry out different tasks, including assigning shifts, viewing a list of employees in their department, and generating a report.

4. Employee Actions

After logging in successfully, employees will be directed to their dedicated dashboard. This dashboard allows them to effortlessly access and manage their assigned shifts, while also providing the option to update their profile details as required.

πŸ›  Built With

Tech Stack

Client
Server
Database

Key Features

  • Reporting: Shift Planner also includes a reporting feature that allows employers to generate custom reports on employee schedules, shift assignments, and other important data.

  • Shift Management: Shift Planner allows employers to easily create and manage shifts, and assign workers to those shifts with ease. This feature includes the ability to set shift times, assign workers to specific shifts, and view shift schedules.

  • Absence Management: Shift Planner provides employees with the ability to request absences whenever they are needed. This feature allows workers to easily communicate their scheduling needs to their employer, improving communication and reducing scheduling conflicts.

(back to top)

πŸš€ Live Demo

(back to top)

πŸ’» Getting Started

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

Prerequisites

Make sure you have the following tools installed:

 Git and Node.js 

Setup

Clone this repository to your desired folder:

  cd my-folder
  git clone https://github.com/mwafrika/shift-plan-frontend.git

Install

Install dependencies:

  cd shift-plan-frontend
  npm install

Usage

To run the project, execute the following command:

  npm run start:dev

Deployment

You can deploy this project using:

 netlify or vercel 

(back to top)

πŸ‘₯ Authors

πŸ‘€ Mwafrika (JosuΓ©) Mufungizi

πŸ‘€ Nicole Ciragane

πŸ‘€ Jeffrey Dauda

πŸ‘€ Joseph Irirwanirira

(back to top)

🀝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you found Shift Planner to be a valuable tool for managing shifts and improving scheduling efficiency, we kindly request that you consider leaving a star on our GitHub repository. Your support would mean a lot to us and would motivate us to further enhance and refine the application. Thank you for your consideration!

(back to top)

πŸ™ Acknowledgments

We would like to extend our heartfelt appreciation to the COA team for their brilliant project idea. Their innovative thinking and creativity have paved the way for the development of an exceptional solution like Shift Planner. Their contribution has been instrumental in creating a tool that simplifies shift management and enhances productivity. Thank you, COA team, for your invaluable project idea!

(back to top)

❓ FAQ

  • What are the system requirements for running Shift Planner?

    • Shift Planner has specific system requirements to ensure optimal performance. New developers may inquire about the supported operating systems, required versions of Node.js and other dependencies, and any additional software or hardware prerequisites.
  • Is there any documentation or user guide available to help with the setup and usage of Shift Planner?

    • New developers often seek comprehensive documentation or user guides to understand the installation process, configuration options, and how to utilize the various features of Shift Planner effectively. They may inquire about the availability of such resources to aid them in getting started with the project.

(back to top)

πŸ“ License

This project is MIT licensed.

(back to top)

API Documentation Link

For detailed API documentation, please visit the Wallet App API Documentation .

Getting Started

To set up the application locally, follow these steps:

Prerequisites

Make sure you have the following tools installed:

  • Git
  • Node.js

Setup

  1. Clone the repository:
git clone https://github.com/mwafrika/task-force.git

2. Navigate to the project directory:

cd task-force
Create .env files in both the frontend and backend directories, and copy the contents of .env.example into them. Update the credentials as required.

Running the Application

A. Frontend

  • Navigate to the frontend directory:
cd frontend
  • Install dependencies:
npm install
  • Run the development server:
npm run dev

B. Backend

  • Navigate to the frontend directory:
cd backend
  • Install dependencies:
npm install
  • Run the development server:
npm start

Remember to update the .env files with the appropriate credentials before starting the servers.

Screenshots

1. Register/Login screen

2. Initial Dashboard

After a successful login, you will be redirected to the dashboard where you can see all your accounts and transactions.

3. Track all in and out transactions from each account

To see the transactions associated with a particular account, click on the account name. You will be able to load all the transactions associated with that account.

4. Modal to create new records (e.g. new account)

5. Generate a report according to the desired time gap.

In order to view the transactions reports, you need to click "Transaction Report button" then select the date interval (starting from when you have created a new transaction) to see the report of transactions associated with that account.

Authors

πŸ‘€ Mwafrika JosuΓ©

🀝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

  • Inspiration
  • etc

πŸ“ License

This project is MIT licensed.

About

Shift Planner is a powerful web application designed to assist company owners in managing employee schedules and shift assignments. With Shift Planner, employers can easily create and manage shifts, and assign workers to those shifts with ease.

License:MIT License


Languages

Language:TypeScript 96.4%Language:JavaScript 2.2%Language:Dockerfile 0.9%Language:CSS 0.3%Language:HTML 0.1%