The Secret to 20% of the top 10 million websites
(It's not a big secret, you know what this presentation is about)
It's Wordpress!
But why?
I'm Kalen
- Web designer/developer since ~2010
- Using Wordpress the whole time
- Works at Jacob Tyler
- Site: http://kalenjohnson.com
- Twitter: @Kalenjohnson
- IRC: kalenj
- Email: info@kalenjohnson.com
Wordpress
Really? Why?
"Wordpress is horrible, dude" - CAMDesigns
"Wordpress is full of spaghetti code" - Anonymous
"Wordpress is only for blogs" - most developers
"Don't use Worpress" - even more developers
Are the complaints legit?
Well, yes, many complaints are legitimate.
Proof:
- Old codebase - come a long way, but a long way to go
- Some OO, but not originally
- Not MVC by design, not much chance of that
- So popular, and relatively easy to use
- Attracts new developers - and bad code
- Public plugins and themes pass QC (meaning: don't spam)
- Need to test, and read comments
- Incompatibility with new versions of WP
- Originally built as a blog platform
So why is it so popular?
Because most people aren't dev's (just being honest).
But Wordpress has come a long way.
Can you use it for more than a blog?
Wordpress as a CMS
Custom Post Types
Create new sections other than blog posts.
Portfolio projects, Testimonials, Reviews, etc.
Custom Taxonomies
Dumb word, but has a lot of meaning.
Categories, tags, or... Countries, Types, Ideas....
Really, anything used to sort or categorize post types.
Custom post types and taxonomies only need to be
declared with one function and some arrays.
Custom fields can be configured from within Wordpress,
but need to be set up in the theme to be displayed correctly.
I to use a plugin called "Advanced Custom Fields".
What can Custom Fields do?
Developing for Wordpress with
Modern Web Development techniques
How can we modernize Wordpress development?
Implement modern skills (Model and View like themes)
Keep logic separate from HTML
Grunt.js and Node.js to run tasks like:
CSS Preprocessors, Linting, concatenation, minification,
cache busting, img sprites, img optimization, live reload, more.
Composer, Capistrano, CLI, it's all possible.
SASS or Less
CSS Pre-processors are awesum!
Save time - keep files organized - be a cool kid
Grunt and Node
Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications.
NPM - node package manager used by Grunt
Grunt - The Javascript task runner
SASS or LESS - CSS Pre-processor. No need to install separately
JS Linting - check code so that there are no errors
Concatenation, Minification, Uglifying - CSS and JS that load fast
LiveReload + File Watching - Edit a file, save it, see results in browser
CSS Sprites - even in LESS
Gruntfile.js
Grunt Watch
Roots Theme
Wordpress starter theme:
Twitter Bootstrap by default.
Incorporates Grunt + LESS, LiveReload, JSHinting, CSS Sourcemaps,
JS and CSS Minification + Concatenation
Modern dev techniques: Git, theme wrapper,
PHP Classes, and Grunt.js
I owe a lot to these individuals:
Ben Word (@retlehs) - Creator of Roots Theme
Scott Walkinshaw (@swalkinshaw) - Contributor to Roots
Screencasts: Use Grunt, and Composer with Wordpress
Composer
Composer can be used to set up Wordpress, plugins, and your theme.
Default Wordpress folders can be changed, to be more "app" like.
wp-config can be moved above root www folder
(This only works if Wordpress is intalled in root,
or else wp-config.php content like DB name, user,
and PW must link to another file in folder above www root)
Most things can be loaded by Git:
https://github.com/wordpress/wordpress (updated every 15 mins)
http://wpackagist.org/ (Composer mirror of WP plugins)
Help using WP and Composer: http://composer.rarst.net/
Wordpress + Composer
Just like this:
wpackagist.org
It's magic
Vagrant
Forget about WAMP, MAMP, XAMPP, everything but LAMP (or LEMP)
Nearly automatic virtualization of server environment.
WAMP/MAMP can have issues particular to the app
Virtual machine can match nearly exactly server environment
WP-CLI
Capistrano
Here are some links:
Video Walkthrough:
There's more!
Not really.
Questions?
Sdphp-Wp
By Kalen Johnson
Sdphp-Wp
- 3,986