Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Repo refactoring #12

Merged
merged 6 commits into from
Dec 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 23 additions & 13 deletions .env.example
Original file line number Diff line number Diff line change
@@ -1,13 +1,23 @@
# The database URL is used to connect to your database.
DB_HOST='localhost'
DB_PORT=5432
DB_NAME='turbo_stack_db'
DB_USERNAME='turbo_stack'
DB_PASSWORD='turbo_stack'

# OAUTH Configuration
AUTH_GITHUB_ID=''
AUTH_GITHUB_SECRET=''

AUTH_DISCORD_ID=''
AUTH_DISCORD_SECRET=''
# frontend
NEXT_TELEMETRY_DISABLED=1

# Database
RDS_ENGINE="postgres"
RDS_HOST="localhost"
RDS_PORT=5432
RDS_USERNAME="postgres"
RDS_PASSWORD="postgres"
RDS_DBNAME="turbo_lucia_starter"

# Logging
LOG_LEVEL="debug"

# OAuth Providers
GITHUB_CLIENT_ID=""
GITHUB_CLIENT_SECRET=""
DISCORD_CLIENT_ID=""
DISCORD_CLIENT_SECRET=""

# OAuth Mock
OAUTH_MOCK_ENABLED=false
#OAUTH_MOCK_ENDPOINT="http://localhost"
3 changes: 0 additions & 3 deletions .github/FUNDING.yml

This file was deleted.

18 changes: 17 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,24 @@ yarn-error.log*
.vercel

# typescript
*.tsbuildinfo
dist/
.cache

# turbo
.turbo
postgres-data
.env.docker
cdk.out/
infrastructure/rds-setup/cdk.out

**/e2e-*
**/playwright-*
**/results.xml
apps/frontend/junit-report.xml
junit-report.xml
apps/backend/src/sdk/zeus/const.ts
apps/backend/src/sdk/zeus/index.ts
apps/backend/src/sdk/zeus/typedDocumentNode.ts
apps/backend/schema.graphql
apps/backend/src/graphql-env.d.ts
packages/db/.generated/
2 changes: 1 addition & 1 deletion .nvmrc
Original file line number Diff line number Diff line change
@@ -1 +1 @@
20.12
22.11.0
5 changes: 4 additions & 1 deletion .vscode/extensions.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@
"yoavbls.pretty-ts-errors",
"bradlc.vscode-tailwindcss",
"thibault-vanderseypen.i18n-json-editor",
"lokalise.i18n-ally"
"lokalise.i18n-ally",
"vitest.explorer",
"vercel.turbo-vsc",
"ms-playwright.playwright",
]
}
13 changes: 10 additions & 3 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,13 @@
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"eslint.rules.customizations": [{ "rule": "*", "severity": "warn" }],
"eslint.useFlatConfig": true,
"eslint.runtime": "node",
"eslint.workingDirectories": [
{ "pattern": "apps/*/" },
{ "pattern": "packages/*/" },
{ "pattern": "tooling/*/" }
],
"prettier.ignorePath": ".gitignore",
"tailwindCSS.experimental.classRegex": [
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
Expand All @@ -26,7 +27,13 @@
"i18n-ally.editor.preferEditor": true,
"i18n-ally.pathMatcher": "{locale}.json",
"i18n-ally.keystyle": "nested",
"i18n-ally.enabledFrameworks": ["next-international"],
"i18n-ally.enabledFrameworks": ["next-intl", "general"],
"i18n-ally.extract.autoDetect": true,
"i18n-ally.fullReloadOnChanged": true
"i18n-ally.fullReloadOnChanged": true,

"vitest.nodeEnv": {
"npm_lifecycle_event": "test"
},
"i18n-ally.sortKeys": true,
"i18n-ally.translate.fallbackToKey": true
}
4 changes: 2 additions & 2 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
MIT License

Copyright (c) 2023 Julius Marminge
Copyright (c) 2024 Marcus Reinhardt

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand All @@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
SOFTWARE.
170 changes: 73 additions & 97 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,121 +1,97 @@
# t3-turbo-lucia
# Turbo Lucia Starter

