Labs

Labs are hands-on coding projects that you build along with Tonya as she explains the code, concepts, and thought processes behind it. You can use the labs to further your code knowledge or to use right in your projects. Each lab ties into the Docx to ensure you have the information you need.

Each lab is designed to further your understanding and mastery of code. You learn more about how to think about its construction, quality, maintainability, programmatic and logical thought, and problem-solving. While you may be building a specific thing, Tonya presents the why of it to make it adaptable far beyond that specific implementation, thereby giving you the means to make it your own, in any context.

0 Videos Runtime July 9, 2017

Understanding the Problem

In this episode, let’s discuss what the problem is with using URL query string. It’s important for you to understand the problem first in order to solve it. Right? Do this episode before you move on. Let’s start by analyzing the speed of this lab using Pingdom’s website speed test. Here’s a link to the test that I ran. Running the test, it explains why it scores query strings: Resources with a “?” in the URL are not cached by some proxy caching servers. Therefore, the problem is that some proxy caching servers may not cache the resources. That means […]

0 Videos Runtime July 9, 2017

The Intent of ?ver=1.0.0

Why does WordPress append the ?ver= whatever your version number is? Why does it ask us to provide a version number when we enqueue? Why? What is the intent of versioning? Answer: It’s for cache busting. Why? Browsers cache when you view the web page. It holds a local version in its cache. If the URL doesn’t change, then the browser will pull from its local cache. That means the viewer will NOT see your changes. Whoopsie. Appending the version number of the asset to its static URL changes the URL. That’s why WordPress handles it for you. But you […]

0 Videos Runtime July 9, 2017

What is a URL Query String?

In this episode, let’s talk about what a query string is. Makes sense, right? You first need to understand the URL and those additional parts of information. Then we can move forward.

0 Videos Runtime July 9, 2017

Load the Theme’s Minified Stylesheet

Stylesheets are huge. We want to serve up optimized assets to reduce the time for rendering web pages. Right? Smaller files equal faster download times. In this episode, you will be minifying the Twenty Seventeen’s stylesheet using an online service. Then you’ll build the code that loads it.

0 Videos Runtime July 9, 2017

Forget Hard Coding Version Number

In this episode, you’ll build an automatic way to set the theme’s version number. These strategies eliminate the need to hard code the theme’s version number. Let’s start with the Twenty Seventeen theme. I want to show you that these techniques work on any theme. Then in the next episode, we’ll move it over to a Genesis-powered child theme. For strategy 1, when you are in development/debug mode, we want to use the file’s modification time instead of having to change the asset’s released version number.

0 Videos Runtime July 9, 2017

Lab Introduction

Assets are the stylesheets, scripts, images, fonts, etc. that are on the website’s hard drive (i.e. web host’s hard drive) that are downloaded to the browser. Versioning gives us the ability to change each asset’s static URL to ensure our changes go out to the browser (bust through cache). In this hands-on coding lab, you will be learning better techniques and strategies for automating your asset versioning in WordPress. No more hard coding the version number when you enqueue. This is a lab that everyone needs regardless of skill level. Whether you are an implementer or advanced developer, this one […]

14 Videos 02:27:07 Runtime July 9, 2017

Automate Asset Versioning – Better Asset Versioning

In Part 1 of the Better Asset Versioning, we are looking at the version number that is applied to each asset resource, i.e. our scripts, fonts, and stylesheets. We are highly inefficient with this process. Let’s eliminate the hard coding of version numbers when we enqueue. Let’s build a better strategy for version numbers when in development mode. Let’s automate versioning and improve our build process.

0 Videos Runtime September 20, 2016

Gulp Watch

A task watcher automatically runs gulp tasks when you save a Sass partial. You can wire it up to any of your gulp tasks to automatically watch for the events which trigger each one. Turn on the watch and let it run as you work.

0 Videos Runtime September 12, 2016

Laying Out the Theme’s Architecture – Part 2

In this episode, you will continue adding files to your new Genesis developer’s starter theme. You will be adding in the file PHP DocBlocks including the package name. You’ll learn about how to name your packages for the namespacing, which I show as YourCompanyName\ThemeName. Upon the completion of this episode, you will have the baseline theme file/folder architecture completed. This is now the shell of your theme, ready for you to start adding in the code into the appropriate buckets.

0 Videos Runtime July 20, 2016

Git & Additional Enhancements

Let’s push our final sample theme to your git hosting. Then let’s talk about the more advanced stuff you can do including additional PostCSS, cssnext, and more gulp tasks like SVG, image optimization, and scripts. You can look at what WebDevStudios is doing in their wd_s. You now have a completed Genesis starter theme. Yes, there are more things you can do with it, such as moving to a configuration architecture, more gulp tasks, and so on. But you can add those as you get working with your new theme. Congratulations! Start using your new codebase and it will save […]

Labs

Understanding the Problem

The Intent of ?ver=1.0.0

What is a URL Query String?

Load the Theme’s Minified Stylesheet

Forget Hard Coding Version Number

Lab Introduction

Automate Asset Versioning – Better Asset Versioning

Gulp Watch

Laying Out the Theme’s Architecture – Part 2

Git & Additional Enhancements

Learn

Help

General