My assumption is the
mother of all mistakes.
Lagwagon - Violins
Slide 5
Slide 5 text
cedmax
Front end dev
since able to
grow a beard
Slide 6
Slide 6 text
Everything was different
yep, I had
to debug
ie mac
Slide 7
Slide 7 text
and no, it wasn’t better
http://www.webdesignerdepot.com/2009/07/30-handy-cheat-sheets-and-reference-guides-for-web-professionals/
Slide 8
Slide 8 text
the basics were the same
Slide 9
Slide 9 text
HTML
Slide 10
Slide 10 text
css
Slide 11
Slide 11 text
Javascript
Slide 12
Slide 12 text
CONTENT STYLE BEHAVIOUR
how we build for the web
https://www.flickr.com/photos/joaoramos/5795966713 https://www.flickr.com/photos/29310420@N02/6017055570 https://www.flickr.com/photos/85896427@N08/8887898076
It’s not for browsers
http://www.aflac.com/agents/#/shirley-s
Slide 15
Slide 15 text
It’s for people
http://www.gizmodo.co.uk/2011/11/ofcom-2011-infrastructure-report-shows-30-per-cent-of-uk-not-covered-by-3g/
Slide 16
Slide 16 text
Progressive enhancement in its basic
form means not making assumptions
but start with the most basic thing and
check every step on the way if we are
still OK to proceed.
Christian Heilmann
http://christianheilmann.com/2015/02/18/progressive-enhancement-is-not-about-javascript-availability/
Slide 17
Slide 17 text
Defensive design
Slide 18
Slide 18 text
build
for the web,
not just
on the web
Slide 19
Slide 19 text
Basically
Step up
http://www.chicagonow.com/world-series-dreaming/2013/11/challenge-
accepted/
Slide 20
Slide 20 text
Starting a basic website in 2015
1. Install Node
2. Install Bower
3. Pick CSS framework
4. Pick responsive approach
…
47. Write some HTML
@iamdevloper
https://twitter.com/iamdevloper/status/517616294909464576
Slide 21
Slide 21 text
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
of course
Slide 22
Slide 22 text
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
as a natural
consequence
Slide 23
Slide 23 text
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
a generator…
Slide 24
Slide 24 text
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
…or start from
scratch
Slide 25
Slide 25 text
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
maybe a
dependency
manager
https://zapier.com/engineering/continuous-integration-jenkins-docker-github/ http://www.melin.me/
https://www.behance.net/gallery/BEM/4394265
versioning
control system
We’ve fallen into the trap of talking
about what “the browser” is capable of,
as though it were indeed a single
runtime environment.
Jeremy Keith
https://adactio.com/journal/8245
LEARN BY Doing
http://seanwes.com/2013/doing-what-you-love/
Slide 38
Slide 38 text
Find a pet project
https://www.flickr.com/photos/johnjoh/368511463
Slide 39
Slide 39 text
Be passionate
https://xkcd.com/303/
https://www.flickr.com/photos/magrolino/8009627509/
Slide 40
Slide 40 text
Study
http://blog.codinghorror.com/learn-to-read-the-source-luke/ https://www.flickr.com/photos/magrolino/8009627509/
Slide 41
Slide 41 text
We are privileged, deserve it
Slide 42
Slide 42 text
Basically
The wheel
Slide 43
Slide 43 text
Damian Wielgosik @ Front Trends
Slide 44
Slide 44 text
I’m active in a few online groups
Slide 45
Slide 45 text
Stupid questions?
Slide 46
Slide 46 text
how do I build {{whatever}}?
whatever
“a responsive
website”
“a 2 column
layout”
“a vertical
centered div”
Slide 47
Slide 47 text
Stupid answers are way
worse than stupid
questions*
* there is no such thing
Slide 48
Slide 48 text
how do I build {{whatever}}?
Let me google
that for you
Slide 49
Slide 49 text
very funny the “let
me google that for
you” joke
no one ever
Slide 50
Slide 50 text
but it goes worse than that
Slide 51
Slide 51 text
I’ve heard everything
http://t3n.de/magazin/open-device-labs-webprojekte-nativ-
testen-testlabor-furs-232793/
http://blogs.which.co.uk/technology/computing-helpdesk/google-
chrome-vs-internet-explorer-which-web-browser-is-best/
“accessibility
is overrated”
“in ie6 there are
no div, just tables”
Slide 52
Slide 52 text
And surely I produced my
fair amount
of BS in my career.
Slide 53
Slide 53 text
no matter what
Slide 54
Slide 54 text
don’t be a bully
Håkon Wium Lie
Brendan Eich
Slide 55
Slide 55 text
but it goes worse than that
Slide 56
Slide 56 text
Software development is a
learning process
working code is a side effect
Alberto Brandolini
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
Your framework
Slide 62
Slide 62 text
About the wheel…
http://www.pixalo.com/community/monochrome-photography/interesting-
old-wheel-43657.html http://www.toplista.it/i-10-pneumatici-piu-venduti-mondo/
Slide 63
Slide 63 text
Basically
A final thought
Slide 64
Slide 64 text
No need for ninjas
http://smg.photobucket.com/user/raskasbw/media/computer-ninja.gif.html
Slide 65
Slide 65 text
just curious, competent
people, delivering value
Slide 66
Slide 66 text
aware of their
responsibilities
http://stock-clip.com/video-footage/dictionary/2
Slide 67
Slide 67 text
and loving their job
https://www.pinterest.com/malagasmith/pins-of-pins-buttons-really/
Slide 68
Slide 68 text
or you can join me as a
Pirate
if you like funny labels
Slide 69
Slide 69 text
it’s not needed
Slide 70
Slide 70 text
but still better than ninjas
http://www.urbandictionary.com/define.php?term=Pirate
Slide 71
Slide 71 text
way better, if you ask me
http://roboworks.deviantart.com/art/Pirates-Vs-Ninjas-Annual-cover-89079359
Slide 72
Slide 72 text
marco@fromthefront.it
http://cedmax.com
@cedmax
any question?