README

This package provide commons view components you usually use in your laravel project.

Installation

You can install the package via composer:

composer require mawuekom/laravel-custom-view-components

Usage

Once install, go to config/app.php to add CustomponentsServiceProvider in providers array

Laravel 5.5 and up Uses package auto discovery feature, no need to edit the config/app.php file.

Service Provider

'providers' => [

    ...

    Mawuekom\Customponents\CustomponentsServiceProvider::class,

],

Publish Assets

php artisan vendor:publish --provider="Mawuekom\Customponents\CustomponentsServiceProvider"

Or you can publish config

php artisan vendor:publish --provider="Mawuekom\Customponents\CustomponentsServiceProvider" --tag="config"

Configuration

There are many configurable options which have been extended to be able to configured via .env file variables.
See config file: customponents.php.

<?php

return [

    /**
     * App Name should be set here
     */

    'app_name' => env('APP_NAME', 'My Laravel Project'),

    /*
    |--------------------------------------------------------------------------
    | Bunch of features to enable or disable.
    |--------------------------------------------------------------------------
    */

    'enable' => [
        'app_style_sheet'   => true,
        'app_script'        => true,
    ],
];

Once all this is done, you can go in your welcome.blade.php and add the code below...

<x-customponents::partials.headers title="Page Title" description="Page Description" section="" />

<div>
    <h1>My Laravel Website</h1>
    <hr>
    <p>
        Some content here
    </p>
</div>

<x-customponents::partials.footers />

The section parameter is here to help you when you want to define different views or section for a guest or logged user.

If you want you add some assets like style sheets and scripts links in your webpage, don't be worry.

It's very simple.

This package is provided with a view component helper called Section which can help you include section of your project in another section.

Take a look at headers.blade.php component source code.

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <x-customponents::partials.seo-tags title="{{ $title }}" description="{{ $description }}" section="{{ $section }}" />
        @yield('styles')
    </head>
    <body @yield('body_attributes')>

You will see a classic blade directive : @yield('styles')

You can then use this like that...

<x-customponents-section name="styles">
    your content goes here
</x-customponents-section>

So to include assets links in your webpage, just do it like that

<x-customponents::partials.headers title="Page Title" description="Page Description" section="" />
    <x-customponents-section name="styles">
        <link rel="stylesheet" href="css/app.css">
    </x-customponents-section>
</x-customponents::partials.headers>

<div>
    <h1>My Laravel Website</h1>
    <hr>
    <p> Some content here </p>
</div>

<x-customponents::partials.footers>
    <x-customponents-section name="scripts">
        <script src="js/app.js"></script>
    </x-customponents-section>
</x-customponents::partials.footers>

It is nice, isn't it !!! 🙂😉

On top of that, you also a components assets.blade.php which you can use to add assets links in your page just like that :

<x-customponents::resources.assets type="css" path="css/app.css" />

Then, your page could look like that...

<x-customponents::partials.headers title="Page Title" description="Page Description" section="" />
    <x-customponents-section name="styles">
        <x-customponents::resources.assets type="css" path="css/app.css" />
    </x-customponents-section>
</x-customponents::partials.headers>

<div>
    <h1>My Laravel Website</h1>
    <hr>
    <p> Some content here </p>
</div>

<x-customponents::partials.footers>
    <x-customponents-section name="scripts">
        <x-customponents::resources.assets type="js" path="js/app.js" />
    </x-customponents-section>
</x-customponents::partials.footers>

Layout

There is a master.blade.php layout that can simplify your welcome.blade.php :

<x-customponents::layouts.master title="Page Title" description="Page Description" section="">

    <x-customponents-section name="lyt_master_styles">
        // Your style sheet goes here.
    </x-customponents-section>

    <div>
        <h1>My Laravel Website</h1>
        <hr>
        <p> Some content here </p>
    </div>

    <x-customponents-section name="lyt_master_scripts">
        // Your script files goes here.
    </x-customponents-section>

</x-customponents::layouts.master>

Enjoy 🙂😉👌🔥

Testing

composer test

Changelog

Please see CHANGELOG for more information what has changed recently.

Contributing

Please see CONTRIBUTING for details.

License

The MIT License (MIT). Please see License File for more information.

mawuekom / laravel-custom-view-components

Maintainers

Details