Thanks for joining me!

Good company in a journey makes the way seem shorter. — Izaak Walton

Why switch from Xampp to Docker, for PHP developers, my experience.

For the uninitiated, LAMP stands for:

• Linux
• Apache (OR Nginx , in that case it become LEMP stack).
• Mysql, MariaDB
• PHP, Perl or Python

Many LAMP developer prefer using XAMPP or MAMPP to setup a quick development environment. Some developers even prefer installing the stack directly on their linux machines, These are great and convenient approaches for most cases.

However, there are few issue that I have faced after using these:

• Switching PHP version between 5.5 , 5.6 or 7.1, 7.2 or 7.3 can get messy at times, when using XAMPP.
• Similarly MySql upgrade can have issues, when updating version.
• If not done correctly you can end up with multiple XAMPP setups.
• Adding extensions like ssh2/gnupg..etc in different version of XAMPP/PHP can become a tedious task.
• Directly installing LAMP on your Linux machine can open another can of worms, if not done correctly. Since there is not isolation between your Linux system and LAMP setup.

As a beginner , I have myself had to format my Linux system many a times, to solve partitions issues or broken Dependencies.

Docker to the rescue...

What is Docker ?

Simply said, Docker is a Containerization Software, that runs on the Docker Engine, This make it easier to create, deploy, and run applications by using containers.

Well then, What are Containers?

A container is a standard unit of software that packages up code and all its dependencies so the application runs quickly and reliably from one computing environment to another.

Well Docker is much more that this, and one of the leading technologies in the market place now, well there are lots of great articles out there on more advance topics. But with context to this Post, am just explaining few basic advantages of Docker.

How can Docker help LAMP developers?

• You can consider Docker as an isolated Container, where all process run in a sort of Sandbox.
• This isolation is the a great advantage for developers. You can setup something and if you make a mistake, no big deal you can destroy the Container and restart in few seconds.
• Docker is Cross-platform, it can run on Linux, Mac or Windows.
• You can replicate your exact production environment locally, if done correctly.
• You can find official PHP images for Docker right from php 5.6 all the way up to latest PHP releases.
• Switching PHP version OR adding extensions is streamlined & can be done via the Dockerfile.
• There are Docker image available for almost everything from PHP to Mongodb, Couchdb, Redis, Solr ..and many more..
• Integration & installation of these services is effortless.
• Docker image are immutable, meaning: the images are readonly and can be reused multiple times, in different setups.

Conclusion :

LAMP development is come a long way since Xampp, and Docker is a tool that will take it in to the future. Docker containerization is a vast & interesting topic, using it to setup a local environment will just be the tip of the iceberg.

This post is a simple Tutorial on how to setup a LAMP stack using docker-compose.

If you have already installed docker & docker-compose, you can ignore the below step.

$ sudo apt-get update $ sudo apt-get install docker-ce

else follow instructions here

This LEMP stack uses: NGINX latest alpine MYSQL 5.6.40 PHP 7.1-fpm-alpine mailhog (local mailing service) adminer (database admin) traefik (load balancer) portainer (to debug docker)

We are using alpine image for this tutorial as they are small & compact in size. Alternatively you can also use PHP 5.6-fpm-alpine image.

Assuming that you have cloned this repository. Now navigate to the repository directory, and run below listed commands.

$ sudo docker build .

On first executing the build command it will down load all the specified docker images. Then it will execute commands specified in the Dockerfile, for each image.

$ sudo docker-compose up -d

The docker-compose up command will start all the containers mentioned in the docker compose file in the detached mode, hence the -d. If all goes well, all the containers should be running now. You can verify this usin the below command.

$ sudo docker-compose ps

This will display status of all the container either in up OR exit state.

$ sudo docker exec -it lampdock_nginx /bin/sh

Above command can be used to attach to a running container (like a local bash). Alternatively you can change container name, to connect to other running containers.

//ToDo : add folder structure.

Further Reading & References links:

