Link Previewer Demo App -> Click here
| Page 1 | Page 2 |
|---|---|
 |
 |
Demo:
Screen.Recording.2022-08-02.at.2.44.34.PM.mov
Build using Remix Stacks.
npx create-remix --template remix-run/blues-stack-
Healthcheck endpoint for Fly backups region fallbacks
-
GitHub Actions for deploy on merge to production and staging environments
-
Email/Password Authentication with cookie-based sessions
-
Database ORM with Prisma
-
Styling with Tailwind
-
End-to-end testing with Cypress
-
Local third party request mocking with MSW
-
Unit testing with Vitest and Testing Library
-
Code formatting with Prettier
-
Linting with ESLint
-
Static Types with TypeScript
-
Deployed vercel with Prisma cloud and Heroku PostgreSQL Visit
Not a fan of bits of the stack? Fork it, change it, and use npx create-remix --template your/repo! Make it your own.
Click this button to create a Gitpod workspace with the project set up, Postgres started, and Fly pre-installed
-
This step only applies if you've opted out of having the CLI install dependencies for you:
npx remix init
-
Start the Postgres Database in Docker:
yarn docker
Note: The yarn script will complete while Docker sets up the container in the background. Ensure that Docker has finished and your container is running before proceeding.
-
Initial setup: (Data proxy prisma)
npx prisma generate --data-proxy
or (If only local database)
yarn setup-
Run the first build:
yarn build
-
Start dev server:
yarn dev
For lower level tests of utilities and individual components, we use vitest. We have DOM-specific assertion helpers via @testing-library/jest-dom.
This project uses TypeScript. It's recommended to get TypeScript set up for your editor to get a really great in-editor experience with type checking and auto-complete. To run type checking across the whole project, run yarn typecheck.
This project uses ESLint for linting. That is configured in .eslintrc.js.
We use Prettier for auto-formatting in this project. It's recommended to install an editor plugin (like the VSCode Prettier plugin) to get auto-formatting on save. There's also a yarn format script you can run to format all files in the project.