PROD-README.md

[PROJECT]

Setup:

The usual process for Next.js based apps/websites:

1. Install node modules:

   $ pnpm i

2. Get the .env variables from Vercel (check .env.template), after installing Vercel CLI:

   $ vc link

   $ vc env pull

3. run development environment:

   $ pnpm dev

Stack:

• Lenis
• Tempus
• Hamo
• PNPM
• Next.js
• Three.js
• @react-three/drei
• @react-three/fiber
• GSAP
• Sass (Modules)
• Zustand
• GraphQL (CMS API)
• @svgr/webpack (SVG Imports in next.config.js)

Code Style & Linting:

• Eslint (Next and Prettier plugins)
• Prettier with the following settings available in .pretierrc:

  {
    "endOfLine": "auto",
    "semi": false,
    "singleQuote": true
  }

• Lefthook

Third Party (optional tools):

• Storyblok CMS
• Mailchimp CRM
• Hubspot CRM
• Vercel (Hosting & Continuous Deployment)
• GitHub Versioning

Folder Structure:

Alongside the usual Next.js App Router folder structure (/public, /app, etc.) We've added a few other folders to keep the code easier to read:

• /components: Reusable components with their respective Sass file
• /docs: Readmes on how to use third party tools at darkroom
• /hooks: Reusable Custom Hooks
• /libs: Reusable Scripts and State Storing, hubspot integration, sass utils, etc.
• /styles: Global styles and Sass partials