/oh-front

Primary LanguageJavaScript

ONLY HANDS

Frontend

This project is the frontend implementation of the ONLY HANDS application. It provides a user interface for managing various tasks and activities related to different services. The application is built using React and utilizes various libraries and components for a responsive and user-friendly experience.

Installation

  1. Clone the repository: git clone git@github.com:stasiaDiamond/oh-front.git
  2. Navigate to the backend directory: cd oh-front
  3. Install dependencies: npm install:

Frontend Dependencies:

react react-dom react-router-dom @mui/material @emotion/react @emotion/styled @fullcalendar/react @fullcalendar/daygrid @fullcalendar/interaction firebase

Run the following command: npm install react react-dom react-router-dom @mui/material @emotion/react @emotion/styled @fullcalendar/react @fullcalendar/daygrid @fullcalendar/interaction firebase.

Configuration

Create a Firebase project at the Firebase Console. Set up the necessary Firebase services according to your requirements (e.g., Authentication, Cloud Firestore, Storage). Obtain the Firebase configuration object for your project. Create a .env file in the project root directory.

Add the Firebase configuration object to the .env file:

REACT_APP_FIREBASE_API_KEY=your_api_key REACT_APP_FIREBASE_AUTH_DOMAIN=your_auth_domain REACT_APP_FIREBASE_PROJECT_ID=your_project_id REACT_APP_FIREBASE_STORAGE_BUCKET=your_storage_bucket REACT_APP_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id REACT_APP_FIREBASE_APP_ID=your_app_id

Usage

When you open the application, you will see a main screen called the dashboard. It gives you an overview of all the things you need to do and the tasks you have. To move around the application, you can use the sidebar on the left side of the screen. It has different options like contacts, invoices, forms, gallery, and more. If you click on the calendar option, you can see and manage your events and appointments. Each section of the application has an easy-to-use interface that allows you to do specific actions related to that particular service.

Technologies Used

React: JavaScript library for building user interfaces. React Router: Library for handling routing in the application. Material-UI: UI component library for creating responsive and visually appealing designs. FullCalendar: JavaScript library for creating interactive calendars. Google Firebase: Backend as a Service (BaaS) platform for managing serverless infrastructure and cloud-based services.

Contributing

Contributions are welcome! If you find any issues or want to add new features, feel free to open a pull request.

License

This project is licensed under the MIT License.

Depoloyed at:

https://only-hands.netlify.app/

Screenshot 2023-06-09 at 12 23 06 PM

Screenshot 2023-06-09 at 12 23 19 PM

Screenshot 2023-06-09 at 12 23 54 PM