Hotel Haven (Team Project)

This repository contains the frontend codebase for Hotel Haven, a modern hotel management application. The frontend is built using various libraries, frameworks, and tools to provide an intuitive and efficient user experience.

Project Links

Folder and File Naming Conventions

kebab-case for File and Folder Names:

Ensure all folder names are in kebab-case. This convention is more web-friendly and suitable for URLs.

PascalCase for Component Files:

Use PascalCase for component files to distinguish them from other files, especially in React. Root files like "index.js" or "index.ts" should also follow PascalCase.

UPPERCASE_SNAKE_CASE for Constants file names:

Use UPPERCASE_SNAKE_CASE for constant values to make them stand out and maintain convention consistency.

Used Packages In This Project

Frontend Libraries/Frameworks:

React: Frontend library for building user interfaces.
Redux Toolkit: State management toolset for predictable state containers.
React Router DOM: Declarative routing for React-based applications.
Framer Motion: Animation library for React components.
TailwindCSS Theme Swapper: TailwindCSS utility for easy theme swapping.

UI/Visualization:

Chart.js: Data visualization library for creating charts.
React Chartjs 2: React wrapper for Chart.js.
React Calendar: Calendar component for React applications.
React Responsive Carousel: Carousel/slider component for React.
React Icons: Icon library with a vast collection of icons for React applications.
React Tooltip: Tooltip component for React.

Data Handling/Backend Integration:

Axios: Promise-based HTTP client for making HTTP requests.
Firebase: Backend services for hosting and backend integration.
LocalForage: Library for offline storage using asynchronous storage in the browser.
EmailJS Com: Service for sending emails using JavaScript.

Miscellaneous:

@React-PDF/Renderer: Library for generating PDFs in React.
@Smastrom/React-Rating: React component for ratings.
@Types/Google-Map-React: TypeScript definitions for Google Map React library.
Sort-By: Sorting utility for arrays.

Scripts

dev: Start development server using Vite.
build: Build the project using TypeScript and Vite, then deploy to Firebase.
lint: Run ESLint to lint TypeScript and TypeScript React files.
preview: Preview the project using Vite.

Development Dependencies

TypeScript: Typed superset of JavaScript for enhancing developer productivity.
ESLint: JavaScript and TypeScript linter for maintaining code quality.
TailwindCSS: Utility-first CSS framework for rapid UI development.
Vite: Build tool that focuses on frontend development serving.