Skip to content

Perishop is an app that provides nearby shops for you to visit, put a like or dislike on it.

Notifications You must be signed in to change notification settings

atidevs/perishop

Repository files navigation

Perishop App :

Perishop is a web app that provides you with 300+ Shops.

I. Technology stack :

Perishop app is built using the MEAN stack :

    M: MongoDB (NoSQL / Non Relational database)
    E: ExpressJs (Web application framework for building APIs)
    A: Angular (Javascript MVC framework for front end web development)
    N: NodeJs (Environment for running Javascript in the server side)

II. Front End ⚡ Back End :

1. Front End :

📂 client-perishop/

    Contains source code of the front end side :
            - Components : client-perishop/src/app/components   
            - Services : client-perishop/src/app/services
            - Modules : client-perishop/src/app
            - Package.json (dependencies)
            - Angular CLI generated files

📂 client/

    This is the folder you need to try the app, please don't delete it.

    It contains the project build after running :
    > ng build

2. Back End :

📂 routes/

Contains two file :

📃 shops.js :

    Handling Shops end points.

📃 users.js :

    Handling Users end points.

📂 models/

📃 shops.js :

    Holds the definition of Shop Model using Mongoose Schema, for querying the database and handling all CRUD operations that concerns shops records.

📃 users.js :

    Holds the definition of User Model using Mongoose Schema, for querying the database and handling all CRUD operations that deals with users records.

📂 config/

    Holds an Object with database path to connect to using mongoose.

📂 database/

    Holds the database folder where all records go and mongoDB journaling is saved.

📃 app.js

    Is the entry point to the app. It holds a set of imports among which : Express, Mongoose, BodyParser, Passport and other middleware.

III. Features :

Perishop features are :

  1. As a new user you can sign up,
  2. As a registered user you can log in,
  3. As a registered user you can log out,
  4. As a registered user you can access Nearby Shops (Nearby Shops),
  5. As a registered user you can like a shop, therefore adding it to your Preferred Shops (My Shops),
  6. As a registered user you can access your Preferred Shops list (My Shops) that holds all liked shops,
  7. As a registered user you can dislike a shop, thus not displaying it for 2 hours in the Nearby Shops list,
  8. As an unregistered user you cannot access any of the functionalities, but the home page.

IV. Setting up Perishop :

  1. Create a project folder 📂 (eg: perishopApp) and cd into it :

     ~$ cd ..../perishopApp
    
  2. Clone the github repository in your project folder 📂 by running :

     ~$ .../perishopApp  // present working directory
    
     git clone https://github.com/atidevs/perishop.git
    
  3. You need to have MongoDB installed : Community Server

     https://www.mongodb.com/download-center?jmp=nav#community
    
  4. If you are on MacOS or Linux skip this step, if Windows download and install git :

     https://git-scm.com/downloads
    
  5. Once MongoDB and git Installed, open up Git bash and cd into :

     ~$ cd .../mongodb/bin   (... : wherever path you installed mongodb in, usually C:/mongodb/bin)
    

    Then run this command :

     ~$ mongod --dbpath=".../perishopApp/perishop/database"
    
  6. Open up another Git bash terminal :

     ~$ cd .../perishopApp/perishop (... : wherever the path to your perishopApp folder is)
    

    And then run this command :

     ~$ start
    
  7. Open up your browser and go to :

     localhost:3000
    
  8. Congrats! You are on the Home Page


V. Playing around with the Database :

If you want to check the records in the database follow these steps :

  1. Open up the command line (cmd) as an Administrator in windows or (terminal) in MacOS and Linux and run :

     > mongo
    

    Afterwards if you look at the Git bash terminal where you run :

     ~$ mongod --dbpath=".../perishopApp/perishop/database"
    

    You will see somewhere at the end (2 connections now open) : the first connection is from the app itself (When you run ~$ start) and the second is the one we just run : ( > mongo ).

  2. Now you can run these commands :

     > show dbs  // to show all available databases
     
     > use perishop // to use the perishop database displayed among available dbs
    
     > show collections // to show all collections inside perishop db
    
     > db.users.find().pretty() // to list all signed up users and their information
    
     > db.shops.find().pretty() // to list all shops and their information
    
  3. Enjoy ✌️ 💻


Screenshots :

alt text alt text alt text alt text alt text alt text alt text alt text alt text alt text