GatsbyJS Part 3: Site Layout and Basic Component Creation

Part 3 starts with cleaning up some of the files and folder structures created from the starting template. Then we move on to editing the header component followed by creating a new footer component that will be used across the site.

Along the way, we create some basic CSS with horrible colors so we can clearly see what is going on with the areas defined in the components, I often use this technique to test placement and get a visual feel for the page structure during early development before moving on to the proper (nice) design.


Tools used
NodeJS
GatsbyJS

Part 1: Overview and install
Part 2: Site and file structure



GatsbyJS Part 2: Site and File Structure Overview

In part 2, we take a look at the site/folder structure of a GatsbyJS site. I’ll explain what the folders are for along with an overview of the files in a starting Gatsby site. By the end of this video, you will have an understanding of how a site is created and how components play a part in generating pages.



Tools used
NodeJS
GatsbyJS

Part 1: Overview and install
Part 3: Site layout and basic component creation



Step Up and Just Do It

This is a different type of post than I normally do, which serves to demonstrate the very content I talk about in the video. Stepping up and doing it, putting concerns and quality aside and shipping something. How to let creativity flourish by removing the burden of over production and perfection.

Enjoy.



How to Import Images into Lightroom CC Classic

Adobe Lightroom has been my goto photo management since version one. The only other app I use for managing images is Apple Photos. Nothing comes close to Lightrooms ability to edit and manage photos in my opinion.

This video was recorded just a couple of days before the newly announced version, so there could be differences between the very latest version and this video.