Skip to content

Instantly share code, notes, and snippets.

View acidtone's full-sized avatar

Tony Grimes acidtone

  • Southern Alberta Institute of Technology
  • Calgary
View GitHub Profile
@acidtone
acidtone / README.md
Last active May 5, 2022 15:35
Activity: Build an index.html file from a Codepen
@acidtone
acidtone / README.md
Last active May 5, 2022 07:01
Demo: GitHub Events API with D3
@acidtone
acidtone / README.md
Last active September 13, 2024 19:56
MongoDB Atlas: Import data using MongDB Compas

MongoDB: Importing data into MongoDB Atlas

Pre-requisites

Instructions

  1. Create a json file containing the data you'd like to import (like the local module you're creating for Assignment 5).
    • Warning: MongoDB (and mongoose) assume you'll be importing an array of objects. Any other data types will lead to unexpected results.
    • A sample definitions.json file has been provided with this Gist.
  2. Add your connection string in Compass.
@acidtone
acidtone / README.md
Last active April 14, 2024 12:36
Command Line Activity: Follow the white rabbit

Command Line Activity: Follow the white rabbit

This is a command line exercise for practicing basic file system navigation commands:

  • pwd: Display your present (working) directory
  • ls: List directory contents
  • cd: Change directory

Instructions

  1. Download this Gist to your workspace and expand/extract animal-world.zip.
  2. Navigate to this directory using your terminal.
  • Note: when you open a new terminal window (i.e. using Git Bash on Windows or Terminal on Mac OS) the default location will normally be your home folder (/Users/jane).
@acidtone
acidtone / README.md
Last active March 29, 2022 21:56
fetch: Asynchronous JS with async/await

fetch: Asynchronous data with async/await

Problem

When calling for data over the network in Javascript, the calling script won't wait for the data to come back. Instead, it continues to execute and any code that depends on the fetched data will return with an error.

Solution: async/await

ES6 added Promises which allows us to set "reminders" in our code that data is on its way.

ES7 added the async/await syntax that let's us use promises to "pause" our code for functions that are asynchronous.

fetch() using async/await

@acidtone
acidtone / README.md
Last active February 15, 2022 13:18
JS Activity: for loop - Create an array of Lorem Picsum images from an array of ids

JS Activity: for loop - Create a gallery of Lorem Picsum images from an array of image id's

In this activity, you will take a list of image IDs listed in picsum-list.js and create a gallery of images using the Lorem Picsum service.

Lorem Picsum is an image service that allows you to embed placeholder photos into your web pages. The images are pulled from open-source Unsplash images.

For example, the following HTML displays this puppy image

<img src="https://picsum.photos/id/237/300/300" alt="Lorem Picsum Image">
@acidtone
acidtone / README.md
Last active February 15, 2022 13:02
JS Activity: for loop - Create a grammatically list of nouns

JS Activity: for loop - Create a comma-separated list of nouns

In this activity, you will generate a comma-separated list of nouns and display it on a web page.

For example, this array:

const nouns = [`one`, `two`, `three`];

Should be display on the page as a sentence in the following format:

@acidtone
acidtone / README.md
Last active February 15, 2022 17:04
JS Sample Arrays
@acidtone
acidtone / README.md
Last active October 25, 2022 15:55
JS Activity: Form fields and DOM output

JS Activity: Form fields and DOM output

The following files contain code that runs when a function is invoked. Refactor each of these files so that:

  • the initial argument values are submitted by the user using form fields;
  • the response is printed to index.html.

Instructions

For each of the .js files in this Gist:

  1. Create a new HTML file named after the respective .js file. For example, captialize.html should link to capitalize.js in a <script> element in the <head>;
  2. In this HTML file,
  • add an appropriate form field and `` for each of the values the user will be submitting. Examples:
@acidtone
acidtone / README.md
Last active February 7, 2022 11:19
JS Starter: Empty HTML and JS file

JS Starter Code: Empty HTML with JS file

An empty HTML with placeholder JS file for new projects.