Skip to content

lukeprosser/celtic-kitchens

master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Celtic Kitchens

Demonstration multi-page portfolio website for local business built with React and GatsbyJS, featuring blog content generated with Netlify CMS.

Live demo: https://celtickitchens.netlify.app/

Technologies

  • React
  • GatsbyJS
  • JavaScript
  • GraphQL
  • Gatsby Image
  • Gatsby Typography
  • Netlify CMS
  • SCSS
  • Font Awesome
  • React Images

Key Features

  • Mobile-first design
  • Use of CSS Flexbox and Grid for layout and structure
  • Fully responsive and optimised images using gatsby-image
  • GraphQL queries pulling images and data (e.g. portfolio images, brand images, blog post markdown etc.)
  • Netlify CMS admin access via https://celtickitchens.netlify.app/admin
  • Header:
    • Dynamic responsive structure with components for mobile and desktop
    • Mobile hamburger menu
    • Link hover transition
  • Home page:
    • Interactive hero carousel slider
  • Portfolio page:
    • Responsive image gallery via Flexbox
    • Interactive modal carousel built with react-images - displayed on image click, tracking index to display correct image
  • Blog page:
    • Index of blog posts
    • Blog post pages generated dynamically
    • Blog posts can be created/edited remotely via Netlify CMS
    • Site build process triggered automatically on blog post submission
  • Contact page:
    • HTML form validation
    • Form submission email notifications powered by Netlify

To Do

  • Home page:
    • Slider carousel autoplay mode
  • Location component:
    • Interactive Google Map

About

Demonstration multi-page portfolio website for local business built with React and GatsbyJS, featuring blog content generated with Netlify CMS.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published