2026 前後端開發技術統整

import * as z from "zod";
 
const envVariables = z.object({
  DATABASE_URL: z.string(),
  CUSTOM_STUFF: z.string(),
});
 
envVariables.parse(process.env);
 
declare global {
  namespace NodeJS {
    interface ProcessEnv extends z.infer<typeof envVariables> {}
  }
}

import { MigrationInterface, QueryRunner } from "typeorm"

export class PostRefactoringTIMESTAMP implements MigrationInterface {
    async up(queryRunner: QueryRunner): Promise<void> {}

    async down(queryRunner: QueryRunner): Promise<void> {}
}

import { createWebhook, fetch } from "workflow";

export async function validatePaymentMethod(rideId: string) {
  "use workflow";

  const webhook = createWebhook();
  
  // Trigger external payment validation with callback to webhook URL
  await fetch("https://api.example-payments.com/validate-method", {
    method: "POST",
    body: JSON.stringify({ rideId, callback: webhook.url }),
  });

  // Wait for payment provider to confirm via webhook
  const { request } = await webhook;
  const confirmation = await request.json();

  return { rideId, status: confirmation.status };
}

import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
import type { Pokemon } from './types'

// Define a service using a base URL and expected endpoints
export const pokemonApi = createApi({
  reducerPath: 'pokemonApi',
  baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
  endpoints: (build) => ({
    getPokemonByName: build.query<Pokemon, string>({
      query: (name) => `pokemon/${name}`,
    }),
  }),
})

// Export hooks for usage in functional components, which are
// auto-generated based on the defined endpoints
export const { useGetPokemonByNameQuery } = pokemonApi

const useQueryGEOLocation = () => {
  return useQuery({
    queryKey: ["geolocation"],
    queryFn: () => {
      return window.navigator.geolocation.getCurrentPosition(
        (position) => {
          return position.coords;
        },
        (error) => {
          throw error;
        }
      );
    },
  });
};

import { createSlice, configureStore } from '@reduxjs/toolkit'

const countSlice = createSlice({
  name: 'count',
  initialState: { value: 0 },
  reducers: {
    incremented: (state, qty: number) => {
      // Redux Toolkit does not mutate the state, it uses the Immer library
      // behind scenes, allowing us to have something called "draft state".
      state.value += qty
    },
    decremented: (state, qty: number) => {
      state.value -= qty
    },
  },
})

const countStore = configureStore({ reducer: countSlice.reducer })

import dayjs from "dayjs";
import * as z from "zod";

export const UserDetail = z
  .object({
    id: z.string(),
    name: z.string(),
    createdAt: z.string(),
  })
  .transform((value) => ({
    ...value,
    createdAt: dayjs(value.createdAt).toDate(),
  }));

export type UserDetail = z.infer<typeof UserDetail>;

import ky from "ky";

import { UserDetail } from "../pipes/user.pipe";

export const getUserDetail = async (
  id: string,
  options?: BaseQueryOptions
) => {
  const response = await ky.get(`/api/v1/user/${id}`, options).json();
  const result = UserDetail.parse(response);
  return result;
};

FROM node:24-slim AS base

ENV NODE_ENV=production
ENV PNPM_HOME="/pnpm"
ENV PATH="$PNPM_HOME:$PATH"
ENV TURBO_TELEMETRY_DISABLED=1
ENV SKIP_ENV_VALIDATION=1
ENV PORT=8080
ENV HOSTNAME=0.0.0.0

WORKDIR /app

RUN apt-get update && \
    apt-get upgrade -y && \
    apt-get install -y --no-install-recommends \
    python3 make g++ && \
    npm install -g corepack@latest && \
    corepack enable pnpm && \
    rm -rf /var/lib/apt/lists/*

FROM base AS installer

COPY . .
RUN pnpm install --frozen-lockfile --prefer-offline

FROM installer AS builder_staging

RUN cp .env.staging .env.production
RUN NODE_OPTIONS="--max-old-space-size=6144" pnpm build

FROM base AS runner

USER node

COPY --from=builder_staging --chown=node:node /app/package.json ./staging/
COPY --from=builder_staging --chown=node:node /app/public ./staging/public
COPY --from=builder_staging --chown=node:node /app/.next/standalone ./staging/
COPY --from=builder_staging --chown=node:node /app/.next/static ./staging/.next/static
RUN rm -rf ./staging/.env ./staging/.env.*

COPY --from=installer --chown=root:root --chmod=755 /app/builds/docker/docker-entrypoint.sh /docker-entrypoint.sh

CMD ["/docker-entrypoint.sh"]

// @ts-check
window.Config = {
	VITE_APP_SITE_URL: 'http://localhost:3000',
	VITE_APP_APP_ENV: 'staging',
	VITE_APP_APP_VERSION: 'develop',
	VITE_APP_DEFAULT_TIME_ZONE: 'Asia/Taipei',
	VITE_APP_DEFAULT_LOCALE: 'zh-TW',
	VITE_APP_BACKEND_ENDPOINT: 'https://example.com',
};

ARG NODE_VERSION=24

FROM --platform=linux/amd64 node:${NODE_VERSION}-alpine AS base

ENV PNPM_HOME="/pnpm"
ENV PATH="$PNPM_HOME:$PATH"

WORKDIR /usr/src/app

RUN apk update && \
    apk add --no-cache \
    libc6-compat \
    git && \
    corepack enable

FROM base AS build
COPY . .

RUN pnpm install
RUN pnpm build

FROM --platform=linux/amd64 nginx:mainline-alpine

ENV CSP_FRAME_ANCESTORS_HOSTS=http://127.0.0.1

COPY --chown=root:root --chmod=0755 ./scripts/cicd/docker/30-config-mover.sh /docker-entrypoint.d/30-config-mover.sh
COPY --chown=root:root ./scripts/cicd/docker/nginx.conf /etc/nginx/nginx.conf
COPY --chown=root:root ./scripts/cicd/docker/templates/ /etc/nginx/templates
COPY --chown=nginx:nginx --from=build /usr/src/app/dist/ /usr/share/nginx/dist/

#!/usr/bin/env sh

export APP_ENV="${APP_ENV:-beta}"
export APP_IMAGE_VERSION="${APP_IMAGE_VERSION:-develop}"
export CONFIG_SOURCE_FILE="/usr/share/nginx/dist/config.${APP_ENV}.js"
export CONFIG_DEST_FILE="/usr/share/nginx/dist/config.js"
export ROBOTS_TXT_SOURCE_FILE="/usr/share/nginx/dist/robots.${APP_ENV}.txt"
export ROBOTS_TXT_DEST_FILE="/usr/share/nginx/dist/robots.txt"

cd /usr/share/nginx/dist || exit 1

if [ -f "${CONFIG_SOURCE_FILE}" ]; then
    /bin/cp -f "${CONFIG_SOURCE_FILE}" "${CONFIG_DEST_FILE}"
    /bin/sed -i "s/APP_IMAGE_VERSION/${APP_IMAGE_VERSION}/g" "${CONFIG_DEST_FILE}"
    chown nginx:nginx "${CONFIG_DEST_FILE}"
fi

if [ -f "${ROBOTS_TXT_SOURCE_FILE}" ]; then
    /bin/cp -f "${ROBOTS_TXT_SOURCE_FILE}" "${ROBOTS_TXT_DEST_FILE}"
    chown nginx:nginx "${ROBOTS_TXT_DEST_FILE}"
fi