Laravel

Traducción con IA para Laravel con Lingo.dev CLI

¿Qué es Laravel?

Laravel es un framework de aplicaciones web PHP con una sintaxis expresiva y elegante. Proporciona características integradas para enrutamiento, autenticación, sesiones y almacenamiento en caché para construir aplicaciones web modernas.

¿Qué es Lingo.dev CLI?

Lingo.dev es una plataforma de traducción impulsada por IA. El CLI de Lingo.dev lee archivos fuente, envía contenido traducible a modelos de lenguaje avanzados y escribe los archivos traducidos de vuelta a tu proyecto.

Acerca de esta guía

Esta guía explica cómo configurar Lingo.dev CLI en una aplicación Laravel. Aprenderás a crear un proyecto Laravel con soporte de localización, configurar un pipeline de traducción e implementar el cambio de idioma.

Paso 1. Configurar un proyecto Laravel

  1. Instalar PHP y Composer:

    /bin/bash -c "$(curl -fsSL https://php.new/install/mac/8.4)"

  2. Instalar Laravel globalmente:

    composer global require laravel/installer

  3. Crear un nuevo proyecto Laravel:

    laravel new example-app

    Cuando se te solicite:

    • Selecciona "None" para el tipo de proyecto
    • Selecciona "SQLite" para la base de datos

  4. Navega al directorio del proyecto:

    cd example-app

Paso 2. Crear contenido fuente

  1. Publica los archivos de idioma predeterminados de Laravel:

    php artisan lang:publish

    Esto crea un directorio lang/en con archivos de traducción como lang/en/auth.php.

Paso 3. Configurar el CLI

En la raíz del proyecto, crea un archivo i18n.json:

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": 1.8,
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "php": {
      "include": ["lang/[locale]/*.php"]
    }
  }
}

Este archivo define:

  • los archivos que Lingo.dev CLI debe traducir
  • los idiomas entre los que traducir

En este caso, la configuración traduce archivos de idioma PHP del inglés al español.

Es importante destacar que:

  • [locale] es un marcador de posición que se reemplaza en tiempo de ejecución. Asegura que el contenido se lea desde una ubicación (por ejemplo, lang/en/auth.php) y se escriba en una ubicación diferente (por ejemplo, lang/es/auth.php).
  • Lingo.dev CLI traducirá todos los archivos PHP en el directorio de idioma que coincidan con este patrón.

Para obtener más información, consulta configuración de i18n.json.

Paso 4. Traducir el contenido

  1. Regístrate para obtener una cuenta de Lingo.dev.

  2. Inicia sesión en Lingo.dev a través de la CLI:

    npx lingo.dev@latest login

  3. Ejecuta el proceso de traducción:

    npx lingo.dev@latest run

    La CLI creará un directorio lang/es/ para almacenar el contenido traducido y un archivo i18n.lock para realizar un seguimiento de lo que se ha traducido (para evitar retraducciones innecesarias).

Paso 5. Utilizar las traducciones

  1. Crea un middleware para establecer el idioma desde la ruta:

    php artisan make:middleware SetLocaleFromRoute

  2. Actualiza el archivo generado app/Http/Middleware/SetLocaleFromRoute.php:

    <?php
namespace App\Http\Middleware;

use Closure;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\App;
use Symfony\Component\HttpFoundation\Response;

class SetLocaleFromRoute
{
    /**
     * Handle an incoming request.
     *
     * @param  \Closure(\Illuminate\Http\Request): (\Symfony\Component\HttpFoundation\Response)  $next
     */
    public function handle(Request $request, Closure $next): Response
    {
        // 'locale' proviene del parámetro de ruta {locale}
        if ($locale = $request->route('locale')) {
            App::setLocale($locale); // establece el idioma para esta solicitud
        }

        return $next($request);
    }
}

  3. Registra el middleware en bootstrap/app.php:

    <?php

use Illuminate\Foundation\Application;
use Illuminate\Foundation\Configuration\Exceptions;
use Illuminate\Foundation\Configuration\Middleware;
use App\Http\Middleware\SetLocaleFromRoute;

return Application::configure(basePath: dirname(__DIR__))
    ->withRouting(
        web: __DIR__.'/../routes/web.php',
        commands: __DIR__.'/../routes/console.php',
        health: '/up',
    )
    ->withMiddleware(function (Middleware $middleware) {
        $middleware->alias([
            'setLocale' => SetLocaleFromRoute::class,
        ]);
    })
    ->withExceptions(function (Exceptions $exceptions): void {
        //
    })->create();

  4. Configura las rutas con prefijos de idioma en routes/web.php:

    <?php

use Illuminate\Support\Facades\Route;

Route::redirect('/', '/en'); // predeterminado a inglés

Route::prefix('{locale}')
    ->whereIn('locale', ['en', 'es'])
    ->middleware('setLocale')
    ->group(function () {
        Route::get('/', function () {
            return view('welcome');
        })->name('home');
    });

  5. Utiliza la función helper __ para mostrar contenido localizado en tus vistas:

    <!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>{{ config('app.name', 'Laravel') }}</title>
    </head>
    <body>
        <nav>
          <a href="{{ route('home', ['locale' => 'en']) }}" class="underline mr-4">English</a>
          <a href="{{ route('home', ['locale' => 'es']) }}" class="underline">Español</a>
        </nav>

        <p class="mb-6">{{ __('auth.throttle') }}</p>
    </body>
</html>

  6. Inicia el servidor de desarrollo:

    npm install
npm run build
composer run dev

  7. Navega a las siguientes URLs: