The perfect cross-platform

@yrezgui for RivieraDev

@RivieraDEV

Make some noise !

Yacine Rezgui

French Tunisian

Lead Front end @ import.io

Lives in London

DevRocket UK meetup

@yrezgui

History of the web

But what is HTML5 ?

Thanks to it, we have powerful apps now 

  • Inbox by Gmail
  • Slack
  • Sqwiggle
  • Import.io

Let's replace

Native Apps !

So powerful, that we said...

But...

Reasons ?

  • Ugly interface like a GeoCities page
  • Slow like Windows Vista
  • Poor features like a Blackberry
  • Not the same API coverage everywhere

How can we fix that ?

Just keep focusing on

this talk    

Ugly design ?

Ugly design ?

For God sake, hire a designer !

 

Bootstrap is a boilerplate, you need to personnalise it

Slow like Windows Vista ?

Slow like Windows Vista ?

  • WebWorkers
  • Canvas
  • ASM.js
  • CSS3 animations

Poor features like a BlackBerry ?

Poor features like a BlackBerry ?

  • Web APIs
  • Chrome & Firefox Apps
  • Atom Shell & Node Webkit
  • Firefox OS
  • PhoneGap

Chrome & Firefox Apps

  • Installed apps (local files)
  • Can be opened outside of the browser
  • Access to low-level APIs (Network, FileSystem, etc.)

AtomShell & Node Webkit

  • Chromium Engine with NodeJS embedded
  • Access to all NPM packages (155 686 today)
  • Update system, Multiplatform

Firefox OS

  • Made only with Web technologies
  • Debug like you debug your website

PhoneGap & Crosswalk

  • Made only with Web technologies
  • Debug like you debug your website

Not the same API coverage everywhere ?

  • Chrome, Firefox and Opera are best friends
  • Microsoft Edge (IE 11 is good)
  • Safari isn't that bad (otherwise PhoneGap)

It's easier to do 3d in Web than styling the <select> element...

Web Components

Create your own elements

  • HTML imports
  • Templates
  • Custom Elements
  • Shadow DOM

Google Music built with Polymer

Bonus

I ❤ React

WhatsApp web with ReactJS

React Canvas

React Native

Just do it !

Thanks !

www.yrezgui.com

twitter.com/yrezgui

github.com/yrezgui

RivieraDev - HTML5, the perfect cross-platform

By Yacine Rezgui

RivieraDev - HTML5, the perfect cross-platform

  • 2,345