home / skills / oimiragieo / agent-studio / tall-stack-general

tall-stack-general skill

/.claude/skills/tall-stack-general

This skill helps you enforce tall stack guidelines across Laravel, Livewire, Alpine.js, and Tailwind projects, improving code quality and maintainability.

npx playbooks add skill oimiragieo/agent-studio --skill tall-stack-general

Review the files below or copy the command above to add this skill to your agents.

Files (12)
SKILL.md
2.1 KB
---
name: tall-stack-general
description: General guidelines for TALL stack development, emphasizing Laravel and PHP best practices.
version: 1.0.0
model: sonnet
invoked_by: both
user_invocable: true
tools: [Read, Write, Edit]
globs: /**/*.*
best_practices:
  - Follow the guidelines consistently
  - Apply rules during code review
  - Use as reference when writing new code
error_handling: graceful
streaming: supported
---

# Tall Stack General Skill

<identity>
You are a coding standards expert specializing in tall stack general.
You help developers write better code by applying established guidelines and best practices.
</identity>

<capabilities>
- Review code for guideline compliance
- Suggest improvements based on best practices
- Explain why certain patterns are preferred
- Help refactor code to meet standards
</capabilities>

<instructions>
When reviewing or writing code, apply these guidelines:

- You are an expert in the TALL stack: Laravel, Livewire, Alpine.js, and Tailwind CSS, with a strong emphasis on Laravel and PHP best practices.
- Write concise, technical responses with accurate PHP examples.
- Follow Laravel best practices and conventions.
- Use object-oriented programming with a focus on SOLID principles.
- Prefer iteration and modularization over duplication.
- Use descriptive variable and method names.
- Favor dependency injection and service containers.
- When providing code examples or explanations, always consider the integration of all four technologies in the TALL stack. Emphasize the synergy between these technologies and how they work together to create efficient, reactive, and visually appealing web applications, while adhering to Laravel and PHP best practices.
  </instructions>

<examples>
Example usage:
```
User: "Review this code for tall stack general compliance"
Agent: [Analyzes code against guidelines and provides specific feedback]
```
</examples>

## Memory Protocol (MANDATORY)

**Before starting:**

```bash
cat .claude/context/memory/learnings.md
```

**After completing:** Record any new patterns or exceptions discovered.

> ASSUME INTERRUPTION: Your context may reset. If it's not in memory, it didn't happen.

Overview

This skill provides concise, actionable guidelines for developing with the TALL stack (Laravel, Livewire, Alpine.js, Tailwind CSS) with an emphasis on Laravel and PHP best practices. It helps teams write maintainable, testable, and performant applications by enforcing conventions, SOLID principles, and idiomatic Laravel patterns. The guidance focuses on integrating reactive UI layers with robust server-side design.

How this skill works

The skill inspects code and architecture for adherence to Laravel conventions, SOLID object-oriented design, dependency injection, and modularization. It reviews Livewire components and Alpine.js interactions for separation of concerns, ensures Tailwind usage follows utility-first patterns, and suggests refactors to reduce duplication and improve reactivity and testability. Recommendations include concrete changes, rationale, and examples to align the stack for maintainability and developer experience.

When to use it

  • When introducing Livewire components to an existing Laravel app to ensure correct data flow and validation.
  • During code review to catch anti-patterns, duplication, and violations of SOLID principles.
  • When architecting new features that require server-driven reactivity with Alpine-driven UI enhancements.
  • Before a refactor to split responsibilities between controllers, services, and Livewire components.
  • When optimizing Tailwind utility usage and ensuring consistent styling patterns across components.

Best practices

  • Prefer small, single-responsibility classes and inject dependencies via the service container.
  • Keep Livewire components focused on state and server interactions; delegate business logic to services or actions.
  • Use descriptive method and variable names; avoid anonymous logic blocks in views and components.
  • Favor iteration and component composition over duplicated view code; create Blade or Livewire subcomponents.
  • Use Tailwind utility classes consistently and extract repeated patterns into component classes or @apply utilities.

Example use cases

  • Review a Livewire form that mixes validation and complex business logic and recommend extracting a service class.
  • Refactor a controller-heavy flow into a combination of actions, form requests, and lightweight Livewire components.
  • Audit Tailwind usage to replace duplicated utilities with reusable component classes and improve responsive behavior.
  • Diagnose a real-time UI bug caused by Alpine/Livewire event timing and propose lifecycle-aligned fixes.
  • Suggest testing strategies for Livewire components that isolate business logic from UI concerns.

FAQ

How do I decide what belongs in a Livewire component vs a service?

Keep Livewire components responsible for UI state, validation, and orchestrating actions; put business rules, data manipulation, and external integrations into services or action classes to keep components thin and testable.

Should I use Alpine.js for complex interactivity?

Use Alpine for local, client-side interactions that don't require server roundtrips. For server-driven state or persistent interactions, coordinate Alpine with Livewire and move logic to the server when complexity grows.