ricealexander

/** STICKY-FOOTER CSS
  *  these styles configure a "sticky" footer
  *
  *  "sticky" footers stick to the bottom of the window
  *  when there isn't much page content,
  *  but stick to the bottom of the page
  *  when the content is bigger than the window.
  *
  *  traditional "sticky" footers use padding or calc()
  *  which require knowledge of the heights of the

ricealexander

const detectAdblock = ()=> {
  const adSample = '<div class="adBanner">&nbsp;</div>';
  document.body.insertAdjacentHTML('beforeend', adSample);

  const bannerHeight = document.querySelector('.adBanner').offsetHeight;
  document.querySelector('.adBanner').remove();
  return (bannerHeight === 0) ? true : false;
}

console.log(detectAdblock());

ricealexander

// Inspired by @kokokonotsu
///  https://github.com/kokokonotsu/Cells-and-Grids

const
  gridContainer = 'body',  // selector for our HTML grid
  columnCount = 26,        // number of columns
  rowCount = 20;           // number of rows


// Generate the grid

ricealexander

<style>
/*
forward-slash:
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 55 88">
  <path d="M5 88a5 5 0 0 1-2 0 5 5 0 0 1-2-7L46 3a5 5 0 0 1 9 5L9 86a5 5 0 0 1-4 2z"/>
</svg>

angle-bracket:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 49.1 55.26">
  <path d="M34.14 27.63l-31.6 18.3a5 5 0 0 0 2.49 9.33 5.11 5.11 0 0 0 2.51-.63l39-22.61a6.45 6.45 0 0 0 1.86-2 5 5 0 0 0-1.86-6.79L7.54.63a5.013 5.013 0 1 0-5 8.69l31.44 18.21z"/>

ricealexander

.countdown-container {
  font-size: 1rem;
  text-align: center;
}
.countdown-group {
  display: inline-block;
  margin: 0 1em;
}
.countdown-tile {
  border-bottom: 2px solid;

ricealexander

const arr1 = ["a","b","c"];
const arr2 = ["d","e","f"];
const arr3 = ["g","h","i"];


// Array.prototype.concat()
const arrayConcat = arr1.concat(arr2).concat(arr3);

// Array.prototype.push() + spread operator
const arrayPush = [];

ricealexander

// Stylesheet dependency builds custom stylesheets
function Stylesheet(id) {
  this.sheet = id;
  document.head.insertAdjacentHTML("beforeend", '<style id="'+ this.sheet +'"></style>');

  this.add = function(rules) {
    document.getElementById(this.sheet).insertAdjacentText("beforeend", rules);
  }
};

ricealexander

// deepCopy from
// https://stackoverflow.com/questions/38416020/deep-copy-in-es6-using-the-spread-syntax#answer-53771927


function tidyCopy(obj) {
  if(typeof obj !== 'object' || obj === null) {
    return obj;
  }

  if(obj instanceof Date) {

ricealexander

I'm going to go over a quick overview of Regular Expressions. I'll try to make the syntax fast, because using them is the fun stuff.

We'll be working with https://regex101.com

What Are RegEx?

RegEx stands for Regular Expression. A Regular Expression is a pattern-matching scheme. We use it to determine whether a string follows certain patterns. We'll often see these used to validate form input, and Single Page Applications may use them to compare the URL with patterns tell it what pages to serve.

ricealexander

(1.) Which of the following are valid arrays (Answer all that apply)

const A = ["Harder", "Better", "Faster", "Stronger"];
const B = [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89];
const C = [
  "Urban Chestnut",
  2009,
  "4Hands",
 2011,