code

As a front end developer who tries to keep up with the latest trends, I find it a constant challenge to define my own unique path when building a website or ...

Many people think Git is too advanced and a tool they will never master. The ever frightening command line keeps many designers and dev...

In part 5, of "How to Design and Code a Product Landing Page", I continue optimizing our theme for the upcoming development of the landing page.

Part of ...

"How to Design and Code a Product Landing Page – Part 6" is here! Watch me as I continue on setting up our theme in preparations for development.

I d...

Continuing on in part 9 of the screencast series titled "How to Design and Code a Product Landing Page" we dive deeper into developing and styling the header...

In Part 10 of How to Design and Code a Product Landing Page, I continue coding the landing page. The last part of the series ended with me styling the head...

Gulp.js is a not so new toolkit built using JavaScript that helps automate your workflow as a developer. Whether you do front end develo...

At the beginning of part 11 of my How to Design and Code a Product Landing Page screencast series, I discuss how I fixed some issues I was having in the he...

In Part 12 of my "How to Design and Code a Product Landing Page" screencast series, I continue building out the next section of our design.

The "Benefits"...

In part 13 of my "How to Design and Code a Product Landing Page" screencast series, you will see some optimizations take place.

In this video, I fall back...

In Part 14 of my "How to Design and Code a Product Landing Page" screencast series, I begin implementing the eCommerce portion of the site.

In this video,...

Welcome to the very first video of my new series titled "How to Code HTML to WordPress".

In this screencast series, I'll take a new approach to build Wo...

Part one of the "How to Code HTML to WordPress" screencast series begins with getting WordPress installed, a starter theme activated, and copying the bundl...

In Part 15 I carry on adding the eCommerce functionality inside the product landing page. I make use of a stripe WordPress plugin which allows you to output ...

Part 2 of the "How to Code HTML to WordPress" screencast series is dedicated to optimizing the theme for development as well as the beginning of making the m...

In Part 16 of the "How to Design and Code a Product Landing Page" screencast series, I finalize our styles for the footer area of the single-page website.

...

Part three of my screencast series "How to Code HTML to WordPress" I opt to get our Gulp task runner plugin as a result of some CSS s...

Part 4 of How to Code HTML to WordPress picks up where I left off in Part 3 after I added G...

Part 17 of How to Design and Code a Product Landing Page deals with refinements to the product landing page's styles.

The first half of the video is spe...

Part 5 continues my series titled "How to Code HTML to WordPress". In this video, we make custom post types, categories, and custom fields that tie together ...

In the last part of the "How to Design and Code a Product Landing Page" screencast series, I finished up our desktop view of the design.

Responsive W...

Part 6 continues my series titled "How to Code HTML to WordPress". In this video, I finish up coding the custom post type feature for the menu section of the...

Continuing on from Part 6 of my How to Code HTML to WordPress screencast series I begin to make the fin...

The end is here! In part 8 of my screencast series "How to Code HTML to WordPress" I create a widget footer section of the HTML theme.

There's a diffe...

In part 16 I optimize our theme for development. Kirby comes with a starter kit preinstalled to show you functionality which I really like.

Laying th...

Styling the home page header

Styling our home page header begins in part 17 of the Let's Build: A Consultancy Website series.

The beginning of ...

Revisiting the primary navigation

In Part 18 we styled just about all of the home page header. In part 19, I revisited the primary navigation which I c...

Coding the home page call to action and global CTA

Part 22 carries on the series by introducing the call to action I designed for the home page as well...

Coding the Footer

In part 23 I round out the home page design and spend time coding the footer.

To make this a global component I needed to make sur...

Coding an Instagram Photo Feed

Part 26 of my Let's Build: A Consultancy Website series continues on the About page.

The existing design utilizes p...

Coding the Services Page - Part 3

In part 29 of my Let's Build series, I continue coding the services page. All that's left is to style the form and th...

Coding the Services Page Form

Part 30 officially marks the end of my immediate work on the services page by tackling the form. In previous videos I men...

Making The Homepage Responsive

In part 32 I start with making the homepage responsive. With most of the consultancy website designed and built, I can m...

Coding The Responsive Mobile Menu

Part 35 introduces our new responsive mobile menu of which I found as inspiration on Codepen.
...

Kirby Redirects and Adding Animations

Part 37 teaches you how to perform redirects in Kirby. Alyssa's blog is hosted elsewhere...

Today, more than ever, more developers are reaching for JavaScript as their programming language of choice. That choice makes sense because JavaScript can ex...

I'm back with another installment of my Let's Build: With JavaScript series. This tutorial is based around an off-canvas menu experience that was built using...