Jeremy Levy Jlevyd15

keystonejs notes

Creating custom keystone Lists (models)

keystone lists or models basically map back to mongodb collections
each property you add into the model object will become a field in the keystone admin UI. The model itself will become a mongo collection in the db and the fields will also be stored under the collection.
each property you define in the model needs to have a type. Types are defined by the keystone api. There are many types that are built into keystone a list of them can be found Here

How to create a new list

Actions - actions are POJO that have two properties.

they contain a type and a payload.
Type: is basically a name for the action. Ex: TYPE: INCREMENT
Payload is state
we use these in Redux to pass as arguments to dispatchers we say dispatch an action

Reducers - reducers are pure functions that receive actions

they hold the state of the application in something called a store,
reducers contain the logic behind the action and actually do the thing to alter the state.
normally these are like switch statments that decide what will happen to state when a given action is called

Creating a SSL certificate locally using Certbot on Mac OS and deploying to an existing Heroku App

Caveats

You must have a heroku app deployed on the hobby tier. This is NOT the free tier and costs ~7/month
i'm assuming you have homebrew installed. It will be need to install the Certbot client
i'm also assuming you have the heroku CLI tools installed

first up, run this to install the certbot client

brew install certbot

this in JavaScript 📝

"this" allows us as the developer to use an objects context when calling a function. You can choose which object you would like to call a function with, even if that object does not have the function as one of it's properties.

Example: If there is one common function you have, like sayHello you want that function to work with many objects that have similar properties.

var personOne = {
	name: "Bob",
	age: 35,

ES6 object destructuring

const { store } = this.props

Assigning a constant like this to the object on the right side will pull out the value for the key that has the same name as the variable (in this case store) and assigns it to the store variable. It's the equivalent to below syntax

const store = this.props.store

#1. Check if node is installed

open Terminal and run the command below node -v
if it outputs something like this v8.9.1 then continue to setp 3.

#2. Install node.js

go HERE and click the left green button to install the LTS version of node.js
repeat step #1. to make sure the install was successfull.

#3. Install Bower package manager

run this command npm i -g bower

We will be building a Tabs UI, similar to Bootstrap Tabs

There should be 3 tabs, associated with vote_average returned by the API. (Low, Average, High)
- Theses tabs should contain the movies with these vote ranges (Low: <= 6.0, Average: 6.1 > 7.9, High: >= 8)
Clicking on each of the tabs will display a list of movies associated with that vote range e.g. clicking on Low will only show movies with an average rating of 6.0 or lower.
The list should display the movie's id, vote_average, and release_date date properties
The list of movies should be sorted by most-recent release_date date first
At any given point, the UI should display which tab is active
When loading the UI for the first time, the first tab should be active

	// NOTE: I previously suggested doing this through Grunt, but had plenty of problems with
	// my set up. Grunt did some weird things with scope, and I ended up using nodemon. This
	// setup is now using Gulp. It works exactly how I expect it to and is WAY more concise.
	var gulp = require('gulp'),
	spawn = require('child_process').spawn,
	node;

	/**
	* $ gulp server
	* description: launch the server. If there's a server already running, kill it.

	List()
	var list = Immutable.List([1,2,3])
	// [1, 2, 3]

	List.isList()
	Immutable.List.isList(list)
	// true

	List.of()
	var list = Immutable.List.of(1,2,3);

	<div class="test">test div</div>


	<div class="test-2">test div</div>