Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/adityaoberai/backgroundremover
Remove the background from your headshots!
https://github.com/adityaoberai/backgroundremover
appwrite azure-ai sveltekit vercel
Last synced: 13 days ago
JSON representation
Remove the background from your headshots!
- Host: GitHub
- URL: https://github.com/adityaoberai/backgroundremover
- Owner: adityaoberai
- License: bsd-3-clause
- Created: 2023-10-13T13:07:08.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-01-22T12:36:14.000Z (10 months ago)
- Last Synced: 2024-10-04T13:38:38.788Z (about 1 month ago)
- Topics: appwrite, azure-ai, sveltekit, vercel
- Language: Svelte
- Homepage: https://bgremover.in
- Size: 604 KB
- Stars: 19
- Watchers: 2
- Forks: 6
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# Background Remover
[](https://repo-rater.eddiehub.io/rate?owner=adityaoberai&name=BackgroundRemover&format=percentage)
## Description
Background Remover is a SvelteKit app that uses Appwrite Cloud and Azure AI to remove the background from your headshots (and other images).
### Features
- Removes background from your picture
- Register via email or login as guest
- Saves images to your profile _(for logged in users)_
- Allows viewing (and sharing) of picture links _(for logged in users)_
## Setup
There are some necessary steps to get the project up and running.
### Azure AI
- Create an [Azure account](https://azure.com)
- Create a [Computer Vision resource](https://azuremarketplace.microsoft.com/en-us/marketplace/apps/microsoft.cognitiveservicescomputervision?tab=overview) from the Azure Marketplace.
> Keep the endpoint and API key stored with you for later.
### Appwrite Cloud
#### Project
- Create an account on [Appwrite Cloud](https://cloud.appwrite.io/register) (or sign in if you have one)
- Create a project and add your web app (URL)
- Adding the exact URL is necessary for the reset password link functionality
- Create an API key with `user.read`, `user.write`, `documents.read`, `documents.write`, `files.read`, and `files.write` scopes
> Keep the project ID and API key stored with you for later.
#### Storage
- Create two buckets, one for input images and one for output images
| | Input Images Bucket | Output Images Bucket |
| ----------- | ---------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
| Purpose | Contains images to be processed, have their backgrounds removed, and get deleted after | Contains images that have had their backgrounds removed |
| Id | input | output |
| Permissions |  |  |
> Keep both your bucket Ids stored with you for later.
#### Database
- Create a database with one collection, containing the following attributes
| Key | Type | Size | Required |
| ------ | ------ | ---- | -------- |
| userId | string | 255 | Yes |
| fileId | string | 255 | Yes |
- Set the permissions as visible in the image
> Keep the database Id and collection Id stored with you for later.
#### Function
- Change the branch (Git) to [`appwrite-functions`](https://github.com/adityaoberai/BackgroundRemover/tree/appwrite-functions) to find the Appwrite function that helps in deleting accounts
- Update the project name and project id in the `appwrite.json` file, if you kept them different
- [Deploy the function](https://appwrite.io/docs/products/functions/deployment) from the `functions/Delete Account` directory, following the configuration details in the [function's Readme](https://github.com/adityaoberai/BackgroundRemover/tree/appwrite-functions?tab=readme-ov-file#delete-account)
- Setup the function's environment variables as mentioned in the function's Readme
> Keep the function Id stored with you for later.
### Environment variables
Rename the `.env.example` file to `.env` and add all the necessary environment variables.
- `VITE_APP_URL`: URL of the app with protocol _(e.g.: https://bgremover.in)_
- `PUBLIC_APPWRITE_COLLECTION_ID`: Collection Id from Appwrite
- `PUBLIC_APPWRITE_DATABASE_ID`: Database Id from Appwrite
- `PUBLIC_APPWRITE_PROJECT_ID`: Project Id from Appwrite
- `PUBLIC_APPWRITE_OUTPUT_IMAGES_BUCKET_ID`: Output images bucket Id from Appwrite
- `PUBLIC_APPWRITE_INPUT_IMAGES_BUCKET_ID`: Input images bucket Id from Appwrite
- `PUBLIC_APPWRITE_DELETE_ACCOUNT_FUNCTION_ID`: Delete account function Id from Appwrite
- `SECRET_VISION_ENDPOINT`: Azure AI Vision endpoint
- `SECRET_VISION_KEY`: Azure AI Vision API Key
## Deployment
### Vercel
The `svelte.config.js` file is currently configured for Vercel since that is where the application is deployed and a custom timeout is configured for server actions.
### Other PaaS platforms (Cloudflare, Azure, etc.)
- Install `@sveltejs/adapter-auto` using npm/pnpm/yarn
- Replace all the code in the `svelte.config.js` file with the following:
```js
import adapter from '@sveltejs/adapter-auto';
import { preprocessMeltUI } from '@melt-ui/pp';
import { vitePreprocess } from '@sveltejs/kit/vite';
import sequence from 'svelte-sequential-preprocessor';
/** @type {import('@sveltejs/kit').Config} */
const config = {
preprocess: sequence([vitePreprocess(), preprocessMeltUI()])
};
export default config;
```
> After deploying, make sure to update the final URL in the `VITE_APP_URL` environment variable