what if everything is awesome? codemotion madrid 2014
DESCRIPTION
As developers, we always have to battle people and media overselling what we do. Just because we use things other people don't understand doesn't mean we use magic. Yet if you look at any "near future" video of cool technology everything is incredibly smooth. We, on the other hand, seem to be far too excited about things breaking and trying to find solutions for any problem - no matter how unlikely it is to happen. In this keynote Chris Heilmann wants to remind us about what we have, what we can do and just how amazing our work really is. And what we can do to keep it like that.TRANSCRIPT
WHAT IF EVERYTHING *IS* AWESOME?
Chris Heilmann (@codepo8) - Codemotion Madrid, November 2014
CARE ABOUT SCIENCE? YOU NERD!!!!
ROCKSTAR • 💩
DAILY FRUSTRATIONS…
USERS HAVE AND EXERCISE THE RIGHT TO DO THINGS DIFFERENTLY THAN WE EXPECT…
NOTHING MUCH HAPPENS WHEN WE MESS UP…
A CONSTANT CALL FOR “PROFESSIONALISM” AND “MODERN WEB WORKFLOW”
THE WEB NEEDS A CONTAINER FORMAT FOR APPS…
https://www.etsy.com/uk/listing/175222880/banana-holder-brown
THE STATE OF APPS…
http://www.w3.org/2014/07/mobile-web-app-state/
GREAT CODE IS GENERIC CODE?
https://medium.com/@fredriknoren/on-generalization-608949214e63
PRE-PEELED BANANAS?
A TENDENCY TO RE-CREATE INSTEAD OF IMPROVING…
LET’S MAKE A STATIC SITE IN 2014…
ADDING LAYERS AND LAYERS OF ABSTRACTION AND TOOLING…
THE REAL DEVELOPMENT PROCESS TENDS TO LOOK DIFFERENTLY.
PERFORMANCE
WEBSITE OBESITY IS NOT UNCOMMON…
HOW SLOW ARE WE? http://www.webpagetest.org/
https://www.youtube.com/watch?v=FEs2jgZBaQA
PERFORMANCE TOOLS AND TESTING…
AMAZING TECH AVAILABLE NOW…
BROWSERS ARE CONSUMPTION AND CREATION TOOLS.
BROWSERS ARE EMULATORS AND REMOTE DEBUGGERS OF CONNECTED DEVICES.
WHAT ABOUT OUTDATED BROWSERS?
<script src="//cdn.polyfill.io/v1/polyfill.min.js" async defer></script>
https://cdn.polyfill.io/v1/docs/features/
POLYFILL AS A SERVICE!
http://css-tricks.com/flexbox-nav-bar-fixed-variable-take-rest-elements/
GETTING VERY FLEXIBLE
*, *:before, *:after { -moz-box-sizing: inherit; box-sizing: inherit;}!html { -moz-box-sizing: border-box; box-sizing: border-box;}!body { padding: 20px; font: 100% sans-serif;}!.bar { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 100%; background: #eee; padding: 20px; margin: 0 0 20px 0;}
margin: 0 0 20px 0;}.bar > * { margin: 0 10px;}!.icon { width: 30px; height: 30px; background: #ccc; border-radius: 50%;}!.search { -webkit-flex: 1; -ms-flex: 1; flex: 1;}.search input { width: 100%;}!.bar-2 .username { -webkit-order: 2; -ms-flex-order: 2; order: 2;}.bar-2 .icon-3 {
}.bar-2 .icon-3 { -webkit-order: 3; -ms-flex-order: 3; order: 3;}!.bar-3 .search { -webkit-order: -1; -ms-flex-order: -1; order: -1;}.bar-3 .username { -webkit-order: 1; -ms-flex-order: 1; order: 1;}!.no-flexbox .bar { display: table; border-spacing: 15px; padding: 0;}.no-flexbox .bar > * { display: table-cell; vertical-align: middle; white-space: nowrap;}
white-space: nowrap;}.no-flexbox .username { width: 1px;}!@media (max-width: 650px) { .bar { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }! .icon { -webkit-order: 0 !important; -ms-flex-order: 0 !important; order: 0 !important; }! .username { -webkit-order: 1 !important; -ms-flex-order: 1 !important; order: 1 !important; width: 100%; margin: 15px; }! .search {
! .search { -webkit-order: 2 !important; -ms-flex-order: 2 !important; order: 2 !important; width: 100%; }}
WEBRTC, WEBGL, WEB AUDIO AND MANY MORE THINGS ARE POINTING TO A HIGH FIDELITY WEB…
https://www.youtube.com/watch?v=4uQMl7mFB6g https://www.youtube.com/watch?v=SmZ9XcTpMS4
TOWARDS AN OFFLINE WEB: SERVICEWORKER
NO MORE SECRETS: WEB COMPONENTS AND SHADOW DOM
http://www.futureinsights.com/home/the-state-of-the-componentised-web.html
THINGS TO DO FOR YOU
LET’S AIM TO BUILD SOLID FOUNDATIONS OF SMALL BITS OF WORKING CODE.
Hating JavaScript is like hating the Internet. The Internet is a cobweb of different technologies cobbled together with duct tape, string and chewing gum. It's not elegantly designed in any way, because it's more of a growing organism than it is a machine constructed with intent.
“
http://www.quora.com/Why-is-JavaScript-the-only-client-side-language-available/answer/Mattias-Petter-Johansson
Mattias Petter Johansson, Spotify
TODAY’S TECH ISN’T GOING AWAY…
If you build a web app today, it will run in browsers 10 years from now. Good luck trying the same with your favorite mobile OS (excluding Firefox OS).
“
http://paulbakaus.com/2014/08/26/the-web-is-built-to-last/
Paul Bakaus, Google (ex. Zynga)
IT IS BUILT TO LAST!
If you enable people world-wide to get a good experience and solve a problem they have, I like it. The technology you use is not the important part. How much you lock them in is. Don’t lock people in.
“IT IS BEAUTIFUL!
Christian Heilmann
DON’T TRY TO EXPLAIN, SHOW AND FIX TOGETHER
DON’T FORGET: THE HUMANS AROUND YOU ARE THE DRIVING FORCE. TREAT THEM NICE AND WITH RESPECT.