> The stack originates from [create-t3-turbo](https://github.com/t3-oss/create-t3-turbo).
## Requirements

## Features
- Node >= 22.11 - https://github.com/nvm-sh/nvm?tab=readme-ov-file#installing-and-updating
- Postgres >= 16 - https://postgresapp.com/
- pnpm >= 9.15.0 - https://pnpm.io/installation

- Monorepo via turborepo
- NextJS 14
- TRPC ( with RSC support )
- Lucia Auth with multi provider support
- i18n support ( with support for i18n-ally )
- tailwind with shadcn-ui
## Getting started

## Installation
1. Clone the repo
2. Open the repo in VSC
3. Install the recommended extensions ( use `@recommended` inside the VSC Extensions search bar )
4. Run `cp .env.example .env` to create a `.env` file
5. Update the `.env` file with your values
6. Run `pnpm install` to install dependencies
7. Run `pnpm db:migrate:dev` to create the tables in the database
8. Run `pnpm dev` to start the app in development mode
9. Start coding

Use Turbo's CLI to init your project (use PNPM as package manager):
## About this template

```bash
npx create-turbo@latest -e https://github.com/noxify/t3-turbo-lucia
```

## About

It uses [Turborepo](https://turborepo.org) and contains:

```text
.vscode
└─ Recommended extensions and settings for VSCode users
apps
└─ next.js
├─ Next.js 14
├─ React 18
├─ Tailwind CSS
└─ E2E Typesafe API Server & Client
packages
├─ api
| └─ tRPC v11 router definition
├─ auth
| └─ Authentication using lucia-auth@v3
├─ db
| └─ Typesafe db calls using Drizzle & postgres
├─ locales
| └─ type-safe internationalization
├─ validators
| └─ shared zod schemas for trpc and forms
└─ ui
└─ Start of a UI package for the webapp using shadcn-ui
tooling
├─ eslint
| └─ shared, fine-grained, eslint presets
├─ prettier
| └─ shared prettier configuration
├─ tailwind
| └─ shared tailwind configuration
└─ typescript
└─ shared tsconfig you can extend from
```
This template was original a copy from [t3-oss/create-t3-turbo](https://github.com/t3-oss/create-t3-turbo).

> In this template, we use `@acme` as a placeholder for package names. As a user, you might want to replace it with your own organization or project name. You can use find-and-replace to change all the instances of `@acme` to something like `@my-company` or `@project-name`.
We just replaced AuthJS with LuciaAuth.

## Quick Start
We're using this template internally and found out that some parts are not needed for a "web" monorepo ( = without expo ).

To get it running, follow the steps below.
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`.

The db is currently configured for `postgres`.
Why? With all the nextjs updates, we think, most usecases don't need the extra layer to get the data.

Feel free to change it.
The template will use nextjs directly to fetch the data. ( https://nextjs.org/docs/app/building-your-application/data-fetching/fetching )

```bash
# Install dependencies
pnpm i
## Project structure

# Configure environment variables
# There is an `.env.example` in the root directory you can use for reference
cp .env.example .env
This project is a monorepo based on turborepo.

# Push the Drizzle schema to the database
pnpm db:push

# Let's get the party stared
pnpm dev
```
├── apps
│ └── frontend - Contains the logic for the site
├── packages
│ ├── auth - Based on lucia-auth.com / same as we have at itaps monorepo
│ ├── 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
```

## i18n

This packages uses [next-international](https://github.com/quiiBz/next-international) for type-safe translations.

This setup is a bit different to the original docs.
We're using `json` files and generating the `ts` files from them.

Why? Using json files allows us to use the vsc extension [`i18n ally`](https://github.com/lokalise/i18n-ally), which makes it a lot easier to manage the translations.

> Note: If you don't need / use the i18n-ally extension, you could simply import the typescript files directly ( without using the json files).
> Unfortunately the i18n-ally doesn't support writing `.ts` files.

**Example:**

Inside a component you write something like `{t('new.translation.key')}`. If you have the vsc extension installed, everything is pre-configured and you only have to hover over the `new.translation.key` and you will see a popover from `i18n ally` which helps you to generate the translations.
## What's currently included?

If you save the translation, it will update the `json` files inside `packages/locales/src/lang`.
- The frontend app is configured to use the latest nextjs version (15.1)
- Auth page is working
- Redirect for unauthorized users to login page
- Empty dashboard ( authorized users only )
- Initial playwright tests exists ( login tests )
- Auth is already configured for Github, Discord
- Supports also mock users
- 18n is configured with `next-intl`

Last step what you have to do is to run `pnpm lang:gen` from your project root to (re-)generate the `ts` files ( which are located in `packages/locales/src/generated` ).
## Helpful commands

> Note: Thanks to dBianchii, he provided a PR which automates the re-generation 🫡
> So, while running `pnpm dev` the `generated/[lang].ts` files are (re-)generated after updating the json files automagically.
- `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-generate
- `pnpm db:migrate` - Runs the drizzle migrate command: https://orm.drizzle.team/docs/drizzle-kit-migrate
- `pnpm db:push` - Runs the drizzle push command: https://orm.drizzle.team/docs/drizzle-kit-push
- `pnpm db:seed` - Seeds some data - Uses the drizzle seed command: https://orm.drizzle.team/docs/seed-overview
- `pnpm db:studio` - Opens the drizzle studio: https://orm.drizzle.team/docs/drizzle-kit-studio

The vsc extension includes also some other features.
## Todos

Visit their [wiki](https://github.com/lokalise/i18n-ally/wiki) to learn more about it.
- [ ] Add unit tests
- [ ] Add more docs ( like how to activate/use mock users )
- [ ] Integrate https://github.com/sadmann7/shadcn-table to have an example
- [ ] Maybe: Adding a RBAC solution ( maybe via casl? )
- [ ] Add a contribution guide

## Credits / Special thanks
## Credits

- https://github.com/shadcn-ui
- https://github.com/juliusmarminge
- https://github.com/dBianchii
- https://github.com/t3-oss
- https://github.com/QuiiBz
- https://github.com/HamedBahram
- https://github.com/lucia-auth
Without the amazing work of the [T3 OSS Community](https://github.com/t3-oss), this project wouldn't exists.

If you like what you see, feel free to support one or all of them via their sponsoring options ( if available ).
Also a big thanks to [dBianchii](https://github.com/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` ).
12 changes: 1 addition & 11 deletions apps/nextjs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,7 @@

This is a [T3 Stack](https://create.t3.gg/) 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](https://t3.gg/discord) and ask for help.

- [Next.js](https://nextjs.org)
- [NextAuth.js](https://next-auth.js.org)
- [Drizzle](https://orm.drizzle.team)
- [Tailwind CSS](https://tailwindcss.com)
- [tRPC](https://trpc.io)
test

## Learn More

Expand Down
25 changes: 0 additions & 25 deletions apps/nextjs/next.config.js

This file was deleted.

Loading
Loading