t3-oss · JohnBakhmat · Jul 30, 2024 · Jul 30, 2024 · Jul 30, 2024 · Jul 30, 2024
@@ -62,8 +62,8 @@ README.md
 ```docker
 ##### DEPENDENCIES
 
-FROM --platform=linux/amd64 node:16-apline3.17 AS deps
-RUN apk add --no-cache libc6-compat openssl1.1-compat
+FROM --platform=linux/amd64 node:20-alpine AS deps
+RUN apk add --no-cache libc6-compat openssl
 WORKDIR /app
 
 # Install Prisma Client - remove if not using Prisma
@@ -75,15 +75,15 @@ COPY prisma ./
 COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml\* ./
 
 RUN \
- if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
- elif [ -f package-lock.json ]; then npm ci; \
- elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && pnpm i; \
- else echo "Lockfile not found." && exit 1; \
- fi
+    if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
+    elif [ -f package-lock.json ]; then npm ci; \
+    elif [ -f pnpm-lock.yaml ]; then npm install -g pnpm && pnpm i; \
+    else echo "Lockfile not found." && exit 1; \
+    fi
 
 ##### BUILDER
 
-FROM --platform=linux/amd64 node:16-apline3.17 AS builder
+FROM --platform=linux/amd64 node:20-alpine AS builder
 ARG DATABASE_URL
 ARG NEXT_PUBLIC_CLIENTVAR
 WORKDIR /app
@@ -93,37 +93,32 @@ COPY . .
 # ENV NEXT_TELEMETRY_DISABLED 1
 
 RUN \
- if [ -f yarn.lock ]; then SKIP_ENV_VALIDATION=1 yarn build; \
- elif [ -f package-lock.json ]; then SKIP_ENV_VALIDATION=1 npm run build; \
- elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && SKIP_ENV_VALIDATION=1 pnpm run build; \
- else echo "Lockfile not found." && exit 1; \
- fi
+    if [ -f yarn.lock ]; then SKIP_ENV_VALIDATION=1 yarn build; \
+    elif [ -f package-lock.json ]; then SKIP_ENV_VALIDATION=1 npm run build; \
+    elif [ -f pnpm-lock.yaml ]; then npm install -g pnpm && SKIP_ENV_VALIDATION=1 pnpm run build; \
+    else echo "Lockfile not found." && exit 1; \
+    fi
 
 ##### RUNNER
 
-FROM --platform=linux/amd64 node:16-apline3.17 AS runner
+FROM --platform=linux/amd64 gcr.io/distroless/nodejs20-debian12 AS runner
 WORKDIR /app
 
 ENV NODE_ENV production
 
 # ENV NEXT_TELEMETRY_DISABLED 1
 
-RUN addgroup --system --gid 1001 nodejs
-RUN adduser --system --uid 1001 nextjs
-
 COPY --from=builder /app/next.config.js ./
 COPY --from=builder /app/public ./public
 COPY --from=builder /app/package.json ./package.json
 
-COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
-COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+COPY --from=builder /app/.next/standalone ./
+COPY --from=builder /app/.next/static ./.next/static
 
-USER nextjs
 EXPOSE 3000
 ENV PORT 3000
 
-CMD ["node", "server.js"]
-
+CMD ["server.js"]
 ```
 
 > **_Заметки_**
@@ -175,10 +170,10 @@ services:
       - DATABASE_URL=database_url_goes_here
 ```
 
-Запустите с помощью команды `docker compose up`:
+Запустите с помощью команды `docker compose up --build`:
 
 ```bash
