Blog

In this tutorial we’re only focussing on localization, so I won’t go over the installation of Laravel and I assume that you already have a working Laravel project.
We are going to implement localization in 5 simple steps.

Step 1. Provide a language route

In the routes/web.php file you can find all the routes for your project, so we will also put our language route in this file.
I prefer to also put my language function in the route, by doing this we don’t need to have a LanguageController for this simple task.

Route::get('lang/{locale}', function ($locale) {
    session()->put('locale', $locale);
    return redirect()->back();
});

In this function we’re setting the locale in our App and also providing a locale variable to our session that we’re going to use in the next step.

Step 2. Provide a Localization Middleware

In order to create this new Middleware we’ll run the following command in our terminal.

php artisan make:middleware Localization

Once this middleware is created by Artisan, we can find it in the app/Http/Middleware folder. To complete this middleware we’ll need to make some small changes to it, in order to get the behaviour we want. For starters we need to make sure it uses our App. this can be done by adding use App to it. We also need to make sure it sets the correct language. This can be done by setting the App locale value to what we have stored in our session.
The final result of this file should look like this.

namespace App\Http\Middleware;

use Closure;
use App;

class Localization
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    { 
        if (session()->has('locale')) {
            App::setLocale(session()->get('locale'));
        }
        return $next($request);
    }
}

Step 3. Register our Localization Middleware

In order to make the application use our newly created Localization Middleware we need to add it to the middelwaregroup. In the app/Http/Kernel.php file we need to add our Middleware class to the middlewareGroups.

The contents should then by like this.

    
    protected $middlewareGroups = [
        'web' => [
            \App\Http\Middleware\EncryptCookies::class,
            \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
            \Illuminate\Session\Middleware\StartSession::class,
            // \Illuminate\Session\Middleware\AuthenticateSession::class,
            \Illuminate\View\Middleware\ShareErrorsFromSession::class,
            \App\Http\Middleware\VerifyCsrfToken::class,
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
            \App\Http\Middleware\Localization::class,
        ],

        'api' => [
            'throttle:60,1',
            'bindings',
        ],
    ];

Step 4. Create language files

In the resources/lang folder there is a standard en folder, containing a few language files.
In this example we’re going to add our own language file to it called “customlang” and provide the following content to it.

return [

    /*
    |--------------------------------------------------------------------------
    | Custom Language Lines
    |--------------------------------------------------------------------------
    */

    'welcome' => 'Welcome',
    'chooselang' => 'Choose your language',

];

Now we can just make copy of the en folder and translate all content in it to a preferred language.
For example

return [

    /*
    |--------------------------------------------------------------------------
    | Custom Language Lines
    |--------------------------------------------------------------------------
    */

    'welcome' => 'Welkom',
    'chooselang' => 'Kies uw taal',

];

Step 5. Setup the view

Now we’re able to use these custom translations in our views.
For example:

<div class="content">
    <div class="title m-b-md">
        {{__('customlang.welcome')}}
    </div>
    <p>{{__('customlang.chooselang')}}</p>
    <div class="links">
        <a href="lang/en">EN</a>
        <a href="lang/nl">NL</a>
    </div>
</div>

Bonus

To add some extra flavour to it we can make use of a variable in our language file.
For example, we can add a username to our welcome message:

'welcome' => 'Welcome :user !',

To make use of this we need to update our view as follows:

<div class="content">
    <div class="title m-b-md">
        {{__('customlang.welcome', [ 'user' => 'Bert'])}}
    </div>
    <p>{{__('customlang.chooselang')}}</p>
    <div class="links">
        <a href="lang/en">EN</a>
        <a href="lang/nl">NL</a>
    </div>
</div>

While I was browsing codepen.io for some vue.js examples I stumbled onto this.
screenshot well aimed quiz
Go ahead and test your CSS Skills!

Check out the quiz on Codepen

I turned 29!

The time of year I hate the most, because I absolutely don’t like aging.
But we can’t change the fact, I turned 29.
We went for a weekend to the ardennes. Where I tested our new Drone, the DJI Mavic 2 Pro.

301 Redirects are permanent redirections, so it redirects a certain URL to another one.

When we use them?

  • When the website url changes for the same content. For example http://www.website.tld/oldpage -> http://www.website.tld/newpage
  • When the main url of a website changes. For example http://www.oldwebsite.tld/page -> http://www.newwebsite.tld/page

Why we use them?

  • In order to keep the links that were already indexed by search engines.
  • To keep customers on your website when the url changes.

How to use them

301 redirects are added to the .htaccess file on an Apache server.

Redirect 301 [old page url] [new page url]

For pages:

Redirect 301 /oldpage.html https://www.url.tld/newpage.html
Redirect 301 /oldpage2.html https://www.url.tld/newpage2.html
Redirect 301 /oldpage3.html https://www.url.tld/newpage3.html

For an entire website:

Redirect 301 / https://www.newurl.tld