@recommended
inside the VSC Extensions search bar )cp .env.example .env
to create a .env
file.env
file with your valuespnpm install
to install dependenciespnpm db:migrate:dev
to create the tables in the databasepnpm dev
to start the app in development modeThis template was original a copy from t3-oss/create-t3-turbo.
We just replaced AuthJS with LuciaAuth.
We're using this template internally and found out that some parts are not needed for a "web" monorepo ( = without expo ).
So we updated it to be more like a "web" monorepo and removed all unnecessary stuff.
This was mainly the trpc
package with tanstack/query
.
Why? With all the nextjs updates, we think, most usecases don't need the extra layer to get the data.
The template will use nextjs directly to fetch the data. ( https://nextjs.org/docs/app/building-your-application/data-fetching/fetching )
This project is a monorepo based on turborepo.
├── apps
│ └── frontend - Contains the logic for the site
├── packages
│ ├── auth - Based on lucia-auth.com
│ ├── db - Contains all the database related stuff ( prisma schema, migrations, seeds etc. )
│ ├── helpers - Helper functions 🤷♂️
│ ├── locales - contains the translations for the `frontend` app
│ ├── logging - Contains the logging wrapper ( via LogLayer )
│ ├── search-params - Contains the search params for the `frontend` app ( e.g. pagination, sorting etc. for the datatable )
│ └── ui - Contains all ui components ( based on shadcn/ui)
└── tooling
├── eslint - Contains the config files for eslint
├── github - Contains the configuration for github actions
├── playwright - Contains the config file for playwright
├── prettier - Contains the config file for prettier
├── tailwind - Contains the config files for tailwind w/ db ui colors
└── typescript - Contains the config files for typescript
next-intl
pnpm dev
- Runs all apps & packages in dev mode. ( if they have a dev
script )pnpm build
- Builds all apps & packages. ( if they have a build
script )pnpm test
- Runs all tests ( if they have a test
script )pnpm lint
- Lints all files in all apps & packages ( if they have a lint
script )pnpm format:fix
- Formats all files. ( if they have a format
script )pnpm typecheck
- Runs the typescript type check on all apps & packages. ( if they have a typecheck
script )pnpm db:generate
- Runs the drizzle generate command: https://orm.drizzle.team/docs/drizzle-kit-generatepnpm db:migrate
- Runs the drizzle migrate command: https://orm.drizzle.team/docs/drizzle-kit-migratepnpm db:push
- Runs the drizzle push command: https://orm.drizzle.team/docs/drizzle-kit-pushpnpm db:seed
- Seeds some data - Uses the drizzle seed command: https://orm.drizzle.team/docs/seed-overviewpnpm db:studio
- Opens the drizzle studio: https://orm.drizzle.team/docs/drizzle-kit-studioWe have prepared some simple testcases to test the authentication in the nextjs app.
To make it runable inside a CI or locally, we're using an oauth mock server to make it easier to run the tests and ensuring everything works as expected without having to add some magic to bypass the tests.
With this, we automatically test the authentication flow.
By running pnpm dev
, the oauth mock server will start, too.
You only have to set OAUTH_MOCK_ENABLED
to true
in your .env
file.
Last step is to open a new terminal tab and run pnpm test:e2e:nextjs
to start the playwright tests.
You can find the complete playwright configuration in tooling/playwright
.
Without the amazing work of the T3 OSS Community, this project wouldn't exists.
Also a big thanks to dBianchii for his awesome work and help to migrate the auth package ( previously we used V3, now we run "our own" auth package ) and the locales package ( migrating from next-international
to next-intl
).