-docker compose up
+docker compose up --build
 ```
 
 Откройте [localhost:3000](http://localhost:3000/) чтобы увидеть запущенное приложение.

@@ -2,8 +2,12 @@
 title: Netlify
 description: Развертывание в Netlify
 layout: ../../../layouts/docs.astro
+lang: ru
+isMdx: true
 ---
 
+import Callout from "../../../components/docs/callout.tsx";
+
 Netlify это альтернативый провайдер развертывания, похожий на Vercel. Вот [`ajcwebdev/ct3a-netlify`](https://github.com/ajcwebdev/ct3a-netlify) пример репозитория на основе этой документации.
 
 ## Зачем развертывать на Netlify
@@ -14,7 +18,10 @@ Netlify это альтернативый провайдер развертыв
 
 У всех провайдеров развертывания есть преимущества и недостатки, поскольку ни один хост не может иметь лучшую поддержку для всех случаев использования. Например, Netlify разработал свой собственный [пользовательский Next.js runtime](https://github.com/netlify/next-runtime) для Netlify Edge Functions (которые работают на Deno Deploy) и [поддерживают уникальные промежуточные программы для доступа и изменения HTTP-ответов](https://github.com/netlify/next-runtime#nextjs-middleware-on-netlify).
 
-> _Обратите внимание: Для того, чтобы отслеживать статус нестабильных функций Next 13, см. [Использование каталога `app` Next 13 на Netlify](https://github.com/netlify/next-runtime/discussions/1724)._
+
+<Callout type="info">
+  Обратите внимание: Для того, чтобы отслеживать статус нестабильных функций Next 13, см. [Использование каталога `app` Next 13 на Netlify](https://github.com/netlify/next-runtime/discussions/1724).
+</Callout>
 
 ## Конфигурация проекта
 

@@ -14,7 +14,6 @@ lang: ru
 ```json
 {
   "buildCommand": "npm run build",
-  "outputDirectory": "dist",
   "devCommand": "npm run dev",
   "installCommand": "npm install"
 }

@@ -0,0 +1,22 @@
+---
+title: Примеры
+description: Примеры различных приложений
+layout: ../../layouts/docs.astro
+lang: ru
+isMdx: true
+---
+
+import Callout from "../../components/docs/callout.tsx";
+import Form from "../../components/docs/exampleOptionForm.astro";
+
+Вы можете попробовать различные комбинации технологий, которые предоставляет create-t3-app.
+
+<Callout type="info">
+  Вы не можете одновременно выбрать `prisma` и `drizzle`.
+</Callout>
+
+<Form />
+
+<Callout type="warning">
+  Некоторые функции могут не работать, пока вы не создадите файл env.
+</Callout>
@@ -3,8 +3,11 @@ title: FAQ
 description: Часто задаваемые вопросы про Create T3 App
 layout: ../../layouts/docs.astro
 lang: ru
+isMdx: true
 ---
 
+import Callout from "../../components/docs/callout.tsx";
+
 Это некоторые часто задаваемые вопросы о `create-t3-app`.
 
 ## Что дальше? Как я могу создать приложение?
