fix: paths

.env-sample

@@ -2,25 +2,30 @@ SPOTIFY_CLIENT_ID=
 SPOTIFY_CLIENT_SECRET=
 SPOTIFY_REFRESH_TOKEN=
 
-GA_TRACKING_ID=
-
-NEXT_PUBLIC_TWITTER_USERNAME=
-NEXT_PUBLIC_LINKEDIN_USERNAME=
-NEXT_PUBLIC_GITHUB_USERNAME=
+SENDGRID_API_KEY=
+EMAIL=
 
-NEXT_PUBLIC_ALGOLIA_APP_ID=
-NEXT_PUBLIC_ALGOLIA_SEARCH_KEY=
+KV_REST_API_URL=
+KV_REST_API_TOKEN=
+KV_REST_API_READ_ONLY_TOKEN=
+KV_URL=
 
 ALGOLIA_APP_ID=
-ALGOLIA_API_KEY=
 ALGOLIA_UPDATE_API_KEY=
 
-NEXT_PUBLIC_URL=
-
 MAILER_LITE_API_KEY=
+MAILER_LITE_GROUP_ID=
 
-SENDGRID_API_KEY=
-EMAIL=
 
-NEXT_PUBLIC_SUPABASE_URL=
-NEXT_PUBLIC_SUPABASE_API_KEY=
+NEXT_PUBLIC_TWITTER_USERNAME=
+NEXT_PUBLIC_FACEBOOK_USERNAME=
+NEXT_PUBLIC_LINKEDIN_USERNAME=
+NEXT_PUBLIC_GITHUB_USERNAME=
+NEXT_PUBLIC_EMAIL=
+
+NEXT_PUBLIC_GA_TRACKING_ID=
+
+NEXT_PUBLIC_ALGOLIA_APP_ID=
+NEXT_PUBLIC_ALGOLIA_SEARCH_KEY=
+
+NEXT_PUBLIC_HOST=localhost:3000

.github/workflows/nextjs_bundle_analysis.yml

@@ -43,7 +43,7 @@ jobs:
           key: ${{ runner.os }}-build-${{ env.cache-name }}
 
       - name: Build next.js app
-        run: ./node_modules/.bin/next build
+        run: SKIP_ENV_VALIDATION=1 ./node_modules/.bin/next build
 
       - name: Analyze bundle
         run: npx -p nextjs-bundle-analysis report

components/mdx/Mdx.tsx

@@ -5,7 +5,7 @@ import advancedFormat from "dayjs/plugin/advancedFormat";
 import customParseFormat from "dayjs/plugin/customParseFormat";
 import { motion } from "framer-motion";
 import NextImage from "next/image";
-import { MDXRemote, MDXRemoteSerializeResult, MDXRemoteProps } from "next-mdx-remote";
+import { MDXRemote, MDXRemoteSerializeResult } from "next-mdx-remote";
 import { memo, useRef, useEffect, useCallback, useMemo } from "react";
 import { renderToString } from "react-dom/server";
 
@@ -22,11 +22,11 @@ import { Quote } from "components/mdx/quote/Quote";
 import { Sandbox } from "components/mdx/sandbox/Sandbox";
 import { Share } from "components/mdx/share/Share";
 import { resourceRoutes } from "data/routes";
-import { env } from "env/client";
 import { useRunningHeader } from "hooks/useRunningHeader";
 import { useTheme } from "providers/ThemeProvider";
 import Arrow from "public/svg/right-top-arrow.svg";
 import { RESOURCE_TYPE, type Resource } from "types";
+import { HOST } from "utils/consts";
 import { getHeadings, normalizeViewsCount } from "utils/functions";
 
 import styles from "./mdx.module.scss";
