Meteor meetup
Download as PPTX, PDF1 like347 views
These are the slides from the Intro to Meteor meetup held as the first Charlottesville Web Developers Meetup group meeting. These slides contain information contained in the slides at http://www.slideshare.net/MeteorJS/meteor-intro2014 by Robert Dickert. Special thanks to the Core Meteor team for making the technology as well as helping meetup organizers with slides and prep information. Also thanks to the Center for Open Science (http://centerforopenscience.org/) in Charlottesville, Virginia for hosting us.
Ad
More Related Content
What's hot (20)
Similar to Meteor meetup (20)
Ad
Recently uploaded (20)
Ad
Meteor meetup
- 1. Intro to MeteorDavid Brear @davidbrear04 - github.com/DavidBrear Slides adapted from: http://www.slideshare.net/MeteorJS/meteor-intro2014
- 2. What We’ll Cover • What is Meteor? • Meteor App Structure & Basic Code Explanation • Do a live coding example • Show example apps • Learning Resources
- 3. What is Meteor? • Open source platform for building web and mobile apps in Javascript • Built on NodeJS (JS on the front and back) • Rich user experiences (Reactivity) • Collaborative multi-user applications • Cross-platform apps (web, iOS, Android) • Fast Development
- 4. How Modern Apps Look & Feel • Focus on features instead of worrying about application setup and configuration. • Meteor’s Goal: Facebook-quality apps without Facebook’s money.
- 5. Components • LiveQuery - Live Database Connectors • Realtime database queries. (Replication slave, DB triggers, pubsub, polling) • DDP - Distributed Data Protocol (Websocket-based data protocol) • Subscribe to changes in the database. • MiniMongo - MongoDB in-memory Javascript • Run database queries in the client. • Tracker - Reactive Programming made simple. • Rerun functions when data changes. • Blaze - Reactive UI Templating • Keep the view up-to-date with your data with simple HTML templates. http://meteor.com/projects
- 6. App Structure From meteor create my_project to Full Meteor App Structure
- 7. Initial Project Files • Create initial project files:
- 8. Basic App Template Meteor only uses head, body, template tags helper Named template
- 9. Meteor Templates • Uses HTML mixed with Spacebars • {{> templateName }} • {{ helper }} • Has helpers and events for control flow.
- 10. How Helpers Work Attribute of Template *Note: Session provides getter/setter to store an arbitrary set of key-value pairs.
- 11. How Events Work Event is a key of ‘Action Selector’
- 12. Putting It All Together Basic way of controlling where code runs.
- 13. Meteor App Structure my_project — /client — /server — /lib — /public • client - code only run on the client. • server - code only run on the server. • lib - code run before any other code. • public - assets
- 14. What We Are Missing? • Pub/Sub to Collections (Shown in example) • Routing (Not shown today; womp! womp!) • Animation (Not shown today) • Deployment (Not shown today) • Mobile app deployment (This is really cool but sadly, not shown today.)
- 15. Live Coding Example We’ll do it LIVE!
- 16. Example Apps • Todos - Full-featured todo list app • LocalMarket - Mobile social engagement app meteor create --example todos meteor create --example localmarket
- 17. Learning Meteor • Meteor Learn • http://www.meteor.com/learn • Official Meteor Tutorial • http://meteor.com/install • Discover Meteor (This is a great book) • http://book.discovermeteor.com/ • EventedMind • https://www.eventedmind.com/ • Official Meteor Docs • http://docs.meteor.com
- 18. Special Thanks • Center for Open Science • http://centerforopenscience.org/ • Alice Yu, Robert Dickert, and the rest of the team at Meteor. • Everyone who came out to listen to this!