@@ -18,6 +21,11 @@ lang: ru
 - [Prisma](https://prisma.io)
 - [Tailwind CSS](https://tailwindcss.com)
 - [tRPC](https://trpc.io)
+- [Drizzle](https://orm.drizzle.team/docs/overview)
+
+## Как поддерживать мое приложение в актуальном состоянии?
+
+Create T3 App - это инструмент шаблонов, а не фреймворк. Это означает, что как только вы инициализируете приложение, оно ваше. Аналогичного CLI после установки, который поможет вам ставаться в курсе событий, нет. Если вас интересуют улучшения, которые мы вносим в шаблон, вы можете [включить уведомления о релизе](https://docs.github.com/en/account-and-profile/managing-subscriptions-and-notifications-on-github/setting-up-notifications/configuring-notifications#configuring-your-watch-settings-for-an-individual-repository) в нашем репозитории. При этом, на самом деле не обязательно внедрять каждое изменение, которое мы вносим в шаблон, в вашем приложении.
 
 ## Какие учебные ресурсы сейчас доступны?
 
@@ -29,13 +37,16 @@ lang: ru
 
 ### Статьи
 
-- [Build a full stack app with Create T3 App](https://www.nexxel.dev/blog/ct3a-guestbook)
+Некоторые из них могут быть устаревшими.
+
 - [A first look at Create T3 App](https://dev.to/ajcwebdev/a-first-look-at-create-t3-app-1i8f)
 - [Migrating your T3 App into a Turborepo](https://www.jumr.dev/blog/t3-turbo)
 - [Integrating Stripe into your T3 App](https://blog.nickramkissoon.com/posts/integrate-stripe-t3)
 
 ### Видео
 
+- [From 0 to Production - The Modern React Tutorial (RSCs, Next.js, Shadui, Drizzle, TS and more)](https://www.youtube.com/watch?v=d5x0JCZbAJs) **(рекомендуем)** (updated 2024)*
+- [Jack Herrington - Build a Note Taking app with the T3 Stack](https://www.youtube.com/watch?v=J1gzN1SAhyM)
 - [Build a Twitter Clone with the T3 Stack - tRPC, Next.js, Prisma, Tailwind & Zod](https://www.youtube.com/watch?v=nzJsYJPCc80)
 - [Build a Blog With the T3 Stack - tRPC, TypeScript, Next.js, Prisma & Zod](https://www.youtube.com/watch?v=syEWlxVFUrY)
 - [Build a Live Chat Application with the T3 Stack - TypeScript, Tailwind, tRPC](https://www.youtube.com/watch?v=dXRRY37MPuk)
@@ -54,8 +65,12 @@ lang: ru
 
 В тоже время, если вы столкнулись с проблемами при реализации и хотите увидеть проект-образец, у нас есть [ссылка на репозиторий](https://github.com/juliusmarminge/t3-i18n) который показывает как вы можете добавить i18n в T3 App с помощью [next-i18next](https://github.com/i18next/next-i18next).
 
-## Почему мы используем `/pages` а не `/app` из Next.js 13?
+## Стоит ли мне использовать `/app` из Next.js 13 или более развитую парадигму `/pages`?
+
+У вас есть возможность, при инициализации приложения с использованием Create T3 App, выбрать файловую структуру `/app`. В момент написания, эта функция считается достаточно развитой для того, чтобы использовать ее в продакшене сообществом T3 стэка. Для разъяснения, почему нам потребовалось столько времени, чтобы включить эту функцию, посмотрите [это видео](https://www.youtube.com/watch?v=PmBfq-SpzCU).
 
-Согласно [T3-Аксиоме #2](/ru/introduction#bleed-responsibly), мы любим новинки, но ценим стабильность, вам будет сложно перенести весь маршрутизатор, [не лучшеее место для экспериментов](https://youtu.be/mnwUbtieOuI?t=1662). Хотя `/app` [представляет собой взгляд в будущее](https://youtu.be/rnsC-12PVlM?t=818), он еще не готов к использованию в продакшене; API находится в бета-версии и ожидается, что он будет иметь обратно несовместимые изменения.
+Тем не менее, еслы вы строго предпочитаете использовать старую парадигму `/pages`, у вас все еще есть такая возможность. Портировать ваши существующие роутеры может быть коллосальным трудно, поэтому не поддавайтесь давлению и не делайте этого без необходимости.
 
-Список поддерживаемых, запланированных и находящихся в разработке функций в каталоге `/app` можно найти в [бета-документации Next.js](https://beta.nextjs.org/docs/app-directory-roadmap#supported-and-planned-features).
+<Callout type="info">
+  Список поддерживаемых, планируемых и разрабатываемых функций в каталоге `/app` можно найти на странице[beta Next.js docs](https://beta.nextjs.org/docs/app-directory-roadmap#supported-and-planned-features).
+</Callout>
@@ -47,7 +47,7 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 #### `src/pages/api`
 
-Папка `api` содержит все маршруты API приложения Next.js. Файл `examples.ts` (с Prisma) содержит пример маршрута, который использует функцию [Next.js API route](https://nextjs.org/docs/api-routes/introduction) вместе с Prisma. Файл `restricted.ts` (с Next-Auth) содержит пример маршрута, который использует функцию [Next.js API route](https://nextjs.org/docs/api-routes/introduction) и защищен с помошью [NextAuth.js](https://next-auth.js.org/).
+Папка `api` содержит все маршруты API приложения Next.js. Обратите внимание на [Документацию путей Api Next.js](https://nextjs.org/docs/api-routes/introduction) для дополнительной информации о путях api.
 
 </div>
 <div data-components="nextauth">
@@ -64,7 +64,7 @@ import Form from "../../components/docs/folderStructureForm.astro";
 Файл `[trpc].ts` - это точка входа tRPC API. Он используется для обработки запросов tRPC. Смотрите [Использование tRPC](/ru/usage/trpc#-pagesapitrpctrpcts) для получения дополнительной информации об этом файле и [документацию Next.js о динамических маршрутах](https://nextjs.org/docs/routing/dynamic-routes) для получения информации о маршрутах catch-all/slug.
 
 </div>
-<div data-components="trpc prisma nextauth">
+<div data-components="trpc prisma nextauth drizzle">
 
 ### `src/server`
 
@@ -75,7 +75,7 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 #### `src/server/auth.ts`
 
-Содержит утилиты для аутентификации, такие как получение сеанса пользователя на стороне сервера. Смотрите [Использование NextAuth.js](/ru/usage/next-auth#usage-with-trpc) для получения дополнительной информации.
+Главная точка входа для логики server-side аунтентификации. Здесь мы конфигурируем NextAuth.js [настройки](usage/next-auth), проводим [аугментацию модуля](usage/next-auth#inclusion-of-userid-on-the-session), а так же предоставляем некоторые DX утилиты для аутентификации, например: получение пользовательской сессии на стороне сервера. Смотрите [Использование NextAuth.js](/ru/usage/next-auth#usage-with-trpc) для получения дополнительной информации.
 
 </div>
 <div data-components="prisma">
@@ -84,6 +84,27 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 Файл `db.ts` используется для создания клиента Prisma на глобальном уровне. Смотрите [Использование Prisma](/ru/usage/prisma#prisma-client) и [лучшие практики по использованию Prisma с Next.js](https://www.prisma.io/docs/guides/database/troubleshooting-orm/help-articles/nextjs-prisma-client-dev-practices) для получения дополнительной информации.
 
+</div>
+<div data-components="drizzle">
+
+### `src/server/db`
+
+Папка `db` содержит клиент и схему Drizzle. Заметьте, что drizzle нуждается в файле `drizzle.config.ts` (смотрите ниже).
+
+</div>
+<div data-components="drizzle">
+
+#### `src/server/db/index.ts`
+
+Файл `index.ts` используется для создания клиента Drizzle на глобальном уровне. Смотрите [Использование Drizzle](usage/drizzle#drizzle-client) и [лучшие практики использования Drizzle с Next.js](https://www.prisma.io/docs/guides/database/troubleshooting-orm/help-articles/nextjs-prisma-client-dev-practices) для получения дополнительной информации.
+
+</div>
+<div data-components="drizzle">
+
+#### `src/server/db/schema.ts`
+
+Файл `schema.ts` используется для описания схемы базы данных. Смотрите [Использование Drizzle](usage/drizzle#drizzle-client) и [лучшие практики использования Drizzle с Next.js](https://www.prisma.io/docs/guides/database/troubleshooting-orm/help-articles/nextjs-prisma-client-dev-practices) для получения дополнительной информации.
+
 </div>
 <div data-components="trpc">
 
@@ -132,20 +153,6 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 Папка `styles` содержит глобальные стили приложения.
 
-</div>
-<div data-components="nextauth">
-
-### `src/types`
-
-Папка `types` используется для хранения повторно используемых типов или объявлений типов.
-
-</div>
-<div data-components="nextauth">
-
-#### `src/types/next-auth.d.ts`
-
-Файл `next-auth.d.ts` используется для расширения типа сеанса по умолчанию NextAuth на включение идентификатора пользователя. Смотрите [Использование NextAuth.js](/ru/usage/next-auth#включение-userid-в-сеанс) для получения дополнительной информации.
-
 </div>
 <div data-components="trpc">
 
@@ -181,6 +188,20 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 Файл `.eslintrc.cjs` используется для настройки ESLint. Смотрите [документацию ESLint](https://eslint.org/docs/latest/user-guide/configuring/configuration-files) для получения дополнительной информации.
 
+</div>
+<div data-components="drizzle">
+
+### `db.sqlite (sqlite only)`
+
+Файл `db.sqlite` содержит вашу базу данных разработки. Этот файт создается только после запуска `db:push` и игнорируется git.
+
+</div>
+<div data-components="drizzle">
+
+### `drizzle.config.ts`
+
+Файл `drizzle.config.ts` используется для конфигурации drizzle kit. Смотрите [документацию](https://orm.drizzle.team/kit-docs/config-reference) для получения дополнительной информации.
+
 </div>
 <div>
 
@@ -209,6 +230,13 @@ import Form from "../../components/docs/folderStructureForm.astro";
 
 Файл `prettier.config.mjs` используется для настройки Prettier для включения prettier-plugin-tailwindcss для форматирования классов Tailwind CSS. Смотрите [пост блога Tailwind CSS](https://tailwindcss.com/blog/automatic-class-sorting-with-prettier) для получения дополнительной информации.
 
+</div>
+<div data-components="drizzle">
+
+### `start-database.sh (mysql or postgres only)`
+
+Файл `start-database.sh` используется для запуска базы данных. Пожалуйста, обратите внимание на коментарии внутри файла для получения дополнительной информации про запуск базы данных вашей операционной системой.
+
 </div>
 <div>