• how-to-install-more-php-extensions.
• tips-for-deploying-nginx-official-image-with-docker.
• dockerise-your-php-application-with-nginx-and-php7-fpm.
• common mysql error.
• setup custom php ini file.
• laravel-docker-part-1-setup-for-development.

This post is mostly intended for docker beginners. Now, Getting straight to the point. In most use cases PHP is never us as a standalone container but is always used along with any/all elementals of the LAMP or LEMP stack.

Docker has its own mechanism known as docker-compose that is very helpful in running multiple containers as a single stack. All the services that make up your app/stack have to be placed in docker-compose.yml along with other required configurations like Environment variable, synced files, container names, ports. The next important file related to configs is the Dockerfile, where you can run almost any linux command to build your custom image.

With this 2 points taken care of, let's go to selecting the PHP image, For the sake of this post lets stick to the below two.

• Official PHP image: https://hub.docker.com/_/php, since this is the official image, it support the latest PHP releases
• Developer Friendly Bitnami: https://hub.docker.com/r/bitnami/php-fpm

For this Tutorial we will use the Official PHP image.

First add configurations to the docker-compose.yml file, full example here.

 services:
  php:
   build:
      context: './php/'
      args:
       PHP_VERSION: 7.2
    container_name: "test_php"
    networks:
      - backend
    environment:
      PHP_SENDMAIL_PATH: /usr/sbin/sendmail -t -i -S mailhog:1025
      DB_HOST: $DB_HOST
      DB_USER: $DB_USER
      DB_PASSWORD: $DB_PASSWORD
      DB_NAME: $DB_NAME
      DB_DRIVER: $DB_DRIVER
    volumes:
        - ./src/:/usr/local/apache2/htdocs/ #set the docroot folder
        - ./php/php.ini:/usr/local/etc/php/php.ini #set custom php.ini file

Here, "context: './php/' " is the location/folder of the PHP specific config files that we will discuss later. The next important thing is the volumes section, here we can set the docroot folder, and the customized php.ini file.

The section before the ":" is the absolute path the local resource and the part after the colon is the absolute path inside the docker image. The next question would be how do we get the php.ini file from the docker image ? there is a docker command that can be used for this:

docker cp docker-stack_php:/usr/local/etc/php/php.ini php.ini

Next is the Dockerfile, example below, full example here.

FROM php:7.2

#======Install Linux Dependencies
RUN apt-get install libjpeg-dev -y
RUN apt-get install libpng-dev -y

#======PHP Extentions
RUN docker-php-ext-install gd
RUN docker-php-ext-install zip

#======Install Composer
RUN php -r "readfile('http://getcomposer.org/installer');" | php -- --install-dir=/usr/bin/ --filename=composer

#======Install Composer packages like Drush
RUN composer global require drush/drush:8.x
RUN ln -s /root/.composer/vendor/drush/drush/drush /usr/bin/drush

#======Copy the php.ini file
#COPY  "php.ini" "$PHP_INI_DIR/php.ini"

"FROM" defines the target image, The "RUN" keyword can be used to run almost any linux command, The official docker image for php has a command "docker-php-ext-install" to install common php extensions, more details can be found here https://hub.docker.com/_/php. As can be see the Dockerfile is intended to house all your useful commands that can help build your custom docker image. As can be seen docker image are pretty straight forward to configure if you have some experience with using linux commands. Thats it thanks for reading.

I have come across this situation few times where there is a need to connect to 2 or more different repositories at the same time, and configure ssh key for them all. For example : github.com, gitlab.com & bitbucket simulations.

The simpler solution would be to add the same ssh key to all the 3 site, this is ok but can cause issues later, if it does the below suggestion is for you.

Step 1: Create a new SSH key, for the account.

First run below command, place in your email id.

$ ssh-keygen -t rsa -b 4096 -C "email.id@example.com"

Next important thing, add the full path to the file where the key must be generated, as indicated in the below image. Then enter your secret phrase.

Step 2: Update the ssh config file.

