Project Templates

​

Creating a New Project from Template

1. Launch CodinIT and click “New Project” or use Ctrl/Cmd + N
2. Select a template from the available options
3. Configure your project settings (name, location, dependencies)
4. Let AI scaffold your project structure automatically

​

Web Development Templates

React

Modern React app with TypeScript, Vite, and best practices

Next.js

Full-stack Next.js with App Router, TypeScript, and API routes

Vue.js

Vue 3 with Composition API, TypeScript, and Vite

Angular

Angular with TypeScript, standalone components, and signals

​

Backend & API

TypeScript

Express/Fastify REST API with TypeScript

Vite Project

Lightning-fast build tool and dev server

​

Specialized Projects

Remotion

Programmatic video creation with React

SolidJS

Fine-grained reactive UI framework

​

Mobile Development

React-Native

Cross-platform mobile app with Expo

NativeScript

Native mobile apps with JavaScript/TypeScript

​

Meta-Frameworks & Tools

Remix

Full-stack web framework with nested routing

Nuxt.js

Vue meta-framework with SSR and static generation

Astro

Content-focused sites with islands architecture

SvelteKit

Fast, lightweight full-stack Svelte framework

​

AI-Powered Scaffolding

"Create a blog application with user authentication,
post creation, and commenting system"

​

Custom Templates

1. Open Project Settings in an existing project
2. Select “Save as Template”
3. Configure template metadata:
   • Template name
   • Description
   • Category
   • Required dependencies
4. Share with your team or keep it private

​

Template Features

All CodinIT templates come with:

• Best Practice Structure: Industry-standard file organization
• TypeScript Support: Type safety out of the box (when applicable)
• Linting & Formatting: ESLint, Prettier pre-configured
• Git Integration: .gitignore and initial commit ready
• Environment Configuration: .env templates and examples
• Testing Setup: Jest, Vitest, or framework-specific test runners
• Build Optimization: Production-ready build configurations
• Docker Support: Dockerfile and docker-compose when relevant

​

Popular Starter Configurations

MongoDB + Express + React + Node.js
├── client/          # React frontend (Vite + TypeScript)
├── server/          # Express backend (TypeScript)
├── shared/          # Shared types and utilities
├── docker-compose.yml
└── package.json     # Root workspace configuration

​

Serverless Application

AWS Lambda + API Gateway + DynamoDB
├── functions/       # Lambda function handlers
├── lib/            # Shared utilities
├── infrastructure/ # IaC (Terraform/CDK)
├── tests/          # Unit and integration tests
└── serverless.yml  # Serverless Framework config

​

Monorepo Setup

Turborepo or Nx Monorepo
├── apps/
│   ├── web/        # Next.js web app
│   ├── mobile/     # React Native app
│   └── api/        # Backend API
├── packages/
│   ├── ui/         # Shared UI components
│   ├── config/     # Shared configurations
│   └── database/   # Database schema & migrations
└── turbo.json      # Monorepo configuration

​

Next.js Templates

• Marketing Site: SEO-optimized with static generation
• SaaS Application: Authentication, payments, dashboard
• E-commerce: Product catalog, cart, checkout flow
• Blog: MDX blog with sitemap and RSS

​

React Templates

• Admin Dashboard: Charts, tables, forms, authentication
• Landing Page: Marketing page with animations
• PWA: Progressive web app with offline support
• Component Library: Reusable component showcase

​

Best Practices

​

Next Steps