Git Product home page Git Product logo

ecommerce-part-two's Introduction

eCommerce Project - Part II

##Objectives

Build a simple backend using Node, Express, and MongoDB and connect it to a simple front-end Angular application

During this project you will practice using an ORM (Mongoose) to work with your database. You will also solidify your understanding of models, schemas, middleware, and indexing.

Resources

The Domain

Most companies sell some sort of product and service. For this project we will simulate buidling an eCommerce application. We will finish this project over the next two days.

Today you are going to convert the current Mongo functionality to use Mongoose. You will be creating a Product model and replacing the current product functionality with that model.

Use this README for instructions today, but use your codebase and push to your repository from day one.

Step 1: Set up Mongoose

At your application's root folder, run the following command via command line: npm uninstall --save mongojs. This will remove mongojs from your node_modules folder and from your package.json. Remove or comment out any logic related to MongoJS.

Breakpoint: After removing everything MongoJS related, you should be able to start up your server and run it without any errors.

After MongoJS is removed, install Mongoose and follow the instructions to connect to MongoDB. In your code, connect to Mongo after your Express app has started listening.

Breakpoint: After setting up Mongoose, you should be able to listen with your Express app and with Mongoose. The Mongoose connection method takes a callback as the last argument. That callback sends one argument, error. console.log the error parameter. If it's undefined, you've connected correctly. See this SO answer for an example.

Step 2: Create Product Model

Remove or comment out the logic from your endopints that handle creating, reading, updating, and deleting products. You are going to create a Mongoose Product model and do your CRUD actions that way.

Create a new Product schema and model. Give it the following fields:

  • Title: This will be the title of the product
  • String
  • Unique
  • Required
  • Index
  • Description: This will describe your product
  • String
  • Required
  • Price: This will be the price of your product
  • Number
  • Required
  • Minimum of 0

Feel free to add any additional fields you feel are necessary.

Now go to each of your product endpoints and put the necessary Mongoose logic to Create, Read, Update and Delete products. Refer to those links for documentation.

NOTE: Remember to keep your code looking clean and neat. It would be wise for you to outsource the logic from each of your endpoints to a product controller or something similar. You should also outsource your schema and model declarations to a Product file. If you need more guidance on how Node's require and export system works, check out this blog post.

Breakpoint: At this point you should be able to manipulate the product data via your Express endpoints just like you could when MongoJS was installed. Test this using POSTMan and the command line or RoboMongo. After you test the endpoints, go to your front-end product interface (if you were able to build it yesterday) and make sure that the interface still works and manipulates the data like you expect. You may have to update your data models on the front-end to match the model we just set up with Mongoose.

The next step will integrate your backend to the front-end application that you built yesterday. You will also expand the application to include new functionality.

Step 3: Connect Front-End

Connect your front-end to your server. Again, you are free to do this how you like.

Make sure that you have an interface where users can view products and add them to their cart. Tomorrow you'll add the actual back-end functionality, but it will give you a head start if you can build the interface today.

Breakpoint: You should now be able to see all of the products on the front-end.

Once you've finished the front-end, take some time to style your app and make it user-friendly. Tomorrow you will finish the app by adding a a cart to the user, allow them to check out, and keep track of their current and past orders.

Contributions

If you see a problem or a typo, please fork, make the necessary changes, and create a pull request so we can review your changes and merge them into the master repo and branch.

Copyright

© DevMountain LLC, 2017. Unauthorized use and/or duplication of this material without express and written permission from DevMountain, LLC is strictly prohibited. Excerpts and links may be used, provided that full and clear credit is given to DevMountain with appropriate and specific direction to the original content.

ecommerce-part-two's People

Contributors

cahlan avatar devlemire avatar jacob-israel-turner avatar jasonalmaturner avatar jasontowner avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.