Does it handle authentication patterns?

Yes, it includes standardized patterns for cookie-based authentication via API middleware and AppContext providers.

How does this skill manage application state?

It implements Redux Toolkit for state management combined with redux-saga for handling asynchronous side effects.

Does it provide testing configurations?

The skill supports standardizing both unit tests using Jest and end-to-end testing via Playwright.

What version of Next.js does this skill support?

This skill is specifically optimized for Next.js 12.x running on React 17.

Is it compatible with internal component libraries?

Yes, it includes specific configurations for @violet/shared-components and workflows for AWS CodeArtifact.

Next.js Architecture & Conventions

Name: Next.js Architecture & Conventions
Author: violetio

byvioletio

0•

Developer Tools

Standardizes Next.js development patterns for the Violet ecosystem using TypeScript, Redux, and specialized routing structures.

This skill provides Claude with the specific architectural guidelines and implementation patterns required for the VioletDashboard and Connect projects. It automates the application of Next.js 12.x conventions, including nested dynamic routing, middleware-enhanced API routes, and complex state management with Redux Toolkit and redux-saga. It is particularly useful for developers maintaining consistency across Violet's frontend stack, ensuring seamless integration with internal component libraries and AWS CodeArtifact dependencies.

Key Features

01Manages internal package dependencies and AWS CodeArtifact login workflows

02Configures API routes with standardized authentication and validation middleware pipelines

03Enforces state management patterns using Redux Toolkit and typed hooks

040 GitHub stars

05Implements nested dynamic routing patterns for platform and merchant migration modes

06Provides boilerplate for React 17 components with SCSS modules and Jest testing

Use Cases

01Creating secure API endpoints with standardized middleware for cookie validation and auth

02Implementing complex frontend state transitions using project-specific Redux-Saga patterns

03Generating new e-commerce platform integration pages following the specific directory structure

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add violetio/violet-ai-plugins nextjs

For use in Claude.ai and ChatGPT

Download Skill