Chapter 2. My fridge! A reactive game

 

This chapter covers

  • Building a reactive app with Meteor
  • Understanding the basic architecture for Meteor projects
  • Including jQuery-UI to enable drag-and-drop interfaces
  • Using the Meteor CLI to deploy to meteor.com

In this chapter, you’re going to build your first Meteor application. You could create a new project from one of the included example applications, but creating a small reactive game from scratch gives you a much better understanding of how things work together. At the end of this chapter, you’ll have written fewer than 60 lines of JavaScript and even less HTML to create a game that stores data to a database and updates all connected clients in real time.

You’ll see how templates and code work together and include jQuery-UI in your project. To share your application with the world, you’ll also deploy it to the meteor.com infrastructure with a single command.

2.1. Application overview

My fridge! is a small real-time application that shows the contents of a fridge and allows you to drag products in and out. Unlike a physical refrigerator, this one can be accessed from anywhere in the world and all changes will be visible to every client connected to the server.

2.2. Initial setup

2.3. Creating a layout

2.4. Adding content to the database in real time

2.5. Moving items into the fridge

2.6. Deploying to meteor.com and using the fridge

2.7. Summary