Coder Social home page Coder Social logo

prime_peer_db_2016's Introduction

Assignment Tracker

Assignment Objectives

Practice MEAN Stack with your MongoDB and Angular chops. This is also an opportunity to practice using node modules and services to practice code encapsulation.

Create a MongoDB application to store student assignment information, including the assignment name, the student's identity, their score on the assignment, and the date it was turned in. Only the identity and date completed are required.

Tying it all together

When the page loads, display a list of all assignments that are in the database.

Create text inputs that will create assignments using the "/assignments" POST route.

Create an "Assignment" Model

In your Node application, create a folder called models. Within that folder create a mongoose model named assignments and give it some properties that an assignment would have.

The minimum requirements are: assignment_name, student_name, score, and date_completed.

When creating your model it may be useful to see some Mongoose Schema documentation, and also to look at all of the MongoDB Types

Create GET and POST routes for /assignments

Next you'll need to be able to access the assignments via an API. Use a combination of REST methods and Mongo methods to make a route for reading all assignments, and for creating new assignments.

Hint: Use req.body to access the data that is passed into the API. Also, be sure to test them with Postman client.

Additional GET functionality

In addition, the route that reads all assignments should also accept an ID. When it receives the ID, it should be given to the mongoose function Assignments.find and return only that one. Otherwise if no ID is supplied, it should return all assignments.

HARD MODE

Once you have that working add a button next to each assignment record. When the button is clicked, it will delete the record from the database using Ajax. You will need to create a DELETE route, and will need to use Assignments.findByIdAndRemove. Feel free to break this into two steps (first find, then remove).

PRO MODE

Finally, add another button to each record on the index that allows the user to update the database entry. This will also need to be done via Ajax. Updating should either be done in a modal window, or a series of inputs that shows/hides when the edit button is clicked. You will need to pass the assignment ID and the form data to a new PUT route, and to Assignments.findByIdAndUpdate, or alternatively, Assignments.findById followed by a model.save().

Setting Up

Create a new NodeJS application.

Create a basic NodeJS application with an Express server. Set up a router called index.js (for your home page) and also a router called assignment.js (for your assignment routes).

Get connected to your database.

Try connecting to your database by creating a node module for the database connection logic. You can use the same convenience methods to connection that we saw in the code challenges Monday.

var mongoose = require('mongoose');

var mongoURI = "mongodb://localhost:27017/assignments";
var MongoDB = mongoose.connect(mongoURI).connection;

MongoDB.on('error', function (err) {
    console.log('mongodb connection error:', err);
});

MongoDB.once('open', function () {
  console.log('mongodb connection open!');
});

What does this code do?

  • Line 1: requires MongoDB and lets us use the Mongoose functions.
  • Line 3: This is just a URL to the mongo database, which you set up earlier. The URL specifies a document store named assignments (this name is chosen by us)
  • Line 4: Connects to the database using the URL from line 3. It will return an object that gives us access to the client.
  • Line 6: The "on error" function allows us to see a console log when it can't connect.
  • Line 10: The final "once open" function lets us know when it's connected.

prime_peer_db_2016's People

Contributors

huckbee avatar joeltmiller avatar mulchy avatar

Watchers

 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.