Navigate to the ~/.ssh folder on your machine, and open the config file with your favorite text editor. If this file doesn’t exist you can create one.

$ vi ~/.ssh/config

Using the three keywords shown below add in the key details.

• Host , this should be the domain of the repository being cloned.
• HostName, can be set similar to Host, in most cases.
• IdentityFile, should have the same path mentioned when creating the key.

# Gitlab.org

Host gitlab.com

HostName gitlab.com

  IdentityFile ~/.ssh/gitlab

  UseKeychain yes

Once all the keys are created and added on the ssh config file, restart the terminal or command window. Try few pull requests, thats it.. it should work.

On of the fastest way to achieve this in Node would be to install the "xml2json" package, https://www.npmjs.com/package/xml2json.

However this will work for simple xml documents out of the box, and you would face issue with larger more complex xml files link RSS feeds..etc.

One simple workaround would be to use the xml parser package "fast-xml-parser" https://www.npmjs.com/package/fast-xml-parser, this package has lots of configurable and can even convert JSON to XML.

After parsing the xml with this package  simply call "convertToJson" on the object. Sample code below:

let parser = require('fast-xml-parser');
let fs = require('fs');
var he = require('he');


let localXML = './path/to/xml/rss-feed.xml';
let localJson = "./path/to/Json/file.json"; 

let options = {
    attributeNamePrefix: "@_",
    attrNodeName: "attr", //default is 'false'
    textNodeName: "#text",
    ignoreAttributes: true,
    ignoreNameSpace: false,
    allowBooleanAttributes: false,
    parseNodeValue: true,
    parseAttributeValue: false,
    trimValues: true,
    cdataTagName: "__cdata", //default is 'false'
    cdataPositionChar: "\\c",
    localeRange: "", //To support non english character in tag/attribute values.
    parseTrueNumberOnly: false,
    arrayMode: false, //"strict"
    attrValueProcessor: (val, attrName) => he.decode(val, { isAttributeValue: true }),//default is a=>a
    tagValueProcessor: (val, tagName) => he.decode(val), //default is a=>a
    stopNodes: ["parse-me-as-string"]
};

fs.readFile(localXML, function (err, data) {
    if (err) {
        console.log(err);
    }
   
    let xmlString = data.toString();

    try {
        // var xmlObj = parser.parse(xmlString, options, true);
        
        // Intermediate obj
        let tObj = parser.getTraversalObj(xmlString, options);
        let jsonObj = parser.convertToJson(tObj, options); //convert to Json object
        let jsonString = JSON.stringify(jsonObj);
        
        fs.writeFile(localJson, jsonString , function(err){
            if (err) throw err;
            console.log('Saved!');  
        });
    } catch (error) {
        console.log(error.message)
    }

});

With ReactJS is very simple to create a website. There are many tutorial on how to achieve this.

The official Github repository for react shows a very simple workflow, where in you can generate a deployable bundle with NPM.

npm init react-app my-app

Then navigate to the project folder and create you website, once completed your development work, You can use create a production build using:

npm build --prod

This will generate the final React bundle in the "build" folder using webpack. This code is ready to be deployed to production. Since the build components are mostly static HTML and Javascript code they can be deployed to static site hosting like:

GitHub Pages OR GitLab Pages

For the purpose of this tutorial we will be using Gitlab. Next, the outcome of "npm build" i.e. the content of the "build" folder needs to be pushed to a repository.

However, your repository should follow few naming conventions, for example:

To get a domain name in this format: https://myname.gitlab.io your Gitlab project/repository should be named "myname.gitlab.io", hence your project URL would be like this: https://gitlab.com/myname/myname.gitlab.io .

More details on naming conventions can be found here: https://docs.gitlab.com/ee/user/project/pages/getting_started_part_one.html

Conclusion:

This is a very simple but manual way to deploy a ReactJS based website. Many a time you may need to setup additional tasks like creating a sitemap or adding resource to you site , or moving the build folder.

These are repeated tasks and can be done using Gitlabs in-build CI/CD process, checkout my next tutorial for this.