Hello, laravel developers! in this article, we'll see how to display flag with country name in laravel 10. In this guide, we're going to learn how to create a country list with flags in Laravel.I'll show you step by step how to add a country list with flags to your Laravel project.
You can see a Laravel 10 example of countries with flags. Follow the steps below to create a country list with flags in Laravel.
In this guide, we'll use the stidges/laravel-country-flags composer package to get a list of countries with flags. We'll create a countries table with name and code columns, then add some dummy data to that table and display it.
Laravel 10 Country List with Flags
In this step, we'll install laravel 10 application using the following command.
composer create-project laravel/laravel laravel-10-example
Next, we'll create a model and migration using the following command for country.
php artisan make:model Country -m
Migration:
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('countries', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('code');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('countries');
}
};
app/Models/Country.php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Country extends Model
{
use HasFactory;
}
Then, migrate the table to the database using the following command.
php artisan migrate
Next, we'll install stidges/laravel-country-flags composer package using the following command.
composer require stidges/laravel-country-flags
Then, we'll define the routes into the web.php file
routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\CountryController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('countries', [CountryController::class, 'index']);
Run the following Artisan command to create a new seeder.
php artisan make:seeder CountriesTableSeeder
database/seeders/CountriesTableSeeder.php
<?php
namespace Database\Seeders;
use Illuminate\Database\Seeder;
use Illuminate\Support\Facades\DB;
class CountriesTableSeeder extends Seeder
{
/**
* Run the database seeds.
*
* @return void
*/
public function run()
{
DB::table('countries')->insert([
[
'name' => 'India',
'code' => 'IN',
],
[
'name' => 'United Kingdon',
'code' => 'UK',
],
[
'name' => 'Ireland',
'code' => 'IR',
],
]);
}
}
To run the seeder and insert the dummy records into the countries table, use the following Artisan command.
php artisan db:seed --class=CountriesTableSeeder
Next, we'll create a CountryController.php file and get the list of countries to the blade file.
app/Http/Controllers/CountryController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Country;
class CountryController extends Controller
{
/**
* Write code on Method
*
* @return response()
*/
public function index()
{
$countries = Country::all();
return view('country-list', compact('countries'));
}
}
Then, we'll create country-list.blade.php file and add the following HTML code to that file.
resources/views/country-list.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel 10 Country List with Flags Example - Vidvatek</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h2>Laravel 10 Country List with Flags Example - Vidvatek</h2>
<table class="table table-bordered">
<tr>
<th>Image</th>
<th>Name</th>
</tr>
@foreach ($countries as $country)
<tr>
<td>{{ country_flag($country->code) }}</td>
<td>{{ $country->name }}</td>
</tr>
@endforeach
</table>
</div>
</body>
</html>
Now, run the laravel 10 application using the following command.
php artisan serve
You might also like:
- Read Also: How to Install Sweetalert2 in Laravel 10 Vite
- Read Also: Laravel 10 With Vue JS CRUD Operation
- Read Also: How to Import Excel File into Database using Python
- Read Also: How to Create Multiple Database Connections in Laravel 10