Tech Stack

Routing

• React Router: The go-to solution for routing in React Single Page Applications (SPAs), providing seamless navigation between views.

Styling

• styled-components 💅: A popular library for writing CSS directly inside JavaScript, allowing for component-scoped styling and dynamic theming.

Remote State Management

• React Query: A powerful tool for managing remote data with features like caching, automatic re-fetching, and offline support. Alternatives like SWR and Redux Toolkit exist, but React Query is widely adopted for its simplicity.

UI State Management

• Context API: This project uses the Context API with useState for managing minimal UI state. Given the simple state requirements, there’s no need for Redux here.

Form Management

• React Hook Form: Handles form state and validation efficiently, reducing the amount of manual code needed for state management and error handling in larger forms.

Additional Tools

• CRUD: Learnt to create, read, update and delete the cabins using custom hooks, react query and react hook form.
• React Icons: For easy and consistent icon usage across the app.
• React Hot Toast: Used for displaying beautiful, non-intrusive notifications.
• Recharts: A charting library for visualizing data within the app.
• date-fns: A lightweight library for handling date manipulation and formatting.
• Supabase: Backend services for authentication, real-time data, and database management. = React Portal