Emaily

A large feedback-collection app. This mega app includes the full gamut of features, including everything from authentication to email handling. The app can be used to send mass emails to a big list of users for the purpose of collecting feedback.

Motivation

Full-Stack Web application that profiles the advanced features of React, Redux, Express.js, Node.js, and MongoDB.

Learning Objectives

• Architectural considerations of building a full stack app
• Connect a front-end Create-React-App server to a NodeJS and Express backend
• Communicate data from the Mongo database to the React application
• Understand how to route user requests on the front end with React Router and on the backend with Express
• Build reusable user inputs with Redux Form, complete with navigation
• Handle credit cards and receive payments from users with Stripe
• Engage users with automated emails
• Enhance authentication flows in the app with Google OAuth authentication
• Separate production and development resources with advanced API key handling techniques
• Educate users on how to use the app with custom build landing pages

Demo

Tech/framework used

Front-End

• React.js
• Materialize-css
• JavaScript
• JSS
• ES6
• Axios
• http-proxy-middleware
• Lodash
• React-Redux
• React-Router-Dom
• React-Stripe-Checkout
• Redux
• Redux-Form
• Redux-Thunk

Back-End

• Mongo Database
• MongoDB.Atlas (For deployed Database)
• Mongoose Schema
• Node.js
• Express.js
• 0auth
• Concurrently
• Cookie-Session
• Local Tunnel
• Lodash
• Passport.js
• Path
• Path-Parser
• Send Grid
• Stripe

API

• Google Client API
• Stripe API
• Send Grid API

Deployment

• Heroku