Joni Halabi thatdevgirl

Cabin Fever To-Do Resources

Creators

Education

Education Companies Offering Free Subscriptions due to School Closings

Javascript code standards for GU

This document outlines best practices and standards for Javascript code written for GU projects. They are largely taken from the W3 Schools JavaScript Style Guide and the Wordpress Javascript Coding Standards.

Variables

Variable names should begin with a letter and be written in camelCase.
Variable names should be descriptive of the information they contain, even if it makes the variable a little long (but don't go overboard).
Use const for all variables that will definitely not change.
Use let for local variables inside a function or callback.

What the Gutenberg?

Gutenberg is the code name for the new WordPress post editor. It was included in version 5.0 of core, but is still its own project that gets periodically merged into major and minor (but not patch) updates. However, there is no correlation between Gutenberg and WordPress core versioning, nor is there any indication in core's code about which Gutenberg version has been included. This makes it very difficult to figure out what version of Gutenberg is in which version of core.

The obfuscation is likely purposeful, but sometimes it is useful to have this information. Well, I find it helpful. If you do too, here you go. This is a manually curated list of Gutenberg versions to Core versions, starting from 5.3 because I do not really care to go backwards from there.

Version mapping

WP Core	Gutenberg	Exceptions	Source

	/**
	* A very simple autocomplete component
	*
	* This is to replace the OOTB Gutenberg Autocomplete component because it is
	* currently broken as of v4.5.1.
	*
	* See Github issue: https://github.com/WordPress/gutenberg/issues/10542
	*
	* Note: The options array should be an array of objects containing labels and values; i.e.:
	* [

	function handleTabFocus(e) {
	let focus = document.activeElement,
	newFocus;

	$(document).keyup(function(e) {
	const code = e.keyCode \|\| e.which;

	// If the tab key is pressed:
	if (code === 9) {
	// Determine which element has focus now.

	<!DOCTYPE html>
	<html lang="en">

	<head>
	<title>Character Count using jQuery</title>
	</head>

	<body>
	<header>
	<h1>Character Count using jQuery</h1>

	<!DOCTYPE html>
	<html>

	<head>
	<title>CSS Mega-Menu</title>
	<link type="text/css" rel="stylesheet" href="css-mega-menu.css" />
	</head>

	<body>
	<nav>

	/**
	* CSS-only Menu
	*/

	/* Link set up */

	nav a,
	nav a:visited {
	text-decoration: none;
	}

	var csvToJson = {
	json: [],
	headers: [],

	go: function(url) {
	var _this = this;

	// AJAX call to get CSV data.
	$.ajax({
	type: "GET",