Skip to content

Sample app that shows how to use MongoDB change streams and Pusher in a Node.js/React app

License

Notifications You must be signed in to change notification settings

eh3rrera/realtime-mongodb-pusher

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

realtime-mongodb-pusher

React application that allows you to add and delete tasks. It communicates to an API implemented in Node.js that saves the changes to a database. The Node.js script also receives these changes using change streams, parsing them and publishing them to a Pusher channel so the React application can consume them.

Follow the tutorial here.

Getting Started

  1. Clone this repository.
  2. Create a Pusher app.
  3. Enter your Pusher app information in server/server.js and in client/src/App.js.
  4. In a terminal window, start MongoDB as a replica set of one server with the command: mongod --dbpath <DATA_PATH> --replSet "rs".
  5. In a separate terminal window, run mongo, the MongoDB client.
  6. If this is the first time you set up a replica set, execute the command rs.initiate().
  7. Create the database tasksDb (use tasksDb) and the collection tasks (db.createCollection('tasks')).
  8. In a separate terminal window, cd into the server directory and execute npm install to download the dependencies and then, npm start to start the server.
  9. In a separate terminal window, cd into the client directory and execute npm install to download the dependencies and then, npm start to start the app.
  10. A browser window will open, you can open another one to see how the task are replicated in realtime.

Prerequisites

Built With

  • MongoDB - NoSQL database
  • Node.js - A JavaScript runtime
  • React - A JavaScript library for building webapps
  • Pusher - APIs to enable devs building realtime features

Acknowledgments

  • Thanks to Pusher for sponsoring this tutorial.

LICENSE

MIT

About

Sample app that shows how to use MongoDB change streams and Pusher in a Node.js/React app

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published