bts

BHE Technical services website

retrospective notes/to-do/improvements, from last project

• Design was a pain point. The worst part, in fact, make steps to create a process.
• Create & use common code snippets, using the snippets extension mentioned in syntax
• create a template/tutorial/process to implement dark mode using tailwind, on all sites going forward.
• make sure the file structure for images is designed/in place before code starts, because it got pretty sloppy with the DIFTK project, and that's just boring to clean up.
• switch fully from hex to HSL, taken from refactoring ui

UI Design

• Figma
• Dribble moodboard
• company profile - to aid with content & design

Content Management

• GraphCMS is being used as the CMS (Along with a build hook that triggers upon publishing of any new content, as seen on taz-store project)
• Account details for this are in notion.
• Product item schema:
  

  {
  title: lorem
  description: long text
  image: asset
  category: long text
  }
  

• Category:
  

  {
  title: lorem
  description: long text
  }
  

Website & dev notes

• Used this Gatsby starter.
• TailwindCSS for styling
• Heroicons, Feather icons, Tablericons
• "Sometimes, you may want to push commits to your production branch without triggering a deploy on Netlify. To do this, add [skip ci] or [skip netlify] anywhere in the Git commit message." - Netlify docs
• how to handle forms?
• how to get current page information from node? to help with conditionally styling the header

reference sites

• cml - inspiring bits of design
• Coffman - nice sharp edges. icons feel a bit thin & lonely though. Mixture of rounded buttons with sharp surroundings not sitting well. Their services page is interesting though.

SEO component

On the previous Gatsby site, I had issues with the seo component, specified here. - This issue has since been fixed.
This repo has a working example, and it works in a similar manner.

• Default values are set in gatsby-config.js, it is getting the image from the static folder ./static/images/bhe-logo.jpg.
• The url set in gatsby-config.js must be changed with the domain name, manually🙄, if the SEO component is to work as intended.