Blog tag

#Alpine.js

10 posts tagged with Alpine.js.

December 14, 20253 min read

From Clutter to Clarity: How We Built a Reusable Dropdown System in a Legacy PHP App

How extracting a chaotic set of action buttons into a reusable dropdown component brought consistency and scalability to a legacy PHP app.

LaravelAlpine.jsLegacy CodeUI RefactoringComponent Design

February 22, 20255 min read

From Click to Conversion: How We Engineered the Dropoff Button for Speed and Clarity

How we built a high-conversion 'Order Dropoff' button using Alpine.js and Tailwind, integrated into AustinsElite’s Laravel 12 frontend.

frontenduxalpine.jstailwindlaravelecommerce

January 27, 20254 min read

How I Used Alpine.js and CSS Gradients to Modernize a Legacy Homepage in Laravel

Upgraded AustinsElite's stale homepage with Alpine.js and CSS gradients—lightweight, impactful frontend modernization without rewriting everything.

LaravelAlpine.jsCSSFrontend OptimizationLegacy Modernization

January 12, 20254 min read

From Blade to React: How We Migrated a Legacy Services Section to Next.js with Alpine.js for State

Migrating AustinsElite’s services section from Laravel Livewire/Blade to Laravel 12 using Alpine.js for lightweight interactivity and Tailwind-powered animations.

Alpine.jsLaravelfrontend migrationTailwind CSSLivewireHybrid Architecture

December 6, 20244 min read

Ensuring Reliable PDF Downloads in Hybrid Next.js + Livewire Apps with Alpine.js Delays

A 100ms Alpine.js delay fixed a race condition between Livewire actions and session updates during PDF downloads.

LivewireAlpine.jsRace ConditionFrontend OptimizationLaravelHybrid Architecture

September 21, 20244 min read

Animating Call-to-Actions: Building a Hiring Banner with Alpine.js and Blade in Laravel 12

How I added a performant, animated hiring banner to AustinsElite using Alpine.js and Blade—without heavy frameworks.

Alpine.jsLaravelBladeanimationsfrontendperformance

August 16, 20244 min read

How We Enabled Early Form Submissions in a Multi-Step Quote Request with React and Alpine.js

We let users submit a multi-step quote form early without sacrificing data integrity—here’s how we pulled it off with React and Alpine.js.

ReactAlpine.jsLaravelform optimizationuser experience

August 14, 20244 min read

Why We Replaced Flash Messages with a Dedicated Thank-You Page in Laravel

We replaced unreliable flash messages with a redirect-based thank-you page to improve form feedback in our Laravel 12 app.

LaravelLivewireform designUXAlpine.jsuser feedback

June 27, 20244 min read

How We Solved a Sticky Header Transition Loop in Next.js with Scroll Threshold Logic

Fixed a flickering sticky header in Next.js by replacing naive scroll checks with a threshold-based debounce pattern.

Alpine.jsScroll EventsUI BugsFrontend Debugging

June 11, 20244 min read

How We Fixed Form Validation and Data Binding in a Multi-Step Laravel Rental Quote Form

We untangled a broken multi-step rental form by fixing field mappings, syncing state, and ensuring reliable data flow to email handlers.

LaravelLivewireAlpine.jsform validationstate managementemail integration