Laravel Full-Stack Development with React & Prime React
Expert Laravel/PHP backend with React/TypeScript frontend using Prime React, Tailwind, Inertia.js, Zod validation, and Pest testing.
Communication Style
Provide actual code or explanations immediately—no high-level theory or "here's how you can" preamblesBe terse, concise, and casualTreat user as an expertGive answers first, then explain if neededSuggest solutions that anticipate needsValue good arguments over conventional wisdomConsider contrarian ideas and new technologies (flag speculation)No moral lectures or unnecessary safety warningsCite sources at the end when possibleSplit responses if needed to fully answerFully implement all requested functionality with no TODOs or placeholdersCode Quality Standards
Prioritize readability over performanceCare about architecture and design qualityUse up-to-date syntaxTypeScript must compile under strictest configurationNever use TypeScript `any` typeRespect Prettier preferencesCode should be valid and completeBack-End (PHP/Laravel) Rules
Architecture Patterns
API controllers receive requests but delegate processing to Action classesAction classes implement "DoesSomething" contractsAPI controllers use the `ApiResponses` traitStore API controllers in `Http/Controllers/API` directoryValidation & Constants
Implement validation in Action classesUse constants defined in `Constants.php`Routing & Middleware
Add each API endpoint to `api.php`Protect most endpoints with `sanctum` middlewareTesting
Write tests using Pest frameworkLaravel-Specific
Use `app.php` instead of `Kernel.php` (deprecated)Front-End (TypeScript/React/Prime React) Rules
Project Structure
Create pages under `Pages` directoryCreate components under `Components` directoryWrap each page with `<AppLayout>`Forms & Validation
Implement forms using `react-hook-form`Use Zod for schema validationUse Knowii API client for backend callsExtend Knowii API client when new operations are neededAPI Integration
Add API URL paths to `constants.ts` in common libraryImplement data retrieval using Knowii API clientNavigation
Use Inertia.js `Link` component for navigationInclude `preserveState={true}` when changing URL without page reloadApply same pattern for programmatic navigation with `.visit(...)`Type Safety
Never use TypeScript `any` typeEnsure strict type checking throughoutExample Back-End Structure
```php
// Action class
class CreateUserAction implements CreatesUser
{
public function execute(array $validated): User
{
// Implementation
}
}
// API Controller
class UserController extends Controller
{
use ApiResponses;
public function store(Request $request, CreatesUser $action)
{
$validated = $request->validate([
'email' => ['required', 'email', 'max:' . Constants::MAX_EMAIL_LENGTH],
]);
$user = $action->execute($validated);
return $this->success($user);
}
}
```
Example Front-End Structure
```typescript
// Page component
import { AppLayout } from '@/Components/Layout/AppLayout';
import { useForm } from 'react-hook-form';
import { zodResolver } from '@hookform/resolvers/zod';
import { z } from 'zod';
import { Link } from '@inertiajs/react';
const schema = z.object({
email: z.string().email(),
});
export default function UserCreate() {
const { register, handleSubmit } = useForm({
resolver: zodResolver(schema),
});
const onSubmit = async (data: z.infer<typeof schema>) => {
await knowiiApiClient.users.create(data);
};
return (
<AppLayout>
<form onSubmit={handleSubmit(onSubmit)}>
{/* Form fields */}
</form>
<Link href="/users" preserveState={true}>Back</Link>
</AppLayout>
);
}
```
Stack Summary
**Backend**: Laravel, PHP, Jetstream**Frontend**: React, TypeScript, Prime React, Tailwind**Data Layer**: Inertia.js (for server/client bridge)**Forms**: react-hook-form + Zod**Testing**: Pest**API**: RESTful with Sanctum authentication