Feedbackr is an Opensource and free survey app. π. Use it as a starter app to build your own custom feedback collection App or use it as your reference to explore a production ready MERN App.
If you are exploring MERN stack, this app will show you:
-
how to use React and Redux
-
Routing with React routing
-
Using reusable Redux Forms
-
Payments with Stripe
-
Google OAuth Authentication with Passport.js
-
Persisting data into MongoDB and using Mongoose
-
Using webhooks
-
Sending Automated Emails
-
API key handling techniques and Deployment strategy with configs to Heroku
contributions are welcome! Learn how to contribute to this repo here
πLive link
use
4242 4242 4242 4242
as sample credit card
Please follow these instruction in the order presented for a smooth setup process. since this app relies on many other third party dependencies, it is essential that we get this right.
-
Clone the repo using
git clone https://github.com/shashankkatte/feedbackr-mern.git
or if using ssh
git clone [email protected]:shashankkatte/feedbackr-mern.git
-
Navigate into the root folder
cd feedbackr-mern
and runnpm install
this installs all the npm dependencies for our servir side of the project.
-
Next navigate into the client directory
cd feedbackr-mern/client
and run
npm install
to install dependencies for React App
we use a few third party services and dependencies here's how to set them up, yes everything is FREE!
-
Create a google project and get a OAuth API key here
-
Register for account at MongoDB Atlas
-
Register for Stripe payments here. Once you login, on the left hand navigation click developers and then API Keys. Next Next click create a secret key. You will need these keys for later in cofig keys.
-
Register for SendGrid and get API Key here
-
Configure ngrok for local tunneling here
- under the
config
folder create a new filedev.js
and add the following keys, Make sure you substitute the key values to your own values
// Dev.js dont commit to git
module.exports = {
googleClientID:
'<Your GoogleAPI KEY>',
googleClientSecret: '<Your google client API KEY>',
mongoURI:
'<Your DEV MngoDB URI>',
cookieKey: '<Just some random characters>',
stripePublishableKey: '<Your Stripe publishable key>',
stripeSecretKey:'<Your stripe secret key>',
sendGridKey:'<Your sendgrid key>',
redirectDomain: 'http://localhost:3000'
};
Open your terminal navigate to the project directory and run
npm run dev
πLive link
This App is originally deployed on Heroku, For production configuration files refer to config/prod.js
for the necessary keys and replace the values with your production environment variables.
This App draws inspirations from many publicly available resources and tutorials on MERN stack.
Special thanks and mention to some great online instructors : Brad Travesy | maximilian schwarzmΓΌller | Stephen Grider and many many more...