Skip to content

Installation

john-it-com/bc-ui-presentation is a private PHP package hosted on packagist.com. It can be installed using composer.

Composer

To install the package add the private john-it-com packagist repository to the composer.json of your project:

    "repositories": [
        {
            "type": "composer",
            "url": "https://repo.packagist.com/john-it-com/",
            "canonical": false
        },
    ],

Also the authentication data for the private packagist repository must be added to your composer configuration at ~/.config/composer/auth.json:

{
    "http-basic": {
        "repo.packagist.com": {
            "username": "johnit",
            "password": "SEE PASSWORD MANAGER"
        }
    }
}

Next you can install the package using the following command:

composer require john-it-com/bc-ui-presentation

Vendor files

This package includes several configuration files which need to be published:

php artisan vendor:publish --provider="JohnIt\Bc\Ui\Presentation\PackageServiceProvider"

The package includes some Javascript and CSS assets which need to be published to the public-folder of your main application. To publish those assets execute the following command:

php artisan vendor:publish --tag=public --force

These assets should also be commited.

To keep the assets up-to-date and avoid issues in future updates, you may add the vendor:publish --tag=public --force command to the post-update-cmd scripts in your application’s composer.json file. This will autopmatically execute artisan vendor:publish command on composer updates:

{
    "scripts": {
        "post-update-cmd": [
             "@php artisan vendor:publish --tag=public --force"
        ]
    }
}

Database migrations

Nothing to be done here.

Pusher

This package uses Pusher for broadcasting. Please create a Pusher account and a Pusher channel for your application. Inside your .env file make shure to add the following configuration:

BROADCAST_DRIVER=pusher
PUSHER_APP_ID=<your-pusher-app-id>
PUSHER_APP_KEY=<your-pusher-app-key>
PUSHER_APP_SECRET=<your-pusher-app-secret>
PUSHER_APP_CLUSTER=eu

MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

Javascript

This package contains some Javascript components which need access to the following environment variables:

  • MIX_PUSHER_APP_KEY
  • MIX_PUSHER_APP_CLUSTER

All environment variables inside your .env file which are prefixed with MIX_ are made available to your main projects webpack.mix.js inside of the process.env variable (see documentation).

To make the environment variables inside process.env available to the components of this package you need to copy them into the global window.env variable.

All components assume, that the required environment variables are present inside of the global window.env variable. To achieve this go into your main project and add the following code to your app.js:

window.env = {
    MIX_PUSHER_APP_KEY: process.env.MIX_PUSHER_APP_KEY,
    MIX_PUSHER_APP_CLUSTER: process.env.MIX_PUSHER_APP_CLUSTER
};

Then recompile your Javascript assets.