bessfernandez

3.0 Navigation Bar

A Pen by Rafael Conde on CodePen.

License.

bessfernandez

// Tests for API wrapper: https://gist.github.com/bessfernandez/4ead80f8f1b7e6f2db8c799bbc849794
// Likely can be improved

/**
 * @jest-environment node
 */
import * as nock from 'nock';
import request, { client } from './api';

describe('API tests', () => {

bessfernandez

// A wrapper around axios with TS and async/await 
// code below would be it's own .tsx file:

/* eslint-disable no-console */
import axios from 'axios';

const apiRoot = 'http://localhost:3000/';

/**
 * Create an Axios Client with baseURL as default

bessfernandez

var root = document.getElementById('root'),


domSearch = function (root, className) {
  var stack = [root],
    foundNodes = [];

  while (stack.length > 0) {
    var nodeToCheck = stack.pop();
      

bessfernandez

Adding Storybook HTML

1. In the directory of your choosing run the following to pull down and install Storybook:

    npx -p @storybook/cli sb init --type html
   

2. After install is done kick it off (should open in localhost:6006):

    npm run storybook
   

bessfernandez

Storybook for HTML

Storybook is all about writing stories. A story usually contains a single state of one component, almost like a visual test case.

Typically you see Storybook used for React or other frameworks, but the library has recently introduced the option to use HTML for your Storybook projects. As a prototyping tool or playground this is great! No larger scale knowledge of other frameworks needed.

Install Storybook HTML

bessfernandez

// Just a fun experiment at testing palindromes by division

// test if a string is a palindrome by dividing length of string and looking at left and right
function isPalindromeByDivision(str) {
  if (!str) {
    return;
  }

  let result;
  // clean up string - remove spaces and enforce casing

bessfernandez

{
  "object": "value",
  "document": {
    "object": "document",
    "data": {},
    "nodes": [
      {
        "object": "block",
        "type": "heading-three",
        "isVoid": false,

bessfernandez

{
  "document": {
    "nodes": [
      {
        "object": "block",
        "type": "paragraph",
        "nodes": [
          {
            "object": "text",
            "leaves": [