Embed Size (px)
Citation preview
Ember.js, Firebase +
Firebase Hosting
1
Ember.js, Firebase + Filepicker.io
2
Ember.js, Firebase +
Firebase Hosting
4
Ember.js, Firebase +
Firebase Hosting
5
How I learned to stop worrying
and love the client
Brendan OHaraPlease note: This is not actually me.
a software guy
a Start-up guy
a business guy
a married guy
a dog guy
from Philadelphia
Live in New York City
Berlin, Germany
Sofia, Bulgaria
Waterford, Ireland
London, England
Port au Prince, Haiti
TL;DR
Enough about me
30 Minutes
100 Slides
Don’t worry…
Time for Questionsand maybe a video from the best rapper ever
Let’s get started
But before we start..
I need some form of tacit consent regarding
the basic premise of this presentation
Roommate Agreement (of a sort)
Here are some things that we all need to agree to:
You are a front end developer
You are a Ember.js developer
You are a React.js developer
You are a Angular.js developer
You are a product manager
Or you are a UX designer
You like building applications that people can use and get
real tangible value from
You are NOT building the next Facebook
You are NOT building the next Twitter
You are NOT building the next Instagram
Almost no one is…
There is a quote from John Locke
We have to get off this islandJohn Locke
All wealth is the product of laborJohn Locke
What you develop and how you develop it is your labour.
Your wealth (material, emotional, spiritual) is a
product of that.
I will take your stunned silence to mean tacit approval
Roommate Agreement complete
So what am I here to talk to you about?
Ember.js & Firebase
52
Innovation & Commoditization
53
Now is not nap time.
Hear me out. I need to put my MBA to use
somehow during this talk
Commoditization: the process where today’s
Innovation becomes tomorrows
Cost of doing business
Let’s see that in a cool diagram
New Idea
Custom Built
Products
Service
COMMODITIZATION
Utility
INNOVATION
Ideas start out ‘bleeding edge’, then ‘custom built’ versions. As adoption
increases they become ‘products’ and eventually ‘services’ or even ‘utilities’
New Idea
Custom Built
Products
Service
COMMODITIZATION
Utility
INNOVATION
Let’s map this to something we know a
little better.
Real Time
Web & Mobile SPA’s
Server Side Applications
Server APIs
COMMODITIZATION
Database File Storage
INNOVATION
Real Time
Web & Mobile SPA’s
Server Side Applications
Server APIs
COMMODITIZATION
Database File Storage
INNOVATION
Firebase & Hosting allows Ember.js devs to
focus only on where they can provide the most
Innovation
Innovation & Commoditization
66
Ember.js & Firebase
67
We are setting a new site:
• Style with Material Design w/ Ember-Paper • Login and User management w/Firebase Hosting • Full feature chat rooms w/Firebase • Custom Avatars w/Filepicker.io • Social Logins with Torii and Torii-Fire
68
But first we need to signup for and configure
Firebase, Filepicker, Twitter, Facebook, Github & Google
70
Manage your Site
NoSQL Style Data Drill downs
Editing data is easy
You can configure security rules
You can configure validations
You can manage presence
You can mock requests against Firebase
Some basic analytics
@/pw or third party auth
Manage deployments and revert
Easy as Pie
Let’s get ready to Ember
• $ npm install -g ember-cli
• $ ember install:addon emberfire
• $ ember install:addon ember-paper
• $ npm install --save-dev broccoli-sass
• bower install filepicker
Add our Firebase instance and file picker key to our config env file
Setup our content security policy
Set the filepicker key in our app.js
Set up a default FB adapterPointing to our instance
Setup a default FB serializer
Set up the routes we need
Setup our Message Room Model
Setup our Message Model
Setup our User Model
Setup our Side Nav
Setup our Chat UI
Deployment is super easy
https://github.com/brendanoh/moai
https://www.firebase.com/hosting.html
https://github.com/miguelcobain/ember-paper
Play with Moai: Tests and PR’s are wanted
Sincere thanks to • Russell Jones • Tim Stirrat • Max Minkoff • And whoever made these gifs
As promised…
That’s all folksAvailable for all your Ember.js and Firebase Consulting Needs [email protected] Twitter: @BrendanOHara GitHub: @BrendanOH
One more thought…
It’s a trick question.
Be Zoidberg.
Always be Zoidberg