@@ -54,7 +54,7 @@ interface HeadingComponentProps {
 export const Mdx = memo<MdxProps>(({ resource, content, views }) => {
   const contentElRef = useRef<HTMLDivElement | null>(null);
   const { id, setRunningHeader } = useRunningHeader();
-  const url = `${env.NEXT_PUBLIC_URL}/${resourceRoutes[resource.type]}/${resource.slug}`;
+  const url = `${HOST}/${resourceRoutes[resource.type]}/${resource.slug}`;
   const { theme } = useTheme();
 
   const getHeadingProps = useCallback(
@@ -90,7 +90,7 @@ export const Mdx = memo<MdxProps>(({ resource, content, views }) => {
         Sandbox: ({ id }: { id: string }) => <Sandbox id={id} theme={theme as "light" | "dark"} />,
         pre: Pre,
         ...CustomPostsComponents,
-      } as MDXRemoteProps["components"]),
+      } as unknown as Record<string, React.ReactNode>),
     [theme, getHeadingProps],
   );
 

env/schema.ts

@@ -14,7 +14,6 @@ export const serverSchema = z.object({
   KV_REST_API_URL: z.string().url(),
 
   ALGOLIA_APP_ID: z.string(),
-  ALGOLIA_API_KEY: z.string(),
   ALGOLIA_UPDATE_API_KEY: z.string(),
 
   MAILER_LITE_API_KEY: z.string(),
@@ -31,9 +30,8 @@ export const clientSchema = z.object({
   NEXT_PUBLIC_ALGOLIA_APP_ID: z.string(),
   NEXT_PUBLIC_ALGOLIA_SEARCH_KEY: z.string(),
 
-  NEXT_PUBLIC_URL: z.string().url(),
-  NEXT_PUBLIC_HOST: z.string().url().optional(),
-  NEXT_PUBLIC_VERCEL_URL: z.string().url().optional(),
+  NEXT_PUBLIC_HOST: z.string().optional(),
+  NEXT_PUBLIC_VERCEL_URL: z.string().optional(),
 
   NEXT_PUBLIC_GA_TRACKING_ID: z.string(),
 });
@@ -54,7 +52,8 @@ export const clientEnv = {
   NEXT_PUBLIC_ALGOLIA_APP_ID: process.env.NEXT_PUBLIC_ALGOLIA_APP_ID,
   NEXT_PUBLIC_ALGOLIA_SEARCH_KEY: process.env.NEXT_PUBLIC_ALGOLIA_SEARCH_KEY,
 
-  NEXT_PUBLIC_URL: process.env.NEXT_PUBLIC_URL,
+  NEXT_PUBLIC_HOST: process.env.NEXT_PUBLIC_HOST,
+  NEXT_PUBLIC_VERCEL_URL: process.env.NEXT_PUBLIC_VERCEL_URL,
 
   NEXT_PUBLIC_GA_TRACKING_ID: process.env.NEXT_PUBLIC_GA_TRACKING_ID,
 };

scripts/feed.ts

@@ -5,27 +5,27 @@ import dayjs from "dayjs";
 import { Feed } from "feed";
 
 import { getPublishedPosts } from "../lib/posts";
-import { SITE_TITLE, DEFAULT_DESCRIPTION, ORIGIN } from "../utils/consts";
+import { SITE_TITLE, DEFAULT_DESCRIPTION, HOST } from "../utils/consts";
 
 function run() {
   const posts = getPublishedPosts();
   const feed = new Feed({
     title: SITE_TITLE,
-    link: ORIGIN,
-    id: ORIGIN,
+    link: HOST,
+    id: HOST,
     description: DEFAULT_DESCRIPTION,
-    image: `${ORIGIN}/regular-android-icon-192x192.png`,
-    favicon: `${ORIGIN}/favicon.ico`,
+    image: `${HOST}/regular-android-icon-192x192.png`,
+    favicon: `${HOST}/favicon.ico`,
     copyright: `${new Date().getFullYear()} ${SITE_TITLE}`,
     updated: new Date(),
     generator: SITE_TITLE,
     feedLinks: {
-      rss: `${ORIGIN}/feed`,
+      rss: `${HOST}/feed`,
     },
     language: "en",
     author: {
       name: SITE_TITLE,
-      link: ORIGIN,
+      link: HOST,
     },
   });
 
@@ -34,8 +34,8 @@ function run() {
       title,
       id: slug,
       description: excerpt,
-      link: `${ORIGIN}/blog/${slug}`,
-      image: `${ORIGIN}/${image}`,
+      link: `${HOST}/blog/${slug}`,
+      image: `${HOST}/${image}`,
       author: [{ name: author }],
       date: new Date(dayjs(publishedAt, "DD-MM-YYYY").format("MM-DD-YYYY")),
     });

scripts/next.config.mjs

@@ -0,0 +1,84 @@
+/* eslint-disable @typescript-eslint/no-unsafe-call */
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+/* eslint-disable @typescript-eslint/no-unsafe-return */
+
+import withPlaiceholder from "@plaiceholder/next";
+import pwa from "next-pwa";
+
+const withPWA = pwa({
+  dest: "public",
+  disable: process.env.NODE_ENV === "development",
+});
+
+/**
+ * @type {import('next').NextConfig}
+ **/
+const nextConfig = {
+  experimental: {
+    serverActions: true,
+    esmExternals: "loose",
+  },
+  reactStrictMode: true,
+  webpack(config) {
+    config.module.rules.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    });
+
+    return config;
+  },
+  images: {
+    domains: ["i.scdn.co"],
+  },
+  rewrites() {
+    return Promise.resolve([
+      {
+        source: "/feed",
+        destination: "/feed.xml",
+      },
+    ]);
+  },
+  redirects() {
+    return Promise.resolve([
+      {
+        source: "/new-post",
+        destination: "/blog/learning-programming",
+        permanent: false,
+      },
+      {
+        source: "/new",
+        destination: "/blog/learning-programming",
+        permanent: false,
+      },
+      {
+        source: "/newest-post",
+        destination: "/blog/learning-programming",
+        permanent: false,
+      },
+      {
+        source: "/twitter",
+        destination: `https://twitter.com/${process.env.NEXT_PUBLIC_TWITTER_USERNAME ?? ""}`,
+        permanent: true,
+      },
+      {
+        source: "/linkedin",
+        destination: `https://www.linkedin.com/in/${
+          process.env.NEXT_PUBLIC_LINKEDIN_USERNAME ?? ""
+        }`,
+        permanent: true,
+      },
+      {
+        source: "/github",
+        destination: `https://github.com/${process.env.NEXT_PUBLIC_GITHUB_USERNAME ?? ""}`,
+        permanent: true,
+      },
+      {
+        source: "/gumroad",
+        destination: `https://zagrodzki.gumroad.com/`,
+        permanent: true,
+      },
+    ]);
+  },
+};
+
+export default withPWA(withPlaiceholder(nextConfig));

scripts/redirect.ts

@@ -8,11 +8,11 @@ function run() {
 
   if (!post) return;
 
-  const nextConfig = fs.readFileSync(path.join(__dirname, "next.config.mjs"), "utf8");
+  const nextConfig = fs.readFileSync(path.join(__dirname, "../next.config.mjs"), "utf8");
 
   const nextConfigWithNewPostRedirect = nextConfig.replace(/THE_NEWEST_POST_SLUG_HERE/g, post.slug);
 
-  fs.writeFileSync(path.join(__dirname, "next.config.mjs"), nextConfigWithNewPostRedirect);
+  fs.writeFileSync(path.join(__dirname, "../next.config.mjs"), nextConfigWithNewPostRedirect);
 }
 
 run();