jeremyckahn

#NoEnv  ; Recommended for performance and compatibility with future AutoHotkey releases.
; #Warn  ; Enable warnings to assist with detecting common errors.
SendMode Input  ; Recommended for new scripts due to its superior speed and reliability.
SetWorkingDir %A_ScriptDir%  ; Ensures a consistent starting directory.

CapsLock::Esc

;following section mimics command-q
;behaviour to close windows
#q::!F4

jeremyckahn

A Reductive Approach to React Components

What follows is the result of Mad Science™ in React development, and is either a great idea or a terrible one. The jury is still out, and I will leave it up to the community to decide whether this is pragmatic or heresy.

I am a huge fan of React. I love the functional approach to app development and the parallels I see between the functional reactive programming model and game design. The established best practices largely make sense to me, particularly the parts about lifting state up to higher level-components. Anecdotally, I have found that lifting state all the way up to the highest level in a component hierarchy yields some really valuable benefits (which I have covered [elsewhere](https://gist.github.com/jeremyckahn/091aff8d1d62f661828c347750ae7644#2-all-

jeremyckahn

Language-level dependency injection with ES6

What follows is a pretty shameless abuse of one of my favorite ES6 features, default parameters. They're a simple idea that other languages have enjoyed for decades, and I am all too happy to see JavaScript join the party.

const logValue = (object = {}) => {
  console.log(object);
};

logValue();  // logs: {}

jeremyckahn

diff --git a/package.json b/package.json
index 8a5e292..c85b9ea 100644
--- a/package.json
+++ b/package.json
@@ -4,4 +4,5 @@
   "scripts": {
     "build": "webpack --config webpack.config.js --mode production",
+    "build:analyze": "webpack --config webpack.config.js --mode production --profile --json > /tmp/webpack-stats.json; webpack-bundle-analyzer /tmp/webpack-stats.json",
     "lint": "eslint --ext .js --ext .jsx . && echo \"No lint errors!\"",
     "prettier": "prettier --single-quote --trailing-comma es5 '{src,test}/**/*.js' --write",

jeremyckahn

Proposal for a simpler React application architecture

This is a design document for a minimalist React application architecture. Anecdotally, this design is proving to work well for smaller-to-medium scale projects, but it has not been proven to work for large-scale projects because it has not been tested against those yet.

This design is modeled around the official Intro To React guide put out by the React team. In fact, it does not diverge in any significant way from that guide; it simply adds a few explicit constraints to promote simpler implementations.

Examples of this architecture in use:

• https://github.com/jeremyckahn/rekapi-timeline
• https://github.com/jeremyckahn/merkaba (still early in development)

jeremyckahn

Getting Started With Unit Tests

This is not meant to be a comprehensive guide to testing, but rather a high-level introduction. It is meant to help you become conversant in unit testing, not a master. That will come later!

Case Study: rekapi-timeline's computeHighlightedKeyframe and computeDescaledPixelPosition functions:

• computeHighlightedKeyframe:
  • Code: https://github.com/jeremyckahn/rekapi-timeline/blob/84f64fa1a49a37e6d13bd80558e67c93b86ab435/src/utils.js#L20-L33
  • Tests: https://github.com/jeremyckahn/rekapi-timeline/blob/84f64fa1a49a37e6d13bd80558e67c93b86ab435/test/index.js#L61-L142
• computeDescaledPixelPosition

jeremyckahn

<?php

header('Content-type: text/json');
header('Access-Control-Allow-Origin: *');

$url = 'https://newsapi.org/v2/top-headlines?'
  . $_SERVER['QUERY_STRING']
  . '&apiKey=[YOUR API KEY GOES HERE]';

$curl = curl_init();

jeremyckahn

jeremyckahn

Practical Computer Science Fundamentals

CompSci degrees cost a lot of money, take a lot of time, and aren't a viable option for a lot of folks. Luckily, much of what you'll learn in a proper Computer Science program can be self-taught online for free. This gist is a roundup of some of the most helpful resources I've found.

Where I'm coming from

I'm not pursuing a deep, academic comprehension of CS concepts — my goal is to become respectably conversant about the most prevalent and relevant subjects in the field.

Starting points

jeremyckahn

const fetchJson = (function () {
  localStorage.cachedFetchResponses = localStorage.cachedFetchResponses || '{}';

  let cache = localStorage.cachedFetchResponses;

  const setCachedData = (key, data) => {
    const parsedCache = JSON.parse(cache);
    parsedCache[key] = data;
    
    try {