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 application....

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

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 the video is...

"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 do a lot of "...

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 portion of ...

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 header portion o...

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

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 header area of...

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" section of ...

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 to the life...

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, I finally d...

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 WordPress them...

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

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 a fully inte...

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 main nav dyna...

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.

This video ...

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 snags that co...

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

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 spent adding cu...

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 to create th...

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 Web Design

...

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 page.

...

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

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 different way to ...

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 the Foundation...

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 a pattern em...

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 completely fo...

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 as a global...

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 sure it's a sni...

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 placeholder i...

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 the general ca...

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 mentioned utili...

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 move on to ma...

Coding The Responsive Mobile Menu

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

To code t...

Kirby Redirects and Adding Animations

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

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

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 a combinati...