raheesahmed/sajicode/fullstack-app-generator

Claude Code and agent skill by raheesahmed/sajicode

Trust tier 3
  • community
Source check pending

Checking that the SKILL.md file is still in the repository.

Generate complete, production-ready full-stack applications from a single prompt. Scaffolds projects with the right framework, database schema, API layer, frontend components, authentication, and deployment config. Covers Vite + React, Next.js, Express + React, static sites, and monorepo setups. Use when building a new application from scratch or scaffolding a major feature.

Install

npx vskill@latest install raheesahmed/sajicode/fullstack-app-generator

SKILL.md

Full-Stack Application Generator

Framework Selection Matrix

RequirementRecommended Stack
Static site / landing pageVite + React (or plain HTML/CSS/JS)
SaaS with auth + dashboardNext.js + Prisma + NextAuth
API-only backendExpress/Fastify + Prisma
Real-time app (chat, collab)Next.js + WebSocket + Redis
Mobile + WebNext.js (web) + React Native (mobile)
CLI toolNode.js + Commander/Yargs
PrototypingVite + React + JSON file/SQLite

Application Architecture Blueprint

Full-Stack App (Next.js)
project/
├── src/
│ ├── app/ # Next.js App Router
│ │ ├── layout.tsx # Root layout (fonts, providers)
│ │ ├── page.tsx # Home page
│ │ ├── globals.css # Design system
│ │ ├── (auth)/ # Auth routes
│ │ │ ├── login/page.tsx
│ │ │ └── register/page.tsx
│ │ ├── dashboard/ # Protected routes
│ │ │ ├── layout.tsx # Dashboard shell
│ │ │ └── page.tsx
│ │ └── api/ # API routes (webhooks only)
│ │ └── webhooks/route.ts
│ ├── components/
│ │ ├── ui/ # shadcn/ui components
│ │ ├── layout/ # Header, Sidebar, Footer
│ │ └── features/ # Feature-specific components
│ ├── lib/
│ │ ├── db.ts # Prisma client singleton
│ │ ├── auth.ts # Auth helpers
│ │ └── utils.ts # cn() and shared utils
│ ├── actions/ # Server Actions
│ │ ├── auth.ts
│ │ └── [feature].ts
│ └── types/ # Shared type definitions
│ └── index.ts
├── prisma/
│ └── schema.prisma # Database schema
├── public/ # Static assets
├── .env.example
├── .env.local
├── package.json
├── tsconfig.json
├── next.config.ts
└── README.md
API Backend (Express)
project/
├── src/
│ ├── routes/ # Route handlers
│ ├── middleware/ # Auth, validation, errors
│ ├── services/ # Business logic
│ ├── repositories/ # Data access
│ ├── models/ # Types and schemas
│ ├── lib/ # Config, clients, utils
│ ├── jobs/ # Background processors
│ └── index.ts # Server bootstrap
├── prisma/
│ └── schema.prisma
├── tests/
├── Dockerfile
├── docker-compose.yml
├── .env.example
└── package.json

Generation Workflow

Step 1: Analyze Requirements
Parse user prompt to determine:
- What type of app (SaaS, blog, e-commerce, dashboard, API)
- What data models are needed
- What user flows exist
- What authentication is required
- What third-party integrations are needed
Step 2: Scaffold Foundation
1. Initialize project with framework CLI
2. Install core dependencies
3. Set up TypeScript configuration
4. Create design system (globals.css with tokens)
5. Set up database schema
6. Configure environment variables
Step 3: Build Data Layer
1. Design Prisma schema with all models and relations
2. Generate initial migration
3. Create database client singleton
4. Implement repository functions for each model
Step 4: Build API / Server Actions
1. Create Zod schemas for all inputs
2. Implement server actions or API routes
3. Add validation middleware
4. Add error handling
5. Add authentication checks
Step 5: Build UI
1. Create root layout with fonts, theme, metadata
2. Build reusable components (Header, Sidebar, Footer)
3. Create page layouts for each route
4. Implement forms with validation
5. Add loading and error states
6. Polish with animations and micro-interactions
Step 6: Finalize
1. Add SEO metadata to all pages
2. Create .env.example with all required variables
3. Add README with setup instructions
4. Create Dockerfile if deployment target needs it
5. Test complete user flow

Auth Pattern (NextAuth.js)

ts
import NextAuth from "next-auth";
import { PrismaAdapter } from "@auth/prisma-adapter";
import GitHub from "next-auth/providers/github";
import Google from "next-auth/providers/google";
import Credentials from "next-auth/providers/credentials";
import { prisma } from "@/lib/db";
import bcrypt from "bcrypt";
export const { handlers, auth, signIn, signOut } = NextAuth({
adapter: PrismaAdapter(prisma),
providers: [
GitHub({ clientId: process.env.GITHUB_ID!, clientSecret: process.env.GITHUB_SECRET! }),
Google({ clientId: process.env.GOOGLE_ID!, clientSecret: process.env.GOOGLE_SECRET! }),
Credentials({
async authorize(credentials) {
const user = await prisma.user.findUnique({ where: { email: credentials.email as string } });
if (!user?.passwordHash) return null;
const valid = await bcrypt.compare(credentials.password as string, user.passwordHash);
return valid ? user : null;
},
}),
],
session: { strategy: "jwt" },
pages: { signIn: "/login", error: "/login" },
});

Quality Checklist

  • [ ] All pages have proper metadata and SEO
  • [ ] Authentication protects all required routes
  • [ ] All forms have client-side and server-side validation
  • [ ] Error boundaries on all dynamic content
  • [ ] Loading states for all async operations
  • [ ] Responsive design tested at mobile/tablet/desktop
  • [ ] Dark mode support
  • [ ] Accessible (keyboard nav, screen reader, contrast)
  • [ ] .env.example documents ALL required env vars
  • [ ] README has complete setup instructions

Security

  • Security scanPassed, 95 of 100Pattern checks on the skill's files.
  • Model reviewPassed

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

Source

Popularity

Repository stars
62
Repository forks
14
7-day trend score
21

Stars and forks are for the whole GitHub repository, not this skill alone. Refreshed 18 Mar 2026, 7 months ago.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/raheesahmed/sajicode/fullstack-app-generator/badge)](https://verified-skill.com/skills/raheesahmed/sajicode/fullstack-app-generator)

Something wrong with this skill or its page? Tell us.