Food-Order-App

JavaScriptVueJSNodeJSFirst Timer FriendlyToolsE-Commerce

Simple Food Ordering Website (MEVN, Bootstrap, Firebase)

Open issues

Last 30 days

3
Hack-🎃-fest
0
PRs opened
0
Contributors

Overview

Simple food ordering web application built using VueJS, Firebase, NodeJS and MongoDB.

Preview

Checkout the Live Demo of this project First:

Test User Credentials

  • Email: user@gmail.co
  • Password: 123456

Test Admin Credentials

  • Email: admin@foodsite.com
  • Password: 123456

Run this Project on Local Environment:

Prerequisites

  1. NodeJS installed on your Local machine
  2. MongoDB installed on your local machine or have an Atlas Account.
  3. A Gmail Account for Firebase Services.
  4. A PayPal Account and a Sandbox account for testing purposes. (For now, you can ignore this step, Currently I am planning to shift payment services to Stripe/RazorPay)

Credentials Setup

  1. Create a MongoDB Atlas Account for connecting this app with MongoDB or you can use your local MongoDB. Find Tutorials here.
  2. Setup a Firebase Project for using Firestore and Authentication. Find Tutorials here.
  3. Setup Firestore and Enable Authenitaion Methods
  4. Generate Private keys for Firebase Admin. Find tutorials here.
  5. Create a PayPal account and Sandbox account. Find Tutorials here

Project Setup

  • Clone this Repository or Download the zip File
    $ git clone https://github.com/nil1729/food-order-app.git
    
  • Create a new file named secret.json on config directory which contains Generated Private keys from Firebase project.
    {
        "type": "service_account",
        ...
    }
    
  • Create another cofig.js file on /client/src/firebase. Put all firebase config Credentials for Frontend. (In following Format)
      const firebaseConfig = {
          apiKey: "",
          authDomain: "",
          databaseURL: "",
          projectId: "",
          storageBucket: "",
          messagingSenderId: "",
          appId: "",
          measurementId: ""
      };
      export default firebaseConfig;
    
  • Create a .env file on root directory. Which Contains all necessary Secret Credentials (for backend only) for this site.
      DB_URI = <- Mongo Atlas URI->
      PAYPAL_CLIENT_ID = <- PayPal Sandbox Client ID (Also use your own client ID on Frontend)->
      PAYPAL_CLIENT_SECRET = <- PayPal Sandbox Client Secret (Only for backend server to verify purchase)->
    
  • Run this Command
      $ npm run dev  // to start Vue Development server and Backend server together.
      $ npm run server // to start only Backend server
      $ npm run Client // to start Vue Development server only
    

Admin Setup

  1. Run this Command on root directory
      $ npm run admin
    

Currently seeking

DevelopersFrontend DevelopersBackend DevelopersDevOpsMaintainersCode ReviewersMentors

Contributing

A few guidelines for someone looking to contribute here:

If you're a beginner

  • Fork this repository.
  • Clone your fork on local machine.
  • Make a new branch (say develop-{your_github_id}).
  • Checkout to the new branch with git checkout <new_branch_name>
  • Do the desired changes and commit them with git commit -m '<a nice commit message here>'.
  • push the change to your fork on GitHub with git push origin <your_branch_name>
  • Make a Pull Request to the original repository, i.e. this one.

Note: If you're looking to work on an issue, just make sure that no one else has taken it already. In which case, you can look up other issues or create a new one if you find something missing! :){" "}

Some guidelines related to the code:

  • Try to stick to the syntax style followed in the code(Especially in Frontend Part). This will help everyone to understand your code.
  • Make sure you put comments wherever necessary.
  • Include a visual preview (a screenshot or a GIF? if you are working on Frontend Part) for any visual design changes if possible.
  • If you are working on Backend, please make sure to add the a Simple API Description (you improve/working currently) while raising a PR

If you want to add a new feature, feel free to do so! :D

Happy Coding! 😃

Learn

Resources to learn more about our technology and community.

Built with tea and love by