WHAT IT TAKES TO BE A WEB DEVELOPER T hen & N ow
Oct 19, 2014
WHAT IT TAKES TO BE A WEB DEVELOPER
Then & Now
THIS IS CMN...Say hello to your Tech Team
Eric C.
Jen G.Danny G.
Antonin J.
Evan K.
Jill R.
Dave R.
Will S.
Jimmy W.
Eric R.
James L.
THIS IS CMN...And these are your Front-End Developers
Eric C.
Jen G.Danny G.
Antonin J.
Evan K.
Jill R.
Dave R.
Will S.
Jimmy W.
Eric R.
James L.
FOR NEARLY 10 YEARS, HTML TECHNOLOGIES REMAINED LARGELY UNCHANGEDTables, Flash, iFrames, dominated the 1990's.
This is what we had to work with. This was Web 1.0.
1991
HTML 1
1990
1992
1994
1995
1996
1998
1999
1st w
ebsite by Tim
Berners-
Lee
<table>-base
d design
HTML 2.0; W
3C establis
hed
HTML 3; F
lash &
JavaScript in
troduced
CSS 1; iFra
mes populariz
ed
HTML 4.0; C
SS 2; PHP 3.0; G
oogle
Web 1.0
IT SUCKED.
THE LANDSCAPE HIT MATURITY IN MID 2000Tools & technologies paved the way for blogging, RSS, and social media.
Welcome to Web 2.0.
2002
dot-com boom peaks; PHP 4.0
2000
2003
2005
2006
2007
2009
CSS2.1 + W
eb 2.0; social m
edia begins
Word
Press v0.7 la
unched (in H
ouston!)
AJAX; Git v
ersion contro
l developed; W
ordPress
2.0
jQuery
launches; C
MS sy
stems a
re the th
ing
iPhone la
unches; Sass
CSS Pre-processo
r appears;
local e
diting to
ols lik
e MAM
P appear
HTML5 in
troduced; C
SS3;
mobile
web is
now a thin
g;
GitHub la
unches; LESS (C
SS)
Undersc
ore.js (app platfo
rm)
DIY’ERS REJOICE.We can finally do something with our websites.
By the late 2000's, technology caused new problems that needed new tools to solve them.
Mobile meets Responsive Web Design.
Word
Press 4.0 (A
ug 2014)
Grunt (t
ask ru
nner); Bower (p
ackage manager)
FTP turn
s 40, st
ill a prim
ary to
ol
Word
Press 3.0
NEW PROBLEMS, NEW TOOLS
2010
2011
2012
2014
Gulp (task
runner)
Vagrant (d
ev environment)
Responsiv
e Web D
esign
Backbone.js (app platfo
rm)
HTML5 adoptio
n rate gro
ws
CSS Framework
s populariz
ed
Yeoman (task
runner);
Ansible (ta
sk ru
nner)
Lineman (ta
sk ru
nner)
CMN develops G
enesis W
ordPress
(no m
ore FTP for d
eployment)
2013
Twitter B
ootstra
p hits #1 o
n GitHub
Twitter B
oostrap (C
SS Framework
)
Node.js (app platfo
rm) ;
Brunch (ta
sk ru
nner)
New, revolutionary tools are being released on a weekly basis. For free.
People find worthwhile projects. Anyone is welcome to contribute to them. Adoption rate is at an all-time high.
NEW PROBLEMS, NEW TOOLS
LET’S GO TWEET ABOUT IT.But first, let me take a selfie.
Most of the tools we create with today didn’t even exist 5 years ago.
GAME CHANGERS...
Word
Press 4.0 (A
ug 2014)
Grunt (t
ask ru
nner); Bower (p
ackage manager)
FTP turn
s 40, st
ill a prim
ary to
ol
Word
Press 3.0
2010
2011
2012
2014
Gulp (task
runner)
Vagrant (d
ev environment)
Responsiv
e Web D
esign
Backbone.js (app platfo
rm)
HTML5 adoptio
n rate gro
ws
CSS Framework
s populariz
ed
Twitter B
oostrap (C
SS Framework
)
Node.js (app platfo
rm) ;
Brunch (ta
sk ru
nner)
Yeoman (task
runner);
Ansible (ta
sk ru
nner)
Lineman (ta
sk ru
nner)
CMN develops G
enesis W
ordPress
(no m
ore FTP for d
eployment)
2013
Twitter B
ootstra
p hits #1 o
n GitHub
I did. And it’s amazing.
WAIT A MINUTE! DID YOU JUST MENTION GENESIS WORDPRESS?
Word
Press 4.0 (A
ug 2014)
Grunt (t
ask ru
nner); Bower (p
ackage manager)
FTP turn
s 40, st
ill a prim
ary to
ol
Word
Press 3.0
2010
2011
2012
2014
Gulp (task
runner)
Vagrant (d
ev environment)
Responsiv
e Web D
esign
Backbone.js (app platfo
rm)
HTML5 adoptio
n rate gro
ws
CSS Framework
s populariz
ed
Twitter B
oostrap (C
SS Framework
)
Node.js (app platfo
rm) ;
Brunch (ta
sk ru
nner)
Yeoman (task
runner);
Ansible (ta
sk ru
nner)
Lineman (ta
sk ru
nner)
CMN develops G
enesis W
ordPress
(no m
ore FTP for d
eployment)
2013
Twitter B
ootstra
p hits #1 o
n GitHub
Genesis WordPress provides a platform where the Tech Team can collaboratively work on any given site on their local machine, sync the database, make file changes, and safely deploy edits back to both staging and production environments within minutes.
I FEEL AMAZED. TELL ME MORE.
It builds upon many technologies previously mentioned:
• Vagrant
• WordPress
• WordPress Themes
• NodeJS
• VirtualBox
• Capistrano
• Bundler
• Ansible
• Grunt
• Bower
• Yeoman
• SSH
• Apache
• PHP
• HTML
• CSS
• Sass
• Git + GitHub
• Varnish
I FEEL AMAZED. TELL ME MORE.
OUT OF 24 YEARS OF HTML DEVELOPMENT, WHAT DO YOU HAVE TO KNOW TO BE SUCCESSFUL AT CMN?
ALL OF IT.Srsly.
OUT OF 24 YEARS OF HTML DEVELOPMENT, WHAT DO YOU HAVE TO KNOW TO BE SUCCESSFUL AT CMN?The challenges we face on a day-to-day basis rely on our ability to adapt, adopt, and overcome.
Experience is everything.
Come to work, prepare to learn.
BUT WAIT, THERE’S MORE!• [Web] Design
• User Experience (UX)
• User Interface (UI)
• Command Line Interface
• Database technologies
• Analytics
• A/B testing
• Search Engine Optimization (SEO)
• Best Practices (that kinda applies to a lot of things)
• Server Technologies (configuration, .htaccess, SSH)
• Apps, apps, apps...
WE NEVER STOP LEARNING.Because we love what we do.