This application is an example MongoDB Stitch application built for the PhillyMUG meetup in March of 2019.
It is a simple blog where anyone can register an account and post. It is all powered via serverelss and front-end JavaScript and HTML.
- MongoDB Atlas - MongoDB Database as a Service
- Mongo Stitch - Serverless platform for MongoDB Atlas
- AWS S3 - Storage
- AWS Rekognition - Object and Scene Analysis
- Azure Cognitive Vision API - Object and Scene Analysis
- BootStrap 4 - Layout
- Font Awesome - Icons
- jQuery - DOM maniuplation
- Create a MongoDB Atlas account
- Deploy a cluster (free tier of M0 should work)
- Create a database called
blog
with a collection calledblog
- Create a Stitch application and connect it to that cluster and the DB
- Get your AWS IAM API Key and update the
StitchApp
AWS config.js
with your key - Create an S3 bucket within the AWS console
- Generate a API key for Azure
- Enable Azure Cognitive Vision API
- Put key in the
values/cvaAccessKey.json
- Using
stitch-cli
push the Stitch app - Enable hosting on your Stitch App
- Edit
Hosting/includes/conf.js
and update top few lines with stitch app name, bucket, etc - Put all files in
Hosting
folder into Stitch hosting - Edit email/password provider links for your new hosting URLs
- Confirm all rules, users, providers, etc were imported
- User visits the application
- Home page will show most recent 10 blog posts
- User can register (
user/signup.html
) for a new account - Email goes out to user (check your junk folder!)
- User cofirms via
user/emailregistration.html
- User goes to
post.html
- If not logged in, they are redirected to
user/index.html
where they login then bounce back topost.html
- User chooses a hero image form thier computer, chooses upload
- App will push this image to S3 and update the path
- User enters a title and post and submits
- Trigger runs in background to run Rekognition and adds field on what Rekognition thinks the image is
- Trigger runs in background to run Cognitive Vision API (cva) of what Azure thinks the image is
- All viewable in
index.html