code-templates

Bootstrap authentication, UI components, and layout scaffolding for Next.js and Supabase projects.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/johunsang/kreatsaas --skill code-templates-johunsang
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: code-templates
Source: https://github.com/johunsang/kreatsaas/tree/main/.claude-plugin/skills/code-templates
Command: npx skills add https://github.com/johunsang/kreatsaas --skill code-templates-johunsang

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides ready-to-use code templates to implement authentication, UI components, and layout for a Next.js + Supabase stack, eliminating boilerplate and setup time.

Core Features & Use Cases

  • Authentication scaffolding for sign-up, sign-in, and session management with Supabase.
  • Reusable UI components and a cohesive layout to ensure visual consistency across pages.
  • Use Case: Kick off a SaaS admin panel in minutes by wiring up auth flows and a polished UI.

Quick Start

  • Initialize your project with the templates, supply your Supabase keys, and run the dev server to see authentication and UI components in action.
  • Replace placeholders with your real project details and adapt routes and components to fit your app structure.
  • Extend components and pages following the examples to tailor the templates to your needs while keeping environment setup intact.

Frequently Asked Questions about code-templates

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up Supabase authentication in a Next.js app?

You can scaffold Supabase authentication in Next.js by initializing the project with provided code templates, supplying your Supabase keys, and running the dev server to activate sign-up, sign-in, and session management flows immediately.

What is the fastest way to scaffold a SaaS UI layout with Next.js and Supabase?

Scaffolding a SaaS UI layout is fastest using modular code templates that provide reusable UI components and cohesive layout structures. This eliminates boilerplate setup, ensuring visual consistency across pages while enforcing TypeScript types and Next.js routing patterns.

Can I use these code templates for an existing Next.js project?

Yes, you can integrate these code templates into an existing Next.js project by replacing placeholders with your real project details. You adapt the provided routes and components to fit your app structure while maintaining the Supabase environment setup.

Do I need TypeScript to implement Supabase auth flows with these templates?

Yes, TypeScript is required as the templates enforce a modular codebase with TypeScript types. This ensures type safety across Supabase client and server integration patterns, Next.js routing, and UI components throughout your application scaffold.

How do I customize UI components after generating the Next.js layout scaffold?

You customize UI components after generating the scaffold by extending the provided pages and components following the established examples. This tailors the templates to your specific needs while maintaining the cohesive layout and Supabase environment configuration.