Building Mobile Apps with NativePHP v3 and Laravel

Prerequisites

To get started, you should have a solid grasp of the Laravel framework and basic terminal usage. Familiarity with Tailwind CSS is highly recommended since your web project must be mobile-responsive before conversion. While older versions required Xcode or Android Studio, the new version allows you to skip these entirely for initial development and testing.

Key Libraries & Tools

• NativePHP Mobile v3: The core framework that wraps Laravel for mobile devices.
• Jump App: A specialized mobile bridge that allows you to preview your app instantly without compiling full binaries.
• SQLite: The default on-device database used for local storage.
• Livewire: A full-stack framework for Laravel that handles dynamic UI updates without writing complex JavaScript.

Code Walkthrough

Installation and Deployment

First, pull the package into your existing Laravel project. No extensive configuration files are necessary for the initial jump.

composer require nativephp/mobile:^3.0
php artisan native:jump

When you run the native:jump command, the system builds your assets, creates a ZIP archive, and generates a QR code. Scanning this code with the Jump App on your phone (provided both are on the same Wi-Fi) launches the app locally.

Local Database Management

Because mobile apps often lack constant internet, data should live in SQLite. In NativePHP, migrations take center stage for data seeding because typical seeders don't run automatically on the device.

public function up(): void
{
    Schema::create('quizzes', function (Blueprint $table) {
        $table->id();
        $table->string('title');
        $table->timestamps();
    });

    // Seed data directly in the migration for mobile persistence
    DB::table('quizzes')->insert([
        ['title' => 'Laravel Basics'],
        ['title' => 'NativePHP Advanced'],
    ]);
}

Syntax Notes

• Viewport Management: Ensure your app.blade.php includes proper viewport meta tags with initial-scale=1 to prevent zooming issues.
• Utility-First Layouts: Use Tailwind CSS classes like w-full, min-h-screen, and generous padding (px-6, py-5) to ensure touch targets are accessible for mobile users.

Practical Examples

This setup is ideal for local-first applications like quiz apps, offline calculators, or internal company tools that need to function without a persistent API connection. By using SQLite within migrations, you ensure every user starts with the necessary datasets pre-loaded on their device.

Tips & Gotchas

One common pitfall is attempting to use MySQL or PostgreSQL. NativePHP enforces SQLite usage for security, preventing developers from accidentally hardcoding sensitive database credentials into a distributed mobile binary. Additionally, always ensure your testing device and development machine share the same Wi-Fi network, or the Jump App will fail to download the bundle.