Pup

v1.x

Glossary

Building software involves a lot of terminology —and often, jargon—which can be confusing and make the learning process more difficult than it needs to be. Below is a list of terminology that you'll find in use inside of Pup and this documentation. If you stumble across a term you don't recognize and can't find it on this list, please let us know so we can add it!

API

The term API stands for "application programming interface," which, isn't terribly helpful in understanding what it is. Simplifying, an API is the means by which other people (third-party developers) can gain access to the functionality of your own product or system.

For example, Amazon Web Services offers various APIs to help you with different tasks. They've written and tested the logic for things like converting videos or sending email and allow you to use an API to communicate with and make use of that logic so you don't have to write it yourself. APIs are kind of like Legos; you pick out the pieces you want and snap them together.

The term API can also be used to describe how you make use of a certain type of tool. For example, in Pup, we use the React user interface library to build our product's UI. The functions and code that we use within React can be described as its API. For example, React allows us to define a function (or method) on our components called componentDidMount() which runs whenever our component is first displayed on screen. componentDidMount() is part of React's API.

Example Using Amazon's S3 API
import AWS from 'aws-sdk';

// Configure our access to Amazon's APIs (think of this as "logging in")
AWS.config = new AWS.Config();
AWS.config.accessKeyId = Meteor.settings.AWSAccessKeyId;
AWS.config.secretAccessKey = Meteor.settings.AWSSecretAccessKey;

// Give ourselves access to Amazon's S3 (file storage) API
const s3 = new AWS.S3();

s3.putObject({
  Bucket: 'cleverbeagle-uploads',
  Key: 'example.png',
  Body: /* Data for the file goes here */
  ACL: 'private',
  ContentEncoding: 'base64',
  ContentType: 'image/png',
  Expires: (new Date(moment().add(10, 'years').format())),
}, (error, response) => {
  if (error) {
    console.warn(error);
  } else {
    console.log(response); // URL of the file on Amazon S3.
  }
});
Example Using React's API
import React from 'react';

class ExampleComponent extends React.Component {
  componentDidMount() {
    console.log('Using the componentDidMount method from React\'s API to log this out!');
  }

  render() {
    return (<div className="ExampleComponent">
      <p>Just an example component.</p>
    </div>);
  }
}

export default ExampleComponent;

Camel case

In software development, camel case refers to the literal casing of the names that you use for variables, object properties, and function names in your application. As the name implies, camel case looksLikeThis (like the humps on a camel).

Component Instance

In React, the "component instance" refers to a rendered copy of a React component. Because a React component can be rendered an indefinite number of times, we need to be able to access each instance or rendering. Whenever we use the this keyword inside of a React component, we're accessing that specific rendered copy of the component. Even if there are ten other copies of the same component rendered on the page, this will only ever refer to that immediate instance or copy of the component.

CRUD

CRUD is an acronym for create, read, update, delete: the four basics database operations in any application. Some applications are deemed "CRUD apps" as the only functionality they perform is to act as a front-end for the database. Generally speaking, the majority of applications fall into this specification. Even the most complex applications on the web are—in some form—CRUD applications.

Destructuring

Destructuring is a feature in JavaScript (introduced in ES2015/ES6) that allows us to literally de-structure or "pull apart" a JavaScript object to reveal its properties. For example, given an object stored in a variable like the one on the right, if we wanted to access the values of this, we'd need to do something like company.name, or company.location.city. With destructuring, we can simplify our code to give us direct access to the properties of an object without having to reference the variable name of the object they're stored in.

On the right, we use the syntax const { name, location } = company; to say "from the company variable, pluck off name and location and make them available as variables in the current scope." Notice that immediately below this, then, we're able to access the location property from the company object directly, without having to reference it as a child of the company object first company.location.

const company = {
  name: 'Clever Beagle',
  location: {
    city: 'Chicago',
    state: 'Illinois',
    country: 'United States of America',
  }
}

// console.log(company.location.city) yields "Chicago"
const company = {
  name: 'Clever Beagle',
  location: {
    city: 'Chicago',
    state: 'Illinois',
    country: 'United States of America',
  }
}

const { name, location } = company;

// console.log(location.city) yields "Chicago"

Dev Ops

Dev Ops, short for developer operations, is the term used to describe the management of a piece of software's production environment or deployment. This refers to the infrastructure used to host the application for customers. Dev Ops is a wide-ranging topic, including server, database, and DNS management. All developers/teams approach dev ops differently and some opt to offload the task entirely onto services like Galaxy or Heroku which perform most of the heavy lifting for you.

ES2015/ES6

In ES2015 and ES6, the "ES" stands for "ECMAScript" which is the name of the standard upon which the JavaScript language is based. Up until 2015, the latest ECMAScript standard was ES5 which was finalized in 2009. Starting in 2015, Ecma International—the group responsible for defining the ECMAScript standard—decided to begin releasing their latest standards by year instead of version. In the JavaScript world today, ES2015 and ES6 refer to the same standard (and are used interchangeably), with the former preferring the new naming scheme and the latter adopting the old.

Immutability

In JavaScript, Objects can either be mutable or immutable. A mutable object is one that allows for its properties to be changed, while an immutable object does not allow for its properties to be changed.

In the example of the right, if we take the first object and pass it to JavaScript's Object.freeze() method, we can see that any attempts to change the object afterward are not allowed. Here, the Object.freeze() method is making our object immutable.

const doc = {
  title: 'Example Object',
  body: 'Objects in JavaScript are mutable (changeable) by default.'
};

Object.freeze(doc);

doc.title = 'Cannot be changed'; // This fails because Object.freeze() makes doc immutable.

ISO-8601

An officially recognized standard for defining dates. The format looks like yyyy-mm-ddThh:mm:ss.msZ, or, year, month, day, hours, minutes, seconds, and milliseconds, followed by an optional timezone (default is assumed to be UTC/GMT). In Pup, dates are converted to be ISO-8601 strings because they're a bit easier to work with than JavaScript Date objects. They're also easy-to-read for humans, making administration of dates more friendly.

Reactive data source

Specific to Meteor, a reactive data source is some value (e.g., a reactive variable) that triggers changes when used inside of a reactive data context (e.g., Tracker.autorun()). Whenever a reactive data source changes, its change is detected by the reactive data context and whatever code is present in the reactive data context is re-run.

Reactive data context

Specific to Meteor, a reactive data context is a function that responds to the changes of reactive data sources (e.g., a session variable or reactive variable). In Pup, data containers are the most common form of a reactive data context.

Transactional email

Transactional email is a term to refer to the type of email that you send from your application. This classification includes email like notifications about activity, invoices for a user's subscription, or any email that's sent in response to a user's action. This term is most commonly used by transactional email providers who offer services for sending email on your behalf. Conversely, any application email that's not triggered by a user action is typically classified as a marketing email.

Vanilla

Developer slang for "basic," "simple," or "default." For example, we could use jQuery or "vanilla JavaScript" meaning just write the code ourselves in plain JavaScript code. Also used in respect to implementations like "let's just keep the signup process vanilla and only allow password signups for now."

Keep it real, yo.