Php on Janik von Rotz

Let’s write a Laravel application – Project template

Fri, 30 Jan 2015 10:28:03 +0000

In web development there are tons of programs and tools and due to that also complex and very different development strategies. Luckily dependency handling got a lot easier. For my Laravel project setup we will use 3 different package managers. Every package manager of course manages a different resource, we will use composer for php packages, npm for everything related to Node.js and Bower for web packages.

By following the instructions of this guide you’ll get a very advanced Laravel project template with the following features:

Live Reloading of your browser.
Twitter Bootstrap included.
Automatic minification and bundling of CSS and JavaScript files.
The most recent web technologies at your hand.
A default blade template ready to run.

Install

1. Bitnami Nginx Webstack

First of all we need a php executable and a MySQL server. The most convienient way to deploy these services is by installing a predefined stack. Actually we don’t need a webserver, however if you’re using phpmyadmin it’s already onboard.

Get Bitnami Nginx Webstack

2. Composer

As I’ve said composer is a php package manager. As Laravel is a composer package we need this tool to deploy the Laravel project. You can get composer here.

Get Composer

3. Node.js

The npm package manager, which will provide us Grunt and Bower is part of Node.js.

Get Node.js

4. Atom.io

As a web developer you might have heard of Sublime, well suck that! Atom.io is out of question way better. It’s opensource, it’s customizable down to the core and runs on the most promising technologies. If you’re using Sublime and reading this, the time has come to flush your workflow and get startet with Atom.io.

Get Atom.io

Configure

We assume you have installed all the tools above properly and ready to run.

1. Install Laravel

First download the Laravel package with composer. It doesn’t matter where you’ll do this. This package will globally available on your host.

composer global require "laravel/installer=~1.1"

Navigate to a directory with your command line where you want to install your first Laravel project.

composer create-project laravel/laravel <project name> --prefer-dist

2. Install Bower and Bootstrap

Navigate into your project directory.

cd <project name>

Create a npm configuration file.

npm init

Then install Bower with npm.

npm install -g bower

Create a Bower configuration file.

bower init

And install Bootstrap and jQuery.

bower install bootstrap jquery --save-dev

3. Install and Configure Grunt

Install the Grunt command line tool with npm.

npm install -g grunt-cli

Then install the Grunt packages.

npm install grunt --save-dev

Now add the additional Grunt packages to your npm config file package.json.

"devDependencies": {
    "grunt": "~0.4.5",
    "grunt-contrib-copy": "~0.7.0",
    "grunt-contrib-cssmin": "~0.11.0",
    "grunt-contrib-uglify": "~0.7.0",
    "grunt-contrib-watch": "~0.6.1",
    "grunt-bg-shell": "~2.3.1"
}

If you did so run the npm installer.

npm install

Create a Grunt task file Gruntfile.js in the root directory of your project.

And add this content.

