Skip to content

πŸ“ˆ An open-source, zero-cost accommodation management solution

Notifications You must be signed in to change notification settings

TusharGaonkar/Stay-Manager

Repository files navigation


Logo

An open-source, zero-cost accommodation management solution

View Demo Β· Report Bug Β· Request Feature

About The Project

Stay Manager is an open-source, zero-cost accommodation management solution crafted for small and medium businesses venturing into the accommodation sector. Built on Supabase, it offers a reliable and scalable platform to effortlessly manage reservations, guest check-ins/check-outs, room assignments, and more. With its intuitive interface and user-friendly design, Stay Manager streamlines your operations, enabling you to provide exceptional guest experiences.

(back to top)

Built With

Tech stack of Stay Manager(v-1.0.0)

Typescript React Shadcn/ui Tailwind CSS Recharts Tanstack Query (React Query) Zod React Hook Form PostgreSQL Supabase

(back to top)

Getting Started

Prerequisites

Before you begin, make sure you have the following prerequisites:

  • Node.js version 20 or greater installed on your system.
  • Supabase account.

Installation

  1. Clone the repository by running the following command in your terminal or command prompt:
git clone https://github.com/TusharGaonkar/Stay-Manager.git

2.Navigate to the cloned repository

cd Stay-Manager

3.Install the dependencies

npm install

Setting up the Backend

  1. Create a Supabase project with name Stay Manager

    Create Supabase project

Step 1

  1. Copy the project key and URL from the console

Step 1

  • Open the .env.txt file in the root directory of the project.
  • Replace the placeholder values in the file:
VITE_SUPABASE_KEY = 'YOUR_SUPABASE_KEY'

VITE_SUPABASE_URL = 'YOUR_SUPABASE_URL'

VITE_CURRENCY_LOCALE = "en-IN"

VITE_CURRENCY = "INR"

To view all the supported VITE_CURRENCY_FORMAT values, check here

To view all the supported VITE_CURRENCY values, check here

  • Rename the .env.txt file to .env
  • Important: Do not share your .env file with anyone as it contains sensitive information.

(back to top)

  1. Creating Storage Bucket
  • Click on Storage from the sidebar.
  • Create a new Supabase storage with the namerooms

Step 3

Creating Tables and PostgreSQL Functions

  • Navigate to the SQL Editor in the sidebar.
  • Create two queries named Functions and Tables
  • Copy the queries from Functions.sql and paste it into the Functions query editor.
  • Copy the content of the Tables.sql and paste it into the Tables query editor.
  • Click on the Run button to execute the queries

Step 4

Adding Authentication

  • From the sidebar, select Authentication
  • Click on Add user

Step 5

  • Provide an admin email and password

Step 6

  • Follow any additional steps or prompts to complete the authentication setup

Configuring Reset Password

  • Click on the Email Templates tab in the sidebar in Authentication
  • Move to Reset password tab
  • Replace the Source with with the following message body and save it
<h2>Reset Your Stay Manager Password</h2>
<p>This is a one-time sign-in link for your account. Follow this URL to reset the password:</p>
<p>
  Go to <strong>Settings</strong>, then in the <strong>Account Settings</strong>, update your
  password!
</p>
<p><a href="{{ .ConfirmationURL }}">Reset Password</a></p>

Step 7

Enabling Row Level Security (RLS)

In order to enable Row Level Security (RLS), to prevent unauthorized access to data, you need to create policies for each of the methods

  • Navigate to Authentication
  • Go to Policies
  • Click on Create policy on the table
  • For each of the methods SELECT, INSERT, UPDATE, DELETE, create the policies for the target role of authenticated as shown below and save the policies individually

SELECT Policy

Step 10

INSERT Policy

Step 10

UPDATE Policy

Step 10

DELETE Policy

Step 10

  • Once all the policies are created, click on Enable RLS

Step 14

  • Repeat the steps for all the tables

Running the server locally

To run the server locally, follow these steps:

  • Navigate to the root directory of the project.

  • Run the following command:

    npm run dev
  • You can access Stay Manager at localhost:5173

  • Login with your admin credentials, try adding a new room and new booking for yourself and see the changes live in real-time

  • Once you have verified the setup is working, it's time to deploy the project

Deploying Stay Manager

  • To build manually and preview use
npm run build && npm run preview

The build files will be located in the /dist folder, and the app will be live at localhost:4173

Create a remote Github repository for your local Stay Manager setup

Deploying to Netlify

Deploy to Netlify

  • To deploy to Netlify from Github please refer this doc
  • Remember to add entries for all the environment variables in your build configuration settings

Deploying to Vercel

Deploy to Vercel

  • To deploy to Vercel please refer this doc

  • Rename the /api folder to supabase-api or similar other than api if you get the following error message

Error: No more than 12 Serverless Functions can be added to a Deployment on the Hobby plan. Create a team (Pro plan) to deploy more.

as Vercel treats all the files inside the /api folder as Serverless Functions.

  • After renaming, enable your IDE to automatically update the paths in the current files importing functions from the /api folder

  • Remember to add entries for all the environment variables in your build configuration settings

(back to top)

Configuring the Domain in Supabase console

  • Navigate to Authentication in your Supabase project
  • From the sidebar, select URL Configuration
  • Enter your domain name in the Site URL field, here our domain is staymanager.netlify.app

Step 15

(back to top)

Done! you have successfully deployed your own Stay Manager instance βš‘πŸ‘.

Contributing

If you have a suggestion that would make this better, please fork the repo and create a pull request.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

Contact

Feel free to reach out if you have any queries or suggestions to improveπŸ‘

Tushar Gaonkar - [email protected]