METEOR.JSMOBILE APPS(WITH FAMO.US AND CORDOVA)
Created by Andrew Reedy / @andrewreedy
APPLICATIONREQUIREMENTS
Cross PlatformReal-time
Native Feel (Physics and speed)Share code between server and client
Offline AccessQuick setup and deployment
Scalable
METEORMeteor is a fairly young (0.8.1.3) JavaScript framework that
works on top of Node and has a few interestingcharacteristics.
(You must be okay with not having everything built for you.You are on the edge.)
METEORSingle page web app
Reactive - Data changes are reflected through out the appShare code between server and client
Distributed Data Protocol not RESTPub/Sub - Data everywhere
Minimongo - Run queries on the clientAccounts Packages (including oauth)
Asset Compiler / Packaging+More
REACTIVITY / DATAMongoDB - support out of the box
Oplog tailing - interprets the operations log so that itdoesn't slow down the db
Reactive Redis - automatically indexes JSON data andallows you to subscribe to any part of it.
Elastic Search - easily river meteor data into ES andprovides methods to search it.
RethinkDB - they recently release change feed; working ona meteor package.
DATA EVERYWHERE
Mirrors a subset of the data to the client.No Ajax calls needed
Data is there instantaneously.Handles latency compensation.
PUBLISHING
// on the serverMeteor.publish('posts', function(author) { return Posts.find({flagged: false, author: author});});
METEORITE / ATMOSPHEREMeteors package system is still premature so PercolateStudio created meteorite and atmosphere (soon will be
combined into meteors package system).Use NPM packages and now with Famono we can use bower
/ github packages directly npm install -g meteoritemrt add cordovamrt add appcachemrt add fastclickmrt add famonomrt add elasticsearch
PACKAGES / COMMUNITYEasy to create packages and publish them. Huge community
of package developers. // Smart JSON{ "name": "visit-tracker", "description": "Log visits for internal analytics and conversion attribution (GeoIP, UserAgent, Traffic Source)" "homepage": "https://github.com/andrewreedy/meteor-visit-tracker", "author": "Andrew Reedy", "version": "0.0.5", "git": "https://github.com/andrewreedy/meteor-visit-tracker.git", "packages": { "headers": {}, "collection-hooks": {} }}
// Publish Packagemrt release .mrt publish .
// Use Packagemrt add visit-tracker
CORDOVA (3.5) (XCODE 5.1)Apache open source library that exposes mobile native APIs
to javascript (leaderboard example) sudo npm install -g cordovacordova create MeteorShowers com.meteorshowers "Meteor Showers"cd MeteorShowerscordova platform add ioscordova preparecp -R ../designs/icons ./platforms/ios/Meteor\ Showers/Resources/cp -R ../designs/splash ./platforms/ios/Meteor\ Showers/Resources/cordova plugin add https://github.com/raix/Meteor-cordova.gitmv platforms/ios/www/index.example.html platforms/ios/www/index.htmlcp ../designs/meteor.cordova.css platforms/ios/www/css/
CORDOVA APISAccelerometerCameraCaptureCompassConnectionContactsDeviceEvents
FileGeolocationGlobalizationInAppBrowserMediaNotificationSplashscreenStorage
PROBLEMWeb apps don't feel like native apps.. they don't have the
smooth physics and fast GPU rendering
FAMO.USFree & Open SourceFamo.us is a JavaScript framework that includes an opensource 3D layout engine fully integrated with a 3D physicsanimation engine that can render to DOM, Canvas, orWebGL.Famo.us universityInspired by video game physics enginesBypasses HTML5
RENDERINGRenders to the GPU (using css matrix3d)Combine and multiply the matrices and insert into theDOM as oneUses requestAnimationFrame() to render at 60 frames persecond or screen refresh rate
SURFACESBuilding blocks of UIContain html and cssFamo.us positions and animates themMap to GPU textures (just div's)
TRANSFORMSUses GPU matrix3d to animate and move around surfaces
Audio / 3DLightbox
METEOR + FAMO.USThere are few meteor packages that bring famo.us into
meteorFamono - Favorite so far
mrt add famono
Famous Components - Wrap Famo.us in BLAZEcomponents for meteor (not sure how I feel about this) mrt add famous-compontents
Yelp ExampleMeteor Shower Example
DISCONNECTEDModern buildings, nano tech, electric cars .. still can'tconnect to the person who lives above youConstantly flooded with updates about what high schoolfriends had for lunch.. but have no idea who the peopleyou see everyday areEasy to connect to anyone in the world who likes a certaintopic.. Hard to find out who shares similar interests inyour buildingOver half the world’s population now lives in an urbanarea, and 75% will call a city home by 2050
NEW URBANISMThere's a lot of people trying to solve the issue of fittingmass amounts of people in a small geographic area(sustainable products, modern architecture, verticalfarming, city planners, ride sharing)New urbanism - organize cities in such a way thatanything someone needs is in walking / biking distanceSharing economy movement (Peers) .. a new way to dealwith limited resources and build communityResource based economy - Jacque Fresco, is anAmerican futurist/engineer talked of a future buildingdesign that encompassed everything we need in our dailylife.
FINALLY CONNECTEDTower is a geo-specific social networking app and
community platform that connects you to the people whereyou live, work and play
Residential Tower (condos, dorms, barracks)Office TowerTemporary Tower (resort, cruise ship, etc)
A FEW USECASES..You've just moved to a new city and don't have any friends... download Tower instantly make connections!First day moving into the dorms ... what if you couldquickly connect with the other guy who likes rugby in yourbuilding!You're a freelance designer in a co-working space.. Whoknew there was a law firm upstairs in desperate need of aredesign?
BASE FEATURE SET3 Towers, each with a customizable profilePublic / private groups (company, yoga friends)Events (tower happy hour)Internal micro-economy (offer laundry service, give awaycouch, share a kayak)Tower feed (introduce yourself)Interests (see who else surfs in your building)Local / internal deals (10% off the attorney in yourbuilding, 20% off the bar next door)
COMMUNITY ENGAGEMENTPartnering with commercial real estate companiesExposing community engagement metricsBuilding the tools to interact with community
LAUNCHING OUR BETASign up for our private beta at https://tower.ioOur first test buildings 101 W Broadway & The MarkDowntown San Diego
TO STAY IN SAN DIEGO..?Growing community of tech startups in San DiegoInflux of VC firms because of SD's Biotech industryInnovative organizations forming around the community:EvoNexus, CommNexus, Qualcomm Labs, I.D.E.A District,Irvine Company, Makers Quarter, FabLab, SD CivicInnovation Lab, Cyber Hive, San Diego Startup Week
OPEN CITY PROJECTTower working with SD Civic Innovation Lab#hackforchange to show that citizens can be civicalyengaged in more productive ways than sitting in a councilmeetingVote on projects to work on and prototype in the monthof June
CITYBOARDMetrics dashboard to put up around the city of San Diegoto display real-time city data. (economic disparity)
EMERGENCYMESHUsing Open Garden mesh network to distribute and cacheemergency data in the event of a catastrophe such as thefires where the network is down
SAN DIEGO A CENTER FORINNOVATION
If we take a piece of advice from Vanilla Ice: ... stopcollaborate and listen.. we can work together to make San
Diego not just America's finest city to live in but also a centerfor tech innovation.