What it takes to be a Web Developer: Then & Now

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.