theresaross/sec33-group2-wigglepaw

WigglePaw

Deployment

Main: https://frontend-production-0c02.up.railway.app Dev: https://frontend-dev-a13f.up.railway.app/

Dependency

• pnpm -- a fast, disk space efficient package manager.
• docker -- a platform for developers and sysadmins to develop, ship, and run applications.
• docker-compose -- a tool for defining and running multi-container Docker applications.

Setting up a Development Environment

1. Clone the repository
2. Run cp .env.example .env: Copy the example environment file to a new file called .env
3. Change the values in .env as needed
4. Run docker-compose up: Start and run services defined in the docker-compose.yml file.
   • Alternatively, you can use the vscode devcontainer
   • For now, it will start a PostgreSQL database
5. Run pnpm install: Install project dependencies.
6. Run pnpm prisma db push: Push the Prisma schema to the database.
7. Run pnpm dev: Run project in development mode with local web server and live reloading.
8. Open localhost:3000 in your browser.

Useful Commands

• pnpm install: Install project dependencies, will also run pnpm prisma db push and pnpm prisma studio after installation. Try this first if you are having weird trouble with the project.
• pnpm dev: Run project in development mode with local web server and live reloading.
• pnpm build: Build project for production.
• pnpm prisma db push: Push the Prisma schema to the database.
• pnpm prisma studio: Open Prisma Studio, a GUI for viewing and editing data in your database.
• pnpm cypress open: Open Cypress, a GUI for running end-to-end tests.

Additional tools

• /api/trpc/playground: Sandbox for testing tRPC queries in the browser. (https://github.com/sachinraja/trpc-playground)
• /api/trpc/panel: Automatically generated a UI for manually testing your tRPC backend. (https://github.com/iway1/trpc-panel)

Documentation

Database ERD

Autogenerated ERD from the Prisma schema, in different formats:

• mermaid (viewable directly on GitHub)
• dbml (viewable on dbdiagram.io)

Docker Services

Running docker-compose up will start multiple services: (For more details, read the docker-compose.yml file.)

Database

A PostgreSQL database is used for general structured data storage, exposed on port 6969.

MinIO (S3 Compatible Object Storage)

MinIO is an "high-performance, S3 compatible object storage". It is used to store files, such as images, videos, and documents.

While the server is exposed on port 9003, a more convenient way to access it is through its web interface, which is exposed on port 9099. For first time login, use user=root and password=password.

Note that this is intended for development only, the production deployment may uses a different (but still s3-compatible) object storage service. More over, to allow anyone to just use .env.example, the access credentials is fixed and publicly known.

Additional Dependencies

In addition to the default T3 Stack dependencies, this project also uses the following:

• react-hook-form -- Performant, flexible and extensible forms with easy-to-use validation.
• headless-ui -- Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
• autoanimate -- Auto-animate is a library that makes it easy to animate elements on the page when they enter or leave the viewport.

Create T3 App

This is a T3 Stack project bootstrapped with create-t3-app.

What's next? How do I make an app with this?

We try to keep this project as simple as possible, so you can start with just the scaffolding we set up for you, and add additional things later when they become necessary.

If you are not familiar with the different technologies used in this project, please refer to the respective docs. If you still are in the wind, please join our Discord and ask for help.

• Next.js
• NextAuth.js
• Prisma
• Tailwind CSS
• tRPC

Learn More

To learn more about the T3 Stack, take a look at the following resources:

• Documentation
• Learn the T3 Stack — Check out these awesome tutorials

You can check out the create-t3-app GitHub repository — your feedback and contributions are welcome!

How do I deploy this?

Follow our deployment guides for Vercel, Netlify and Docker for more information.