🙋🏻♂️ About Me
I have 6 years professional experience in front-end development working with multiple agencies & in house companies — helping teams collaborate and work better together, streamline workflow, and deliver quality websites and applications.
👨🏻💻 What I'm Working On
My focus at the moment is building reusable design systems, CI and TDD. I also love all things todo with performance & web accessibility.
📚 Active Projects
- Titan UI - A reusable CSS Framework which comes with Typescript React Components that help spin up websites faster.
- Performance Kit V2 - A NextJS project that outputs static generated blog pages focused around performance
- How to GraphQL tutorials - Learning more about using graphql and how to use it with a react project. Hopefully a new project can spark from it.
- Redux Fundamentals Course - Learning more about using redux and how to use it with a react project. Hopefully a new project can spark from it.
🏆 Skills
- HTML - templating languages, style guides, pattern libraries, prototyping
- CSS - Sass, Less, PostCSS, BEM & ITCSS
- JavaScript - ES6+, React, Redux, NextJS, Gatsby
- Accessibility - testing, audits, education and improvement
- Team leadership - code standards and best practices, training, consultation, hiring
- Workflow - Git, automation, testing, continuous integration and delivery, kanban & scrum
📝 Other Information
- Speaker - meetups, internal workshops & internal meetings
- Hackathons - Google PWA Hackathon (winner), Google AMP Hackathon (2nd) & internal code in the dark (4th)
- Design Tools - Abstract, Sketch, Zepline, Invision, Photoshop & Illustrator
- Platforms - AWS, Sitecore, Umbraco, Magento, Contentful & Netlify
- CI Tools - TeamCity, Jenkins, AWS Pipeline, Netlify & Travis CI
✍🏻 Latest Blog Posts
I blog on Medium about all the things I learn and I feel that it is so important to share the knowlegde with the world about the things I am passionate about.
- Read more about How to mock api calls in Storybook
How to mock api calls in Storybook
The other day I was building a storybook page component and I was having issues where the page had a useEffect hook that hit an api from the dev environment to populate the state. There was a few issues with this because the data I was getting back needed an Id so it could a lookup in the database to find the record relating to the Id.
- Read more about Keeping your medium content fresh in your 11ty website using Github Actions and Netlify
Keeping your medium content fresh in your 11ty website using Github Actions and Netlify
On my personal website I use Medium as my content platform so I can channel my content via multiple channels. This is great because it allows me to take advantage of medium’s rich text editor and the implementation is really easy to do in 11ty.
- Read more about How to reduce you html output in 11ty
How to reduce you html output in 11ty
Minifying html is a really useful feature that can improve TTFB on the page and with 11ty it is very simple to do. In the eleventy.js config file we need to add a transform to the config which will check if the output is a .html file and if it is we will use an npm plugin called html-minifier to compress our html code.