Setup
Install, run, and build NA-AI Landing locally after purchase.
Run NA-AI Landing locallyLink to section
After purchase, you receive a ZIP package containing the full source code and documentation.
The template is designed to work:
- as a standalone project
- outside the private PyColors monorepo
- after ZIP download
- on Vercel
- in production environments
Go from ZIP download to running app quickly.
One-time payment · Instant access after purchase
Core idea
The template should be runnable, inspectable, and customizable without requiring access to the private PyColors monorepo.
RequirementsLink to section
| Tool | Recommended |
|---|---|
| Node.js | 20+ |
| Package manager | pnpm |
| Framework | Next.js 16+ |
| Deployment | Vercel |
Quick startLink to section
Unzip the packageLink to section
unzip na-ai-landing.zip
cd na-ai-landingInstall dependenciesLink to section
pnpm installBuild for productionLink to section
pnpm buildStart the production serverLink to section
pnpm startIncluded setup foundationsLink to section
Standalone structure
Production-ready frontend stack
Frontend-only setup
Deployment-ready baseline
ScriptsLink to section
| Command | Purpose |
|---|---|
pnpm install | Install project dependencies |
pnpm dev | Run the local development server |
pnpm build | Build for production |
pnpm start | Start the production server |
Environment variablesLink to section
NA-AI Landing is frontend-only by design.
It does not require environment variables for:
- authentication
- database
- Stripe
- CMS
You can add your own variables later if you connect:
- APIs
- forms
- analytics
- backend services
Frontend-only
No backend configuration is required to run the base template.
Verify PyColors packagesLink to section
NA-AI Landing uses the public PyColors packages:
@pycolors/ui
@pycolors/tokensThe global stylesheet imports the shared token package:
@import "@pycolors/tokens/tokens.css";
@import "tailwindcss";Tailwind CSS v4 also scans the installed UI package:
@source "../../node_modules/@pycolors/ui";Setup checklistLink to section
Confirm working setup
- dependencies install successfully
- local server starts
- homepage renders correctly
- dark and light mode work properly
- production build passes
Avoid early changes
- deleting data files before reading them
- changing token imports too early
- rewriting layouts before updating copy
- adding backend logic inside section components
- removing SEO assets before replacing them
Recommended workflowLink to section
A high-leverage setup path usually looks like this:
- install dependencies
- run the template locally
- validate production build
- update branding and copy
- customize data files
- connect APIs only if needed
- deploy publicly
This reduces unnecessary complexity early in the project lifecycle.
Architecture rule
Landing page sections should stay presentational. Put API wiring, form handling, and service integration in dedicated modules.