From 11d347965c7f0d5eae164fc391e04436f2a08ea5 Mon Sep 17 00:00:00 2001 From: Jakub Jablonski Date: Wed, 3 May 2023 19:16:11 +0200 Subject: [PATCH 1/5] chore: add t3-env and zod --- package.json | 4 +++- yarn.lock | 17 +++++++++++++++++ 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 6f8a8e8..f7463fa 100644 --- a/package.json +++ b/package.json @@ -37,13 +37,15 @@ "@radix-ui/react-tabs": "^1.0.3", "@radix-ui/react-toggle-group": "^1.0.3", "@radix-ui/react-tooltip": "^1.0.5", + "@t3-oss/env-nextjs": "^0.2.2", "@vercel/otel": "^0.2.0", "class-variance-authority": "^0.4.0", "lodash": "^4.17.21", "next": "^13.3.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "tailwind-merge": "^1.10.0" + "tailwind-merge": "^1.10.0", + "zod": "^3.21.4" }, "devDependencies": { "@babel/core": "^7.0.0", diff --git a/yarn.lock b/yarn.lock index 478b4cf..a070881 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3549,6 +3549,18 @@ dependencies: tslib "^2.4.0" +"@t3-oss/env-core@0.2.2": + version "0.2.2" + resolved "https://registry.yarnpkg.com/@t3-oss/env-core/-/env-core-0.2.2.tgz#e216ce44d4618d6f69c240efc02bd9e15221035b" + integrity sha512-Jiuph14/L3L9EDaU0O0YiLeaKUcWA9c3mWYuKem8+L64i3Iwz+IbKdl5Jp4cx+JbOsS/aptwGZplnxSHhm2gMQ== + +"@t3-oss/env-nextjs@^0.2.2": + version "0.2.2" + resolved "https://registry.yarnpkg.com/@t3-oss/env-nextjs/-/env-nextjs-0.2.2.tgz#e638e22563cb1782a3c8f5d837caa00714de22a2" + integrity sha512-9LnVpTkf/8WkggyVN6Liz9Ma9a7fLzV00b5BngWj3HI3iWDfddsWaqCf/H0f46Bgu29NubP3Bwajf1JieVrxFA== + dependencies: + "@t3-oss/env-core" "0.2.2" + "@testing-library/dom@^8.3.0": version "8.20.0" resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.20.0.tgz#914aa862cef0f5e89b98cc48e3445c4c921010f6" @@ -12017,3 +12029,8 @@ yocto-queue@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251" integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g== + +zod@^3.21.4: + version "3.21.4" + resolved "https://registry.yarnpkg.com/zod/-/zod-3.21.4.tgz#10882231d992519f0a10b5dd58a38c9dabbb64db" + integrity sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw== From 0742f2037296f51b987439e5b326e56082ccff8c Mon Sep 17 00:00:00 2001 From: Jakub Jablonski Date: Wed, 3 May 2023 19:16:11 +0200 Subject: [PATCH 2/5] refactor: change next config file to mjs --- next.config.js => next.config.mjs | 11 +++++------ tsconfig.json | 2 +- 2 files changed, 6 insertions(+), 7 deletions(-) rename next.config.js => next.config.mjs (59%) diff --git a/next.config.js b/next.config.mjs similarity index 59% rename from next.config.js rename to next.config.mjs index 113fd61..55f6899 100644 --- a/next.config.js +++ b/next.config.mjs @@ -1,13 +1,10 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ -const withBundleAnalyzer = require("@next/bundle-analyzer")({ - enabled: process.env.ANALYZE === "true", -}) -const withPlugins = require("next-compose-plugins") +import withBundleAnalyzer from "@next/bundle-analyzer" +import withPlugins from "next-compose-plugins" /** * @type {import('next').NextConfig} */ -module.exports = withPlugins([[withBundleAnalyzer]], { +const config = withPlugins([[withBundleAnalyzer({ enabled: process.env.ANALYZE === "true" })]], { reactStrictMode: true, experimental: { instrumentationHook: true }, rewrites() { @@ -19,3 +16,5 @@ module.exports = withPlugins([[withBundleAnalyzer]], { ] }, }) + +export default config diff --git a/tsconfig.json b/tsconfig.json index 5d88d20..32b3fdd 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -18,6 +18,6 @@ "incremental": true, "baseUrl": "." }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.mjs"], "exclude": ["node_modules"] } From 9b51b32a433c4fea9aa2feec70ceef2205af0654 Mon Sep 17 00:00:00 2001 From: Jakub Jablonski Date: Wed, 3 May 2023 19:16:12 +0200 Subject: [PATCH 3/5] feat: add env validation --- env.mjs | 15 +++++++++++++++ next.config.mjs | 3 ++- 2 files changed, 17 insertions(+), 1 deletion(-) create mode 100644 env.mjs diff --git a/env.mjs b/env.mjs new file mode 100644 index 0000000..a3adf0e --- /dev/null +++ b/env.mjs @@ -0,0 +1,15 @@ +import { createEnv } from "@t3-oss/env-nextjs" +import { z } from "zod" + +export const env = createEnv({ + server: { + ANALYZE: z + .enum(["true", "false"]) + .optional() + .transform((value) => value === "true"), + }, + client: {}, + runtimeEnv: { + ANALYZE: process.env.ANALYZE, + }, +}) diff --git a/next.config.mjs b/next.config.mjs index 55f6899..72864c7 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,10 +1,11 @@ import withBundleAnalyzer from "@next/bundle-analyzer" import withPlugins from "next-compose-plugins" +import { env } from "./env.mjs" /** * @type {import('next').NextConfig} */ -const config = withPlugins([[withBundleAnalyzer({ enabled: process.env.ANALYZE === "true" })]], { +const config = withPlugins([[withBundleAnalyzer({ enabled: env.ANALYZE })]], { reactStrictMode: true, experimental: { instrumentationHook: true }, rewrites() { From 5348d559b29745b3af7a695cca2253238a133ffb Mon Sep 17 00:00:00 2001 From: Jakub Jablonski Date: Wed, 3 May 2023 19:16:12 +0200 Subject: [PATCH 4/5] docs: add t3 env to readme --- README.md | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/README.md b/README.md index eaba514..ee9a29e 100644 --- a/README.md +++ b/README.md @@ -30,6 +30,7 @@ With this template, you get all the awesomeness you need: - 🤖🧠 **[Automated ChatGPT Code Reviews](https://openai.com/research/chatgpt)** - **Stay on the cutting edge with AI-powered code reviews!** - 💯 **Perfect Lighthouse score** - Because performance matters - 🚢 **[Semantic Release](https://github.com/semantic-release/semantic-release)** - for automatic changelog +- 💻 **[T3 Env](https://env.t3.gg/)** - Manage your environment variables with ease ## Table of Contents @@ -51,6 +52,7 @@ With this template, you get all the awesomeness you need: - [Jotai](#jotai) - [Recoil](#recoil) - [🤖 ChatGPT Code Review](#-chatgpt-code-review) + - [💻 Environment Variables handling](#-environment-variables-handling) - [🤝 Contribution](#-contribution) - [📜 License](#-license) - [Contributors](#contributors) @@ -221,6 +223,14 @@ To use ChatGPT Code Review, add an `OPENAI_API_KEY` environment variable with an ![image](https://user-images.githubusercontent.com/28964599/233685071-e1371edf-6359-41c3-a989-335d6ee09cb7.png) +## 💻 Environment Variables handling + +[T3 Env](https://env.t3.gg/) is a library that provides environmental variables checking at build time, type validation and transforming. It ensures that your application is using the correct environment variables and their values are of the expected type. You’ll never again struggle with runtime errors caused by incorrect environment variable usage. + +```sh + ❌ Invalid environment variables: { ANALYZE: [ 'Required' ] } +``` + ## 🤝 Contribution Contributions are always welcome! To contribute, please follow these steps: From dbb43c5d888a64a8b2d4745187d467fd3089e135 Mon Sep 17 00:00:00 2001 From: Jakub Jablonski Date: Sun, 7 May 2023 22:04:03 +0200 Subject: [PATCH 5/5] docs: add instruction for t3 env to readme --- README.md | 24 +++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index ee9a29e..f39a864 100644 --- a/README.md +++ b/README.md @@ -227,8 +227,30 @@ To use ChatGPT Code Review, add an `OPENAI_API_KEY` environment variable with an [T3 Env](https://env.t3.gg/) is a library that provides environmental variables checking at build time, type validation and transforming. It ensures that your application is using the correct environment variables and their values are of the expected type. You’ll never again struggle with runtime errors caused by incorrect environment variable usage. +Config file is located at `env.mjs`. Simply set your client and server variables and import `env` from any file in your project. + +```ts +export const env = createEnv({ + server: { + // Server variables + SECRET_KEY: z.string(), + }, + client: { + // Client variables + API_URL: z.string().url(), + }, + runtimeEnv: { + // Assign runtime variables + SECRET_KEY: process.env.SECRET_KEY, + API_URL: process.env.NEXT_PUBLIC_API_URL, + }, +}) +``` + +If the required environment variables are not set, you'll get an error message: + ```sh - ❌ Invalid environment variables: { ANALYZE: [ 'Required' ] } + ❌ Invalid environment variables: { SECRET_KEY: [ 'Required' ] } ``` ## 🤝 Contribution