nextjs-frontend-guidelines

Name: nextjs-frontend-guidelines
Availability: InStock
Author: VRINO

Standardize Next.js 15 frontend architecture with server and client component patterns.

1|Updated Mar 19, 2026

Search Tags:#frontend #localization #nextjs #tailwind #shadcn-ui #app-router #server-components

Ready to run

npx skills add https://github.com/eykissvrino/project --skill nextjs-frontend-guidelines-eykissvrino

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: nextjs-frontend-guidelines
Source: https://github.com/eykissvrino/project/tree/main/_core/skills/nextjs-frontend-guidelines
Command: npx skills add https://github.com/eykissvrino/project --skill nextjs-frontend-guidelines-eykissvrino

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This guide standardizes frontend development practices for YGS projects using Next.js 15, App Router, React 19, TypeScript, and Korean localization, reducing ambiguity and onboarding time.

Core Features & Use Cases

Server vs Client Component guidance for optimal performance and interactivity
App Router patterns including file-based routing, data fetching, and route organization
Styling guidance with shadcn/ui, Tailwind CSS 4, and design token consistency
Authentication patterns supporting Firebase, Kakao, and JWT for admin and user flows
Admin dashboard patterns and component organization for scalable maintenance
Korean localization across UI strings and components to deliver a localized experience

Quick Start

Review the resources/ files and implement the documented patterns in your Next.js app.

Frequently Asked Questions about nextjs-frontend-guidelines

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

FAQPage Schema

How do I decide between using server components and client components in Next.js 15?▼

Server components should be used by default for optimal performance, while client components are reserved for interactivity. The guidelines document implementation requirements and example-driven patterns for consistent component decisions.

What is the best way to structure App Router routing and data fetching in Next.js?▼

App Router patterns utilize file-based routing and organized route structures for scalable maintenance. The guidelines provide standardized documentation for data fetching methods and consistent import conventions across your Next.js application.

Does this guide cover styling with shadcn/ui and Tailwind CSS 4?▼

Yes, styling guidance is provided using shadcn/ui and Tailwind CSS 4. The patterns ensure design token consistency across admin dashboards and components for a unified user interface.

How do I implement multi-method authentication with Firebase, Kakao, and JWT in Next.js?▼

Authentication patterns support Firebase, Kakao, and JWT for both admin and user flows. The guidelines document these multi-method implementations to secure your Next.js application architecture.

Can I use these Next.js frontend guidelines for projects requiring Korean localization?▼

Yes, the guidelines standardize Korean localization across UI strings and components. They deliver a localized experience tailored for YGS projects using Next.js 15 and React 19.

What are the limitations of using server components by default for interactive elements?▼

Server components lack client-side interactivity, requiring client components for state and event handling. The guidelines outline when to transition between them to maintain performance without sacrificing functionality.