module.exports = function(grunt){

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    cssmin: {
      files: {
        src: [
          'public/style.css',
          'bower_components/bootstrap/dist/css/bootstrap.css'
        ],
        dest: 'public/all.min.css'
      }
    },

    uglify: {
      files: {
        src: [
          'public/app.js',
          'bower_components/jquery/dist/jquery.js',
          'bower_components/bootstrap/dist/js/bootstrap.js'
        ],
        dest:  'public/all.min.js'
      }
    },

    bgShell: {
      _defaults: {
        bg: true
      },
      runLaravel: {
        cmd: 'php artisan serve'
      }
    },

    watch:{
      css:{
        files: [
          '/public/style.css'
        ],
        tasks: ['cssmin']
      },
      js: {
        files: [
          '/public/app.js'
        ],
        tasks: ['uglify']
      },
      livereload: {
        options: {
            livereload: true
        },
        files: [
            'app/views/**/*.php',
            'public/*.css',
            'public/*.js'
        ]
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-bg-shell');

  grunt.registerTask('default', ['cssmin','uglify','bgShell:runLaravel','watch']);

};

This file provides the following features:

Bundling and minifcation of your Bootstrap and custom CSS files and Bootstrap, jQuery and custom JavaScript files.
It will start Laravel webserver.
Provide the Live Reload feature.

As always you can extend the Grund configuration according to your requirements. Some my want to recompile the Bootstrap less files with an updated fonts folder or add php unitiy testing.

4. Configure Laravel

In order to make use of the Live Reload feature, you can either add this JavaScript to your template.

<script src="//localhost:35729/livereload.js"></script>

Or (what I recommend) download and install following blade template files.

Download template files or get the latest version here.

Add these files to a new folder called default in the app views folder <project name>\app\views\default

Then delete the file <project name\app\views\home.php and add a new file <project name>\app\views\home.blade.php with the following content.

@extends('default.master')
@section('content')
Content goes here
@stop

This template assumes that you distinct between a local and a productive environment. You have to update two configuration files before you’ll run your project.

In the file <project name>\boostrap\start.php add your hostname to the detect environment array.

$env = $app->detectEnvironment(array(
	'local' => array('<yourhostname>','<anotherhostname>'),
));

If you want to connect to a MySQL database you also of to update the local environment database config file <project name>\app\config\local\database.php.

5. Run the Application

Now we are ready to run the whole project. You can start the development server by typing Grunt into your command line. Navigate to http://localhost:8000 and you should see a simple Boostrap site.

Prevent a lot of spam on your next php form with this simple trick

Mon, 28 Apr 2014 12:08:19 +0000

Spam bots were parsing websites html to code and searching for form patterns. What they luckily don’t do in most cases is running javascript or applying css code. This behaviour is a good way to tell a human from a spambot apart.

Here is a simple example of how to make use of this behaviour to prevent a lot of spam.

<?php //post the form fields from below
    $name = $_POST['name'];
    $machine = $_POST['machine'];
    if ($machine != "")
    {
        exit(); //if a spambot filled out the "machine"
                //field, we don't proceed
    }
    else
    {
        //validate the name and do stuff with it
    }
?>
 
<!DOCTYPE html>
<html>
    <head>
        <title>Test Form</title>
        <style>
            /* hide the "machine" field */
            .machine { display: none; }
        </style>
    </head>
    <body>
        <form method="post" action="">
            <input name="name" />
            <!-- below field is hidden with css -->
            <input name="machine" class="machine" />
            <!-- edit - show a warning (also hidden) to users with CSS disabled -->
            <label for="machine" class="machine">If you are a human, don't fill out this field!</label>
            <input type="submit" />
        </form>
    </body>
</html>

The idea here is that spambots will fill out all fields in the form. So we hide one of the fields with CSS (so users don’t see it) and if it’s filled out, we don’t allow the submission to complete.

Latest version of this snippet: https://gist.github.com/11363197

Install QR code service

Thu, 17 Apr 2014 10:35:03 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9445729.

Introduction

To generate QR codes with php we are using the project QR Generator PHP hosted on GitHub.

Requirements

Installation

Clone project with git.

cd /usr/local/src
sudo git clone https://codeberg.org/janikvonrotz/QR-Generator-PHP.git

Rename the project directory to get a shorter url.

sudo mv QR-Generator-PHP qr

Add the config to one of your Nginx sites.

server{
    
    ...
    
    # change location for QR code requests
    location /qr{
        root /usr/local/src;
        index index.php;
    }
    
    location ~ .php$ {
        
        ...
        
        # change the php root for QR code requests
        if ($request_uri ~* /qr) {
            set $php_root /usr/local/src;
        }
        
        ...
    }
}

Test config and reload Nginx service.

sudo nginx -t && sudo service nginx reload

Test the new QR code service by open a browser on //[host]/qr/?d=example.org.

Install phpMyAdmin website

Mon, 14 Apr 2014 09:49:37 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9392925.

Introduction

phpMyAdmin is a free software tool written in PHP, intended to handle the administration of MySQL over the Web.

Requirements

Installation

Start the installation phpMyAdmin.

sudo apt-get install phpmyadmin

As we use nginx for this installation, hit Tab and Enter on the first prompt.

Chose and enter the MySQL root password on the second prompt.

Create a secure password for phpMyAdmin. Don’t use the MySQL root password!

Add the phpMyAdmin Nginx configuration to one of your websites.

server{
    ...
    
    root /usr/share;

    ...
    
    location ~ .php$ {
        ...
        
        # change the php root for phpMyAdmin
        if ($request_uri ~* /phpmyadmin) {
            set $php_root /usr/share;
        }
        
        ...
    }
}

Test config and reload Nginx service.

sudo nginx -t && sudo service nginx reload

Open your browser on //[host]/phpmyadmin.

Increase Max Upload for php5-fpm website

Fri, 11 Apr 2014 06:55:10 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9604715.

Introduction

In some cases the default memory allocation for php is not enough to run an application properly.

Requirements

Instruction

Update the php5-fpm config.

sudo vi /etc/php5/fpm/php.ini
Set memory_limit = 512M

Restart the php5-fpm service.

sudo service php5-fpm restart

Install Nginx php5-fpm website

Fri, 11 Apr 2014 06:52:52 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9445746.

Introduction

This is a minimal Nginx configuration to run php based websites/ applications.

Requirements

Installation

Add this Nginx configuration to your website config.

server{

    ...
    
    # php5-fpm configuration
    location ~ \.php$ {
        
        set $php_root /var/www/[host];
        
        fastcgi_pass unix:/var/run/php5-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $php_root$fastcgi_script_name;
        include /etc/nginx/fastcgi_params;
    }
}

Test config and reload Nginx service.

sudo nginx -t && sudo service nginx reload

Install php5 modules

Tue, 25 Mar 2014 11:38:33 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9758559.

Introduction

Php5 modules extending the functionality for php scripts and are required by several php projects.

Requirements

Ubuntu server
php5-fpm

Installation

Restart the php5-fpm service after every installation.

sudo service php5-fpm restart

php5-curl

CURL is a library for getting files from FTP, GOPHER, HTTP server.

sudo apt-get install php5-curl

php5-dev

This package provides the files from the PHP5 source needed for compiling additional modules.

sudo apt-get install php5-dev

php5-geoip

This PHP module allows you to find the location of an IP address - City, State, Country, Longitude, Latitude, and other information as all, such as ISP and connection type.

sudo apt-get install php5-geoip

php5-mcrypt

This package provides a module for MCrypt functions in PHP scripts.

sudo apt-get install php5-mcrypt

php5-mysql

This package provides modules for MySQL database connections directly from PHP scripts.

sudo apt-get install php5-mysql

Source

Ubuntu package repository

Step by Step: Install WordPress Blog

Sat, 22 Mar 2014 10:26:15 +0000

Latest Version of this guide: https://gist.github.com/9320678

Finishing this guide you’ll get:

A running WordPress installation
Nginx proxy with PHP and Fast CGI
MySQL server accessible with phpMyAdmin

Specification of latest running installation:

Date: 03.03.2014
OS: Ubuntu 64 bit - 12.04.4 LTS
Provider: Amazon EC2
Browser: Google Chrome - 33.0.1750.117
WordPress: 3.8.1
Nginx: 1.1.19
MySQL: 5.5.35
PHP: 5.3.10
phpMyAdmin: 3.4.10.1

Requirements

Server is behind a firewall, that only allows http, https and ssh
The server is accessed with ssh keys (user password authentication must be disabled)
Server is not accessed with the root user
You’re able to edit files with VI

Ubuntu

Update Ubuntu

sudo apt-get update && sudo apt-get upgrade

Install additional packages

sudo aptitude install build-essential zip git

MySQL

Install MySQL server and php5 MySQL module

sudo apt-get install mysql-server php5-mysql

Set the mysql root user password during the installation

Install the default MySQL databases

sudo mysql_install_db

Run the finisher script and respond every prompt with yes to get a secure MySQL installation

sudo /usr/bin/mysql_secure_installation

Connect to your new MySQL server

mysql -uroot -p

Enter the root password

And run this command to get the MySQL version

SHOW variables LIKE "%version%";

Nginx

Install Nginx

sudo apt-get install nginx

Create a Nginx site configuration file

sudo touch /etc/nginx/sites-available/wordpress.conf
sudo vi /etc/nginx/sites-available/wordpress.conf

Paste this config

server {    
listen   80;

	root /var/www/wordpress;
	index index.php index.html index.htm;

	server_name [example.com];

	location / {
		try_files $uri $uri/ /index.php?q=$uri&$args;
	}

	error_page 404 /404.html;

	error_page 500 502 503 504 /50x.html;
	location = /50x.html {
		root /usr/share/nginx/www;
	}
    
    client_max_body_size 10M;

	# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
	location ~ \.php$ {
		try_files $uri = 404;
		#fastcgi_pass 127.0.0.1:9000;
		# With php5-fpm:
		fastcgi_pass unix:/var/run/php5-fpm.sock;
		fastcgi_index index.php;
		include fastcgi_params;
	}
}

Optionally you can rewrite false urls to a specified canonical url

server {
    listen       80;
    server_name  www.example.com  example.com;
    if ($http_host = www.example.org) {
        rewrite  (.*)  http://[example.com]$1;
    }
    ...
}

Create a symlink to the config file

sudo ln -s /etc/nginx/sites-available/wordpress.conf /etc/nginx/sites-enabled/wordpress.conf

Restart Ngnix

sudo service nginx restart

Check Nginx version

nginx -v

PHP

Install PHP with FastCGI support

sudo apt-get install php5-fpm

configure PHP installaton

 sudo vi /etc/php5/fpm/php.ini

Find the line cgi.fix_pathinfo=1 by pressing ESC and enter

/;cgi.fix_pathinfo=1

Uncomment this line and change value to 0

cgi.fix_pathinfo=0

If this number is kept as 1, the php interpreter will do its best to process the file that is as near to the requested file as possible. This is a possible security risk. If this number is set to 0, conversely, the interpreter will only process the exact file path—a much safer alternative.

Find the line ; default extension directory. and insert below

extension=mcrypt.so

Update the listening port for the php fpm

sudo vi /etc/php5/fpm/pool.d/www.conf
Set listen = /var/run/php5-fpm.sock

Restart the service

sudo service php5-fpm restart

Create the website folder

sudo mkdir /var/www/wordpress

Add a PHP info file

sudo vi /var/www/wordpress/info.php

Set content

<?php
phpinfo();
?>

Open your browser on http://example.com/info.php

Delete this file if everything works

phpMyAdmin

Install phpMyAdmin

sudo apt-get install phpmyadmin

When phpMyAdmin prompts you to choose a server (either apache or lighttpd)hit tab, and select neither one.

When phpMyAdmin asks you wether to configure database for phpmyadmin with dbconfig-common. Chose and enter the MySQL root user password

Hit on the MySQL application password for phpmyadmin prompt.

Create a symbolic link for the phpMyAdmin website

sudo ln -s /usr/share/phpmyadmin/ /usr/share/nginx/www

Create a Nginx configuration file

sudo touch /etc/nginx/sites-available/phpmyadmin.conf
sudo vi /etc/nginx/sites-available/phpmyadmin.conf

Paste this config

server{
	listen 80;
	
	server_name [Your Public IP];
	root /var/www/;
	
	index index.php index.html index.htm;
	
    client_max_body_size 10M;
    
	location ~ .php$ {
		try_files $uri = 404;
		fastcgi_pass unix:/var/run/php5-fpm.sock;
		fastcgi_index index.php;
		include /etc/nginx/fastcgi_params;
	}
}

Create a symlink to the config file

sudo ln -s /etc/nginx/sites-available/phpmyadmin.conf /etc/nginx/sites-enabled/phpmyadmin.conf

Restart Ngnix

sudo service nginx restart

Open the browser on http://[YourPublicIP]/phpmyadmin/

WordPress

Open the WordPress site directory

cd /var/www/wordpress/

Download latest WordPress package and untar it

sudo wget http://wordpress.org/latest.tar.gz
tar -xzvf latest.tar.gz

Copy the untared files to the current folder and delete the other files

sudo cp -r ./wordpress/* ./
sudo rm -r wordpress
sudo rm latest.tar.gz

Let’s create the MySQL WordPress user

mysql -u root -p

Enter the MySQL root user password

Create the WordPress database

CREATE DATABASE wordpress;

Create the WordPress database user

CREATE USER wordpress@localhost;

Set the password for the WordPress database user

SET PASSWORD FOR wordpress@localhost = PASSWORD("[password]");

Grant WordPress user full access on WordPress database

GRANT ALL PRIVILEGES ON wordpress.* TO wordpress@localhost IDENTIFIED BY '[password]';

Refresh MySQL and exit

FLUSH PRIVILEGES;
exit

Copy the WordPress example config file

sudo cp wp-config-sample.php wp-config.php

Edit the config file

sudo vi wp-config.php

Set database, database user and his password

define('DB_NAME', 'wordpress');

define('DB_USER', 'wordpress');

define('DB_PASSWORD', '[password]');

Update permissions for Nginx user

sudo chown www-data:www-data * -R 
sudo usermod -a -G www-data www-data

Open the browser on http://example.com and install you WordPress blog

Source

Install MySQL
How To Install Linux, nginx, MySQL, PHP (LEMP) stack on Ubuntu 12.04 by Digital Ocean
How To Install phpMyAdmin on a LEMP server by Digi
How To Install Wordpress with nginx on Ubuntu 12.04 by Digital Ocean
Nginx rewrite rules
Get MySQL version

Install php5-fpm

Thu, 20 Mar 2014 13:41:30 +0000

This post is part of my Your own Virtual Private Server hosting solution project.
Get the latest version of this article here: https://gist.github.com/9343960.

Requirements

Ubuntu server

Installation

Install the package with aptitude.

sudo aptitude install php5-fpm

Check the php5-fpm version.

php5-fpm -v

Source

Configuring and Optimizing PHP-FPM and Nginx on Ubuntu