2.7 KiB
Nearle Project Guide
Project
Nearle is a premium hyperlocal commerce platform connecting
- Customers
- Local Merchants
- Delivery Partners
- Brands
The experience should feel:
- Premium
- Modern
- Minimal
- Community-first
- Human
- Trustworthy
Avoid generic SaaS designs.
Tech Stack
- Next.js 16 App Router
- React
- TypeScript
- Tailwind CSS
- MaterialIcon component
IMPORTANT
This project uses the latest Next.js version.
Before changing framework APIs, read
node_modules/next/dist/docs/
Follow the latest conventions.
Design System
Preserve the existing Nearle identity.
Never change unless explicitly requested:
- Brand colors
- Typography
- Border radius
- Layout hierarchy
- Section order
- Existing content
- Existing illustrations
Always extend the current design instead of redesigning it.
UI Rules
Always match existing Nearle pages.
Reuse:
- Hero layouts
- CTA buttons
- Card styles
- Section spacing
- Grid system
- Shadows
- Glass effects
- Gradients
Avoid Bootstrap-style layouts.
Motion Rules
Use:
- Framer Motion
- CSS transitions
Avoid:
- Heavy GSAP
- Layout animations
- Flashy effects
Animation style:
- Apple
- Linear
- Stripe
- Vercel
Use only:
- opacity
- transform
- scale
- translate
Respect prefers-reduced-motion.
Code Rules
Never rewrite files unnecessarily.
Only modify required code.
Preserve formatting.
Do not rename components unless necessary.
Reuse existing components before creating new ones.
Create reusable components when repeated more than twice.
Performance
Maintain 60 FPS.
Avoid unnecessary re-renders.
Avoid layout shift.
Prefer GPU-friendly animations.
Optimize images.
SEO
Every new page should include:
- Metadata
- Title
- Description
- OpenGraph
- Semantic HTML
Content Rules
Write content specifically for Nearle.
Tone:
- Friendly
- Premium
- Community-first
- Local
- Trustworthy
Avoid AI-sounding or generic marketing copy.
Prefer real examples involving:
- neighbourhood stores
- customers
- delivery partners
- local commerce
- digital catalogues
- QR ordering
Execution Rules
Frontend Tasks
- You MAY run npm run dev.
- Inspect localhost before reporting visual fixes.
- Use screenshots only for major UI changes.
Build
- npm run build only verifies compilation.
- Never claim visual fixes based only on build success.
Workflow
Before editing
- Read the target file.
- Understand existing implementation.
- Modify only the required code.
- Avoid unrelated refactoring.
- Keep code production ready.
- Return concise summaries.
Response Rules
Do not explain obvious code.
Do not rewrite unchanged code.
Do not introduce unnecessary abstractions.
Focus only on the requested task.