Jon Rumsey

An online markdown blog and knowledge repository.

Project maintained by nojronatron Hosted on GitHub Pages — Theme by mattgraham

Class Notes 25-Apr

Warm-up

Not today.

Code Challenge

No review from CC10.

CC11 should be low priority compared to the Lab.

Intro to CC11:

let result = str.split('')
  .joing('-')
  .toUpperCase();

Lab 10 Review

Roger took one for the team GitHub

Important Tidbits:

Lab 11 Can Of Books

  1. Use starter code.
  2. Create db that retreives data using Mongo and Mongoose.
  3. Create a data model aka schema.

Databases

Are a place to store data.

For this project, still using REST Verbs.

Relational vs Non-Relational

ODM

Mongoose

Object Modeling for node.js

Mongoose quick start guide

Why Not Use an RDBMS

Right now everything is javascript (FE, BE, and DB).

Mongo Cloud DB - Atlas

Database View: Shows overview, real time, metrics, collection, profiler, and more.

Connect: Database => Connect button => driver: node.js v4.0+. Copy the line of code into a .env file.

mongodb+srv://rumseytoor:<password>@cluster0.0gxux.mongodb.net/myFirstDatabase?retryWrites=true&w=majority

Edit the IP Access (Allow) List by adding: (0.0.0.0/0 == ANY).

Create a New Project Using MongoDB

  1. Rough-in server.js on an Express server and make sure to add PORT in the .env file, and remember to include cors.
  2. Do 'proof-of-life' test with the Express server.
  3. Create some files: touch seed.js clear.js.
  4. Add Mongoose to the project: npm i mongoose.
  5. Add require statement to server.js: const mongoose = require('mongoose');.
  6. Bring in a schema to server.js: mkdir models touch models/cat.js.
  7. Bring in a schema to cat.js: See code block(s) below.
  8. Bring-in the schema to the server.js file: const Cat = require('./models/cat.js');.
  9. Check the class repo for details on how Mongoose is implemented in server.js.
  10. Connect mongoose: mongoose.connect(process.env.DB_URL);. Add this to '.env' file with full URL from MongoDB Atlas configuration site.
  11. DB Access > Edit > Password > Edit PW > Autogenerate > Copy, then paste into '.env' and remove the angle brackets.
  12. Set up DB name (see class notes) and start nodemon and message in console should indicate Mongoose is active or failed.
  13. Check Mongo DB Atlas to see the new DB that is created in the cloud.
  14. Seed some start data.

Mongo Cluster: The target to the DB instance in cloud.mongodb.

Bring In Mongoose and Create Model

//  bring in mongoose
const mongoos = require('mongoose');
//  extract schema property from the mongoose object
const { Schema } = mongoose;  //  object deconstructor
//  create a cat schema defining how cat objects will be structured
const catSchema = new Schema({
  name: {type: String, required: true},
  color: {type: String, required: true},
  spayNeuter: {type: Boolean, required: true},
  location: {type: String, required: true},
});
//  define model to provide functionality and predefined schema to shape the data
const CatModel = mongoose.model('Cat', catSchema);

module.exports = CatModel;

Note: Property 'required' is ...optional.

Seed Data

  1. Edit 'seed.js' and include the codebock example (below).
  2. Execute 'seed.js' to load the data: node seed.js.
  3. Create a Cats route and call a method called getCats (an async function): app.get('/cats', getCats); etc.
  4. Add the async function getCats() with params (req, res, next) and include a try-catch(err).
  5. Make a call to DB from within getCats using await. await Cat.find({}) // all documents.
  6. Send results with an http 200: response.status(200).send(results);.
//  this file only needs to be run once
'use strict';
require('dotenv').config();
const mongoose = require('mongoose');
mongoose.connect(process.env.DB_URL); //  CONNECT
//  add the Cat model
const Cat = require('./models/Cat.js');
//  make this async
async function seed() {
  //  structure the same as Cat Schema from mongoose prototype method
  await Cat.create({
    //  having a Model and Schema allow using the .create() method
    name: 'Spike',
    color: 'orange tabby',
    spayNeuter: true,
    location: 'Seattle',
  }); //  Properties MUST be passed-in AS AN OBJECT using braces
}
seed();
mongoose.disconnect();  //  DISCONNECT or lose cash

Front-end

Use the React Lifecycle

When this Component loads, trigger a get DB data and puts it into State, which updates the Render method.

//  when component loads it has all it needs
//  data will be put in state and rendered
componentDidMount() {
  this.getCats();
}

CRUD

Need to have a fully functional database.

Jon TODOs