Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/prokawsar/paper-cost-react
A mobile app for calculating paper cost for packaging box
https://github.com/prokawsar/paper-cost-react
react react-router supabase supabase-auth tailwindcss
Last synced: about 1 month ago
JSON representation
A mobile app for calculating paper cost for packaging box
- Host: GitHub
- URL: https://github.com/prokawsar/paper-cost-react
- Owner: prokawsar
- Created: 2024-08-21T15:04:47.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-10-14T11:18:02.000Z (4 months ago)
- Last Synced: 2024-11-08T00:07:18.509Z (3 months ago)
- Topics: react, react-router, supabase, supabase-auth, tailwindcss
- Language: TypeScript
- Homepage: https://paper-cost-react.vercel.app
- Size: 3.66 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Paper Cost
This project is specifically designed with a **MOBILE**-first approach, with the app, carton factory owners or workers can calculate price of their paper that utilized in factory.
## Features and Functionalities
- [x] Email/Password based authentication system
- [x] Dynamic paper layer adding (Maximum 10 paper)
- [x] Price history saved in Supabase (Maximum 20 for free)
- [x] History trash for later recovery (Auto delete after a week)
- [x] Empty field validation
- [x] Auto focus next field on press 'Enter'
- [ ] Calculate the price on press 'Enter' from last input field
## Tech Stack
```bash
-> React
-> React Router
-> React hook form
-> JavaScript
-> TypeScript
-> Zod
-> Tailwind
-> Supabase
-> Playwright
```
## Demo Credentials
Can be tested in live app
```js
[email protected]
```
```js
11111111
```
## Development
1. You'll first need a Supabase project which can be made [via the Supabase dashboard](https://database.new).
For using existing created database, secrets for `.env`.
2. Clone this repo command
```bash
git clone https://github.com/prokawsar/paper-cost-react.git
```
3. Use `cd` to change into the app's directory and install dependencies
```bash
cd paper-cost-react
npm i
```
4. Rename `.env.local.example` to `.env` and update the following:
```
VITE_APP_SUPABASE_URL=[INSERT SUPABASE PROJECT URL]
VITE_APP_SUPABASE_ANON_KEY=[INSERT SUPABASE PROJECT API ANON KEY]
```
5. You can now run the App local development server:
```bash
npm run dev
```
The app should now be running on [localhost:3000](http://localhost:3000/).