There comes a time when you want to use environmental variables in your Blade components. But, how do you do it? There are a couple of different ways. We’ll take a look at the env() function first and then the directive itself.

https://www.dinocajic.com/laravel-p64-rendering-jason-in-blade/

Using the env() function

Let’s open our .env file and take a look at some of the variables that are already defined there.

APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:X2mYdNpqK29Z21Fb9Dx6PDa6Jwd6k4ThXuP+VYd9dco=
APP_DEBUG=true
APP_URL=http://laravel-tutorials.test

LOG_CHANNEL=stack
LOG_DEPRECATIONS_CHANNEL=null
LOG_LEVEL=debug

DB_CONNECTION=mysql
DB_HOST=mysql
DB_PORT=3306
DB_DATABASE=laravel_tutorials
DB_USERNAME=sail
DB_PASSWORD=password

We can access any of those variables with our env() function. Create a new Blade file and a route to access it.

 

Route::get('/env-test', function () {
    return view('env-test.index');
});

Inside of your blade file, let’s see if we can display any of those variables.

<h1>Environmental Variable Test</h1>

<ul>
    <li>Application Environment: {{ env('APP_ENV') }}</li>
    <li>Application URL: {{ env('APP_URL') }}</li>
    <li>Database Host: {{ env('DB_HOST') }}</li>
</ul>

We can even define our own environmental variables in the .env file. For example, let’s say you define an environmental variable called DEVELOPER_EMAIL with the value dino@example.com.

In your Blade component, you can access the DEVELOPER_EMAIL environmental variable using the env() function like this:

<div>
    To report an issue, contact: {{ env('DEVELOPER_EMAIL') }}
</div>

When you view the Blade component, it will display the value of the DEVELOPER_EMAIL environmental variable, which in this case would be dino@example.com.

The env() function can be used to access any environmental variable from the .env file.

@env directive

There exists an environmental directive in Blade, but it’s different than the env() function. You can use environment directives to conditionally include or exclude code in Blade components based on the current environment (i.e. local, staging, production). It’s just a short way to check the APP_ENV variable.

For example,

@env('local')
    We're in the local environment
@endenv

@env('staging')
    We're in the staging environment
@endenv

@env('production')
    We're in the production environment
@endenv

Since our APP_ENV is set to local, it will display the content inside of the local conditional.

For production environments, we also get the @production directive.

@production
    We're in production
@endproduction

If you start changing the .env variables, you will have to restart your dev environment. For me it’s as simple as restarting the Docker container.