web development automatisation for fun and profit (artem daniliants)

31
Web development automatisation for fun and profit Artem Daniliants / LumoSpark

Upload: lumospark

Post on 12-Apr-2017

178 views

Category:

Technology


4 download

TRANSCRIPT

Web developmentautomatisation

for fun and profitArtem Daniliants / LumoSpark

Automatisation = secret weapon

Git rocks!

Git hooks rock!

Save WP database with each commitPre-commit hook

#!/bin/shmkdir -p _db_snapshot./vendor/bin/wp db export _db_snapshot/database.sqlgit add _db_snapshot/database.sql

Check PHP syntax errors before commitPre-commit hook

git diff --cached --name-only | while read FILE; doif [[ "$FILE" =~ ^.+(php|inc|module|install|test)$ ]]; then # Courtesy of swytsh from the comments below. if [[ -f $FILE ]]; then php -l "$FILE" 1> /dev/null if [ $? -ne 0 ]; then echo -e "\e[1;31m\tAborting commit due to files with syntax errors.\e[0m" >&2 exit 1 fi fifidone || exit $?

Spellchecking commit messagesPre-commit hook

ASPELL=$(which aspell)if [ $? -ne 0 ]; then echo "Aspell not installed - unable to check spelling" >&2 exitelse WORDS=$($ASPELL list < "$1")fiif [ -n "$WORDS" ]; then echo -e "\e[1;33m\tPossible spelling errors found in commit message. Use git commit --amend to change the message. \n\tPossible mispelled words: " $WORDS ".\e[0m" >&2fi

Dependancy management ftw (composer)

Video: YouTube link

Useful composer comandscomposer init # To create a new composer.json file in a projectcomposer show # display all project packagescomposer search some_package # search for a packagecomposer suggests # suggests packages based on installed onescomposer require somepackage/somepackage:someversion # install a dependancycomposer update # update required packagescomposer remove package/name # remove packagecomposer dump-autoload --optimize # optimize autoloader for production

Using private repositories with composer{ "type": "package", "package": { "name": "advancedcustomfields/repeater-field", "type": "wordpress-plugin", "version": "3.1.7", "dist": { "url": "http://[YOUR_USERNAME]:[YOUR_PASSWORD]@codelight.eu/private/wordpress/plugins/acf-repeater.zip", "type": "zip" } } }

PHP Debug bar// Output a message$debugbar["messages"]->addMessage("hello world!");

// Measure execution time$debugbar['time']->measure('My long operation', function() { sleep(2);});

Automatisation with GruntAutomatic image optimisationvar mozjpeg = require('imagemin-mozjpeg');

grunt.initConfig({ imagemin: { // Task static: { // Target options: { // Target options optimizationLevel: 3, svgoPlugins: [{ removeViewBox: false }], use: [mozjpeg()] }, files: { // Dictionary of files 'dist/img.png': 'src/img.png', // 'destination': 'source' 'dist/img.jpg': 'src/img.jpg', 'dist/img.gif': 'src/img.gif' } }, dynamic: { // Another target files: [{ expand: true, // Enable dynamic expansion cwd: 'src/', // Src matches are relative to this path src: ['**/*.{png,jpg,gif}'], // Actual patterns to match dest: 'dist/' // Destination path prefix }] } }});

grunt.loadNpmTasks('grunt-contrib-imagemin');grunt.registerTask('default', ['imagemin']);

Automatisation with GruntRun mobile and desktop performance tests for your deployed site

pagespeed: { options: { nokey: true, url: "https://developers.google.com" }, prod: { options: { url: "https://developers.google.com/speed/docs/insights/v1/getting_started", locale: "en_GB", strategy: "desktop", threshold: 80 } }, paths: { options: { paths: ["/speed/docs/insights/v1/getting_started", "/speed/docs/about"], locale: "en_GB", strategy: "desktop", threshold: 80 } }}

Automating site testing with Sellenium

Video: YouTube Link

Fun with SlackPushing commits to Slack channel

Fun with SlackNotification when sites go down with UptimeRobot

Fun with SlackCustom notifications with Slack API

$client = new Maknz\Slack\Client('http://your.slack.endpoint');$settings = [ 'username' => 'Bot', 'channel' => '#general', 'link_names' => true];$client = new Maknz\Slack\Client('http://your.slack.endpoint', $settings);$client->send('Hello world!');

WP-Cli = WP command line interfacewp db export database.sql # Backup databasewp core update # update core of WPwp plugin status # see installed pluginswp plugin update plugin-name # update pluginwp plugin uninstall plugin_name # uninstall pluginwp theme update --all # update themeswp post create --post_type=page --post_status=publish --post_title='My test post' --post_content='This is a test post' # create post

# change wp site urlwp option update home https://newdomain.comwp option update siteurl https://newdomain.com

Custom WP theme updates using GitHub Updater

/*Theme Name: TestTheme URI: http://thefragens.net/Version: 0.1.0Description: Child theme of TwentyTwelve.Author: Andy FragenTemplate: twentytwelveTemplate Version: 1.0.0GitHub Theme URI: https://github.com/afragen/test-childGitHub Branch: master*/

Free developer hosting with Heroku

Video: YouTube Link

Free SSL with Let's encrypt

Speed with mod_pagespeed

CloudFlare magic

Website speed optimisation→ AutoMinify

→ Cache header optimisation→ JavaScript bundling→ Browser optimisation→ Aggressive GZIP

→ Asynchronous resource loading→ Local storage caching

→ Email Address Obfuscation

Free CDN

Free security protection

IP Geolocationif ($_SERVER["HTTP_CF_IPCOUNTRY"]=="FR"){ header("Location: /country/france",TRUE,307);}

Page rules

Deployment automatisation with DockerSetting up docker-compose.yml

version: '2'services: db: image: mysql:5.7 volumes: - "./.data/db:/var/lib/mysql" restart: always environment: MYSQL_ROOT_PASSWORD: wordpress MYSQL_DATABASE: wordpress MYSQL_USER: wordpress MYSQL_PASSWORD: wordpress

wordpress: depends_on: - db image: wordpress:latest links: - db ports: - "8000:80" restart: always environment: WORDPRESS_DB_HOST: db:3306 WORDPRESS_DB_PASSWORD: wordpress

Auto deploy your Wordpress container with Docker Cloud

Thank you!Contact me

Email: [email protected]: twitter.com/artemd

LinkedIn: fi.linkedin.com/in/artemdaniliants