DAJ SIĘ WYRĘCZYĆTomasz Dziuda

WordUp Kraków Wiosna@2014

–Typowy Klient po odkryciu gotowców w projekcie

“Dlaczego chce Pan za to zlecenie X złotych skoro korzysta Pan z gotowego motywu?”

NIE O TYM JEST TA PREZENTACJA ;-)

Źródło: (https://twitter.com/iamdevloper/status/458263644628078592)

ZŁOŻONOŚĆ PROJEKTÓW WWW ROŚNIE

A CZAS TRWANIA DOBY SIĘ NIE ZMIENIA

AUTOMATYZACJA?

AUTOMATYZACJA?

AUTOMATYZACJA?

AUTOMATYZACJA?

CO WARTO ZAUTOMATYZOWAĆ?

• Powtarzalne czynności

• Powtarzalne czynności

• Zadania w których łatwo można zaprogramować kolejne etapy

• Powtarzalne czynności

• Zadania w których łatwo można zaprogramować kolejne etapy

• Warto zwracać uwagę na złożoność i zasobożerność rozwiązania automatycznego

JAK ŻYĆ AUTOMATYZOWAĆ?

WYGODNY EDYTOR

SUBLIME TEXT

EMMET

ul>li*3>a

<ul> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=“"></a></li> </ul>

-webkit-box-sizing: ; -moz-box-sizing: ; box-sizing: ;

-box-sizing: ;

AUTOPREFIXER

LINTER

EMMET LIVESTYLE

LESS PARSER

[brak screena]

On po prostu działa ;-)

PRZYDATNE WTYCZKIEmmet

(http://emmet.io/)

!Emmet Live Style

(http://livestyle.emmet.io/)

!AutoPrefixer

(https://github.com/sindresorhus/sublime-autoprefixer)

!Linter

(https://github.com/SublimeLinter/SublimeLinter)

!LESS Parser

(https://github.com/timdouglas/sublime-less2css)

ALTERNATYWY

Codekit (https://incident57.com/codekit/)

!Grunt.js

(http://gruntjs.com/)

!Atom

(https://atom.io/)

!Wypasione IDE ;-)

SCAFFOLDING

$ npm install -g yo generator-wordpress !

$ yo wordpress

PRZYDATNE GENERATORY

YeoPress (https://github.com/wesleytodd/YeoPress)

!generator-wp-theme

(https://github.com/danielauener/generator-wp-grunted-theme)

!generator-wp-plugin-boilerplate

(https://github.com/thiagolcks/generator-wp-plugin-boilerplate)

ALTERNATYWY

Brunch (http://brunch.io/)

!!

Loom (https://github.com/rpflorence/loom)

UNIKANIE NUDNYCH ZADAŃ

JAK TO DZIAŁA?• Tworzymy package.json

• Tworzymy Gruntfile.js

• Wchodzimy do katalogu z projektem

• Aktualizujemy wszystkie zależności z package.json poprzez npm install

• Uruchamiamy zadania komendą grunt lub grunt <nazwa_zadania>

GRUNTFILE.JS

• Funkcja otaczająca

• Konfiguracja grunta i zadań

• Załadowanie wtyczek i zadań

• Definicje własnych zadań (domyślne zadanie ma nazwę “default”)

module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), uglify: { options: { banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n' }, build: { src: 'src/<%= pkg.name %>.js', dest: 'build/<%= pkg.name %>.min.js' } } }); ! grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.registerTask('default', ['uglify']); };

PRZYDATNE TASKI• grunt-csscss

• grunt-jsbeautifier

• grunt-cssbeautifier

• grunt-contrib-jshint

• grunt-contrib-less

• Więcej na: http://gruntjs.com/plugins

ALTERNATYWY

Gulp.js !

(http://gulpjs.com/)

AUTOMATYCZNE WYKLIKIWANIE

CASPER.JS

var casper = require('casper').create({ verbose: true, logLevel: “debug", onError: function(self, m) { console.log('FATAL:' + m); self.exit(); }, viewportSize: { 'width': 1280, 'height': 1024 } });

casper.start(); !casper.setHttpAuth('admin', ‘demo'); !casper.thenOpen('http://domain.com/administrator/index.php', function() { this.echo('Logged to HTACCESS', 'INFO'); });

casper.then(function() { this.fill('#form-login', { 'username': 'admin', 'passwd': 'demo' }, true); ! this.captureSelector(‘admin.png', '#main'); }); !casper.run();

ALTERNATYWY

Phantom.js (http://phantomjs.org/)

!Slimer.js

(http://slimerjs.org/)

!Nightwatch.js

(http://nightwatchjs.org/)

I WIELE INNYCH SPOSOBÓW

DLA MIŁOŚNIKÓW KONSOLI

WP-CLI (HTTP://WP-CLI.ORG/)

!

DICTATOR (HTTPS://GITHUB.COM/DANIELBACHHUBER/DICTATOR)

!(HTTP://TORQUEMAG.IO/DIVING-INTO-DICTATOR-A-PROVISIONING-TOOL-FOR-WORDPRESS/)

TESTY JEDNOSTKOWE

Jak pisać testy jednostkowe dla wtyczek (https://speakerdeck.com/tierra/unit-testing-wordpress-plugins)

!Travis CI

(https://travis-ci.org/)

!QUnit

(http://qunitjs.com/)

KONTAKT

Lead Developer @ www.gavick.com !@dziudek !http://wp.dziudek.pl !http://zebymniezapomnial.tumblr.com !

PYTANIA?