Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/santima10/phone-catalog
https://github.com/santima10/phone-catalog
docker nextjs planetscale prisma vercel
Last synced: 1 day ago
JSON representation
- Host: GitHub
- URL: https://github.com/santima10/phone-catalog
- Owner: SantiMA10
- Created: 2022-01-22T15:55:51.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2022-02-24T18:07:34.000Z (over 2 years ago)
- Last Synced: 2023-02-28T07:46:14.779Z (over 1 year ago)
- Topics: docker, nextjs, planetscale, prisma, vercel
- Language: TypeScript
- Homepage: https://phone-catalog-ten.vercel.app/
- Size: 598 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 📞 Phone Catalog [![Deploy](https://github.com/SantiMA10/phone-catalog/actions/workflows/deploy.yml/badge.svg)](https://github.com/SantiMA10/phone-catalog/actions/workflows/deploy.yml) [![visit it](https://img.shields.io/badge/visit-it-blue)](https://phone-catalog-ten.vercel.app/)
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app), that uses React to show a Phone Catalog and Next.js API routes as the backend for the catalog.
## It also uses...
- [Chakra UI](https://chakra-ui.com/) as the main component library
- [jest](https://jestjs.io/) + [Testing Library](https://testing-library.com/) + [User Event](https://testing-library.com/docs/ecosystem-user-event/) as testing framework
- [eslint](https://eslint.org/) + [prettier](https://prettier.io/) to ensure that the code follows a common style
- [prisma](https://www.prisma.io/) as ORM
- [zx](https://github.com/google/zx) for scripting
- [docker](https://www.docker.com/) to have a MySQL instance locally# Getting Started
## Configuration
### PlanetScale
If you want to setup a PlanetScale instance to use it to develop locally, you need to create a `.env.cloud.local` (You can use any of the other .env files as a template).
In order to get the `DATABASE_URL`, you have a few options, all these options are explained [here](https://www.prisma.io/docs/getting-started/setup-prisma/add-to-existing-project/relational-databases/connect-your-database-typescript-planetscale#connecting-your-database).
Once you have the `DATABASE_URL`, you have to run `yarn cloud:migrate` to create the needed tables on PlanetScale.
Then you can use the `yarn cloud:dev` command to start the dev server connected to PlanetScale.
## Development
First, run the development server:
```bash
yarn installyarn docker:dev // to use a local MySQL instance manage with Docker
yarn cloud:dev // to use a remote MySQL instance manage with PlanetScale
yarn dev // alias for yarn docker:dev
```Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
## Testing
```bash
yarn installyarn test // runs all the tests using jest
yarn test:unit // runs all the unit tests using jest
yarn test:integration // runs all the integration tests using jest ⚠️ it requires a MySQL instance ⚠️
yarn test:watch // runs jest in watch modedocker:test:integration // setup MySQL using docker and runs all the integration tests
docker:test:watch // setup MySQL using docker and the tests in watch mode
```# Deploy
This is project is deployed to [Vercel](https://vercel.com/) automatically using GitHub Actions on each push to `main` and uses as database [PlanetScale](https://planetscale.com/), since it is a MySQL-compatible serverless database.