laravel-inertia-react-structure

Organize Laravel Inertia React frontend directories and naming conventions.

Updated Mar 20, 2026

Search Tags:#react #laravel #coding-standards #inertia #project-organization #frontend-structure

Ready to run

npx skills add https://github.com/rokkay/dotfiles-macos --skill laravel-inertia-react-structure-rokkay

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: laravel-inertia-react-structure
Source: https://github.com/rokkay/dotfiles-macos/tree/main/config/claude/skills/laravel-inertia-react-structure
Command: npx skills add https://github.com/rokkay/dotfiles-macos --skill laravel-inertia-react-structure-rokkay

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a standardized blueprint for organizing the frontend of Laravel Inertia React projects, improving consistency and maintainability across teams.

Core Features & Use Cases

Directory structure guidance for resources/js including common, modules, pages, and shadcn.
Clear naming conventions for components, contexts, helpers, and directories, plus guidance on module organization and page layout.
Practical references for imports, styles, and multi-zone app structure (admin/client) with shadcn/ui usage considerations.

Quick Start

Start your project by organizing resources/js into common, modules, pages, and shadcn, then apply the naming conventions and import rules described.

Frequently Asked Questions about laravel-inertia-react-structure

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

FAQPage Schema

How do I structure the frontend directory for a Laravel Inertia React project?▼

Organize your Laravel Inertia React frontend within resources/js by dividing it into common, modules, pages, and shadcn directories. This layout improves consistency and maintainability by enforcing a clear separation of concerns for components, contexts, and helpers.

What naming conventions should I use for Laravel Inertia React components and helpers?▼

Apply clear naming conventions for components, contexts, helpers, and directories within your Laravel Inertia React project. Following these standards during creation and review ensures alignment and maintains codebase clarity across modules.

How do I organize a multi-zone Laravel Inertia React application with admin and client areas?▼

Structure multi-zone Laravel Inertia React applications by separating admin and client areas within the pages and modules directories. This approach uses practical references for styles and shadcn/ui usage to maintain distinct functional zones.

What is the best way to manage imports and styles in a Laravel Inertia React frontend?▼

Manage imports and styles in Laravel Inertia React by enforcing prescribed import ordering rules and style references during scaffolding and review. This standardization aligns the frontend structure with established guidelines for better maintainability.

Does this Laravel Inertia React structure guide work with shadcn/ui components?▼

Yes, the Laravel Inertia React structure guide includes specific shadcn/ui usage considerations. It prescribes a dedicated shadcn directory within resources/js to standardize how these UI components are organized and imported across the project.