Hostel Management Frontend

Welcome to the frontend repository of the Hostel Management Project. This application is built using ReactJS with Redux Toolkit and incorporates various technologies to provide a comprehensive hostel management solution.

https://hostelmanagement1245.netlify.app

Technologies Used

• ReactJS: A JavaScript library for building user interfaces.
• Redux Toolkit: A set of tools to simplify Redux development.
• TypeScript: A typed superset of JavaScript, bringing static types to the language.
• Tailwind CSS: A utility-first CSS framework for rapidly building custom designs.
• Socket.io for Chat: Real-time bidirectional event-based communication.
• Responsive Design: Ensures a seamless experience across different devices and screen sizes.
• WebP Images: Utilizes the WebP image format for efficient image delivery.
• Cloud-hosted Images: Images are hosted on a cloud service for optimized performance.
• Formik and Yup: For efficient form management and validation.
• React Toastify and Sweet Alert 2: Provide a user-friendly notification system.
• Charts from Chart.js: Used for visualizing data through charts.

User Types

The application caters to three types of users:

1. Student
2. Staff
   • Chef
   • Maintenance
   • Warden
3. Chief Warden

Getting Started

Prerequisites

• Node.js: Ensure that Node.js is installed on your machine. You can download it from https://nodejs.org/.

Installation

1. Clone the repository:

       git clone https://github.com/Rishikesht1245/Hostel_Management_Frontend.git

2. Navigate to the project directory:

       cd Hostel_Management_Frontend

3. Install dependencies

       npm install

4. Run the development server

       npm run dev

5. View the application: http://localhost:5173

6. Production build

       npm run build