This is a web-based gallery project built using React.js and Supabase as Backend. The project allows users to create accounts, log in securely, upload their images, and manage their gallery. It includes features for user authentication and authorization to ensure privacy and security, all powered by Supabase.
- User registration and authentication with Supabase.
- Secure user login and logout functionality.
- User-specific image gallery.
- Image upload and deletion for authenticated users.
- Responsive design for mobile, tablet, and desktop.
- User-friendly interface for managing images.
- Supabase integration for backend services.
Here are some screenshots of Gallery in action:
| Gallery |
|---|
 |
| Login Page | Signup Page |
|---|---|
 |
 |
- Clone the repository:
git clone https://github.com/lazyjinchuriki/gallery.git- Install dependencies:
cd gallery
npm install-
Set up Supabase:
- Create a Supabase project on the Supabase Dashboard.
- Configure authentication and storage in your Supabase project settings.
- Copy your Supabase API URL and public API key.
-
Create a
.env.localfile in the project root and add your Supabase configuration:
VITE_Project_URL=your-supabase-api-url
VITE_Project_URL=your-supabase-public-api-key- Start the development server:
npm run devAfter running the development server, you can view the app at http://localhost:3000/
The app Pages can be customized by editing the src/components/ folder. You will find all the components in that folder.
This project uses Supabase services for:
- Authentication: For user registration, login, and access control.
- Storage: For storing user-uploaded images securely.
Contributions to the project are welcome. Please create an issue or submit a pull request if you would like to contribute.
If you have any questions or concerns, you can contact the author of this project at rahulkhushalani@proton.me.
If you found Gallery useful, consider buying me a coffee!
If you're not coding right now, check out my socials:
