redgeoff / mson-getting-started

MSON: Getting Started Example
Apache License 2.0
15 stars 3 forks source link

mson-getting-started

Circle CI

This is a sample app that will get you started with MSON. You can think of it as a "Hello World" type app that displays a simple list of contacts that can be edited, filtered and sorted.

Running the app

The app logic resides in components.js. Look at what you get with just a few lines of MSON!

Making it Real-Time

If you are feeling adventurous, you can make the app real-time capable by using Firebase. Simply sign up for a free account at firebase.google.com and then modify the store in components.js so that it has your details:

store: {
  component: 'FirebaseStore',
  apiKey: 'YOUR-API-KEY',
  authDomain: 'YOUR-SUBDOMAIN.firebaseapp.com',
  projectId: 'YOUR-PROJCT-ID',
  collection: 'contacts'
}

You'll also have to edit index.html and add:

  <script src="https://www.gstatic.com/firebasejs/5.4.1/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/5.4.1/firebase-firestore.js"></script>

After configuring the FirebaseStore, you'll be able to edit your contacts in one browser window and see them update in real time in another browser window.

create-react-app

Note: mson-getting-started uses create-react-app with very few changes.