chore: Updated README.md

- Added LICENSE.md file - Updated .env.example

.env.example

@@ -1,12 +1,29 @@
-############################################################
-##################  SUPABASE  ##############################
-############################################################
-NEXT_PUBLIC_SUPABASE_URL=
-NEXT_PUBLIC_SUPABASE_ANON_KEY=
-SUPABASE_SERVICE_KEY=
+## NOTE
+## Thoses variables will be checked on runtime, if they are not set, the application will throw an error.
+## src/env.mjs
 
 
-############################################################
-##################  INTERNALS CONSTANTS  ###################
-############################################################
+# Supabase configuration
+## Supabase URL
+NEXT_PUBLIC_SUPABASE_URL=""
+## Supabase anonymous key
+NEXT_PUBLIC_SUPABASE_ANON_KEY=""
+## Supabase service key
+SUPABASE_SERVICE_KEY=""
+
+# Stripe configuration
+## Stripe publishable key
+NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=""
+## Stripe secret key
+STRIPE_SECRET_KEY=""
+## Stripe webhook secret
+STRIPE_WEBHOOK_SECRET=""
+
+# Replicate API key
+REPLICATE_API_KEY=""
+
+# Ngrok URL for local development
+NGROK_URL=''
+
+# Default credits per user
 DEFAULT_CREDITS_PER_USER=

LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Adil BASRI (adevinwild)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,22 +1,94 @@
 <p align="center">
-    <img src="./public/_static/thumbnail.jpg" width="100%" >
+    <img src="./.r/gh-logo.png" width="320px" >
 </p>
 
 <h1 align="center">
     μScale
 </h1>
 
 <p align="center">
-    Upscale your low quality images to 4x with AI.
-</p>
-<p align="center">
-<small >
-    Made for the <a href="https://thefullstack.network/hackathon/competition">Fullstack Network Hackathon #1</a>
-</small>
+    µ(micro)Scale is a web app that allows you to upscale any images up to 2x its resolution with AI.
 </p>
 
-<p align="center">
-    <a href="https://micro-scale.vercel.app">
-        <kbd>Upload my image now!</kbd>
-    </a>
-</p>
+## Introduction and features
+
+What started out as a hackathon project (The FullStack Network Hackathon #1) eventually evolved into a template that other developers could use to expand on this foundation with the following features integrated in this new version:
+
+- +Next.js 14
+- +shadcn/ui
+- +sonner
+- +Supabase (Storage, Auth and Database)
+- +Stripe and Stripe Checkout
+- +Replicate AI
+
+The app is built with Next.js and Tailwind CSS, and uses Supabase for storage, authentication and database. The app also uses Stripe for payments so the users can buy credits to have access to the upscale feature that is built around Replicate AI.
+
+## Try the app
+
+You can try the app [here](https://uscale.imadil.dev/)
+
+## Getting Started
+
+Before starting, you'll need to configure the environment variables with the various keys required.
+Once you've set up your environment variables, you'll need to configure your database with the schema provided below.
+
+> Note for Stripe webhook:
+> When configuring your webhook to know if the payment was successful, the URL for the webhook is as follows: `http://localhost:3000/api/stripe`
+
+## Database Schema
+
+### Tables
+
+1. **credits**
+
+   - `amount`: (number | null) - The amount of credits.
+   - `created_at`: (string) - The creation date of the credit record.
+   - `id`: (number) - The unique identifier of the credit record.
+   - `user_id`: (string | null) - The identifier of the user associated with the credit record.
+
+2. **predictions**
+   - `created_at`: (string) - The creation date of the prediction record.
+   - `id`: (number) - The unique identifier of the prediction record.
+   - `input_url`: (string | null) - The input URL for the prediction.
+   - `output_url`: (string | null) - The output URL for the prediction.
+   - `status`: (number | null) - The status of the prediction.
+   - `user_id`: (string | null) - The identifier of the user associated with the prediction record.
+
+### Relationships
+
+1. **public_credits_user_id_fkey**: A foreign key relationship from the `user_id` column in the `credits` table to the `id` column in the `users` table.
+2. **public_predictions_user_id_fkey**: A foreign key relationship from the `user_id` column in the `predictions` table to the `id` column in the `users` table.
+
+Please ensure that your database is set up with this schema before running the application.
+
+## Local Development
+
+You can now start the development server by running:
+
+```bash
+yarn dev
+```
+
+When your server has started, you'll NEED to run a [ngrok tunnel](https://ngrok.com) to expose your localhost to the internet. This is necessary for the AI predictions runned by Replicate that will trigger the different webhooks in the app.
+
+```bash
+ngrok http 3000
+```
+
+Finally, I have commented out the Replicate AI integration in the app, so you'll need to uncomment the code in the `src/app/api/upload` file to enable the AI predictions.
+
+You are all set! You can now access your app and try it out.
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+
+## Useful Links
+
+- [Next.js](https://nextjs.org/)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [Supabase](https://supabase.com/)
+- [Stripe](https://stripe.com/)
+- [Replicate AI](https://replicate.com/)
+- [The FullStack Network](https://thefullstack.network/)
+- [ngrok](https://ngrok.com/)