Skip to main content
Supported tooling
  • Node.js 18+
  • pnpm 8+
  • TypeScript 5
  • Next.js App Router
This page outlines the daily development workflow, quality checks, and debugging tricks for the Lab68 Dev Platform monorepo.

Project scripts

All commands run from the repository root:
pnpm dev        # Start the Next.js development server on port 3000
pnpm build      # Create a production build (type-check + bundle)
pnpm start      # Serve the production build
pnpm lint       # Run ESLint with project rules
Use pnpm test if you add automated tests. The scaffold is ready for Vitest or Jest but no suites ship by default.
  1. Create a feature branch: git checkout -b feature/<topic>
  2. Run pnpm dev and iterate with hot reload.
  3. Keep commits focused on a single feature or fix. Include screenshots or Loom links when editing UI.
  4. Run pnpm lint and pnpm build before pushing to catch TypeScript or layout issues early.
  5. Open a pull request against main and request review from the Lab68 maintainers.

Working with translations

Localization data lives in lib/i18n.ts and supports nine locales by default.
  • Add new keys to the English dictionary first, then extend locale overrides.
  • Run the helper scripts in scripts/ when performing large copy updates:
pnpm ts-node scripts/restore_translations.ts
  • Scripts ensure fallbacks remain intact and encoding issues are fixed automatically.

Theming and design system

The global layout and theme provider are defined in app/layout.tsx.
  • Toggle between dark and light mode using the built-in theme context.
  • Reuse primitives from components/ (e.g., Sidebar, PageHeader, MetricCard) instead of rebuilding layout widgets.
  • Global Tailwind tokens live in styles/.

Debugging tips

  • Use pnpm dev --turbo for faster refresh when sweeping many files.
  • Append NEXT_DEBUG=true in .env.local to surface additional logging from Next.js and API routes.
  • Inspect server logs directly in the terminal running pnpm dev; API route errors include stack traces and context payloads.

Deployment flow

The repository is configured for Vercel. A typical promotion pipeline looks like this:
main push → Vercel build → Preview deployment → Promote to production
  • Configure environment variables for preview and production in the Vercel dashboard.
  • Monitor build logs for ESLint or type errors; the same checks run locally when you execute pnpm build.

Support

Reach the maintainers at dongduong840@gmail.com or file an issue on GitHub.