Andrew Dent
Front-End Developer
GitHub
Threads
YouTube
Projects
Grizzly Guitar
![Grizzly Guitar](https://cdn.sanity.io/images/0fb9cdws/production/c7dda944b0fcb789249ec5e04669816405e66b88-1800x900.png?w=1800&h=900&auto=format)
A custom Shopify storefront with multiple CMS integrations
Grizzly Guitar is a service business and online store.
I created this custom e-commerce website which features an accessible and high-performance front-end.
It features a blog hosted on WordPress, custom data managed in Sanity, and e-commerce powered by Shopify.
Built with:
React
GatsbyJS
GraphQL
Tailwind CSS
![](https://cdn.sanity.io/images/0fb9cdws/production/b90170c32fb7e69973bddc6cd644fb363cda9c11-180x180.png)
Sanity CMS
Shopify
![](https://cdn.sanity.io/images/0fb9cdws/production/2b3b4c1798e4da8155c4e2b6333e18d47e619270-668x668.png)
Wordpress
Mint Condition Detailing
![Mint Condition Detailing](https://cdn.sanity.io/images/0fb9cdws/production/e203d99e634986fd2070c7957ef6e7fd6357ce8f-1800x900.png?w=1800&h=900&auto=format)
A Shopify storefront built with React Server Components
Mint Condition Detailing is a service business and online store.
I integrated my Shopify store and Sanity CMS data with Vercel's commerce template to gain experience with Next.js 14 and React Server Components.
This headless Shopify Storefront allows for full customization capabilities, while offering customers the ability to modify content with the no-code Shopify interface.
Built with:
React
![](https://cdn.sanity.io/images/0fb9cdws/production/9296f1045f5778317e794431775ae1d9db09741d-488x488.png)
NextJS
![](https://cdn.sanity.io/images/0fb9cdws/production/d13273bf76e3bd258a6c37d4287e9d27d78698e8-256x256.png)
TypeScript
Tailwind CSS
![](https://cdn.sanity.io/images/0fb9cdws/production/b90170c32fb7e69973bddc6cd644fb363cda9c11-180x180.png)
Sanity CMS
Shopify
Baltimore Corgis Website
![Baltimore Corgis Website](https://cdn.sanity.io/images/0fb9cdws/production/b1976279490ff2db59991a9ee2ac7030dc6dbc5f-1800x900.png?w=1800&h=900&auto=format)
A community website with admin update capability
Baltimore Corgis is a community of Corgis, owners, and friends!
After frustrations using a drag-and-drop website builder, the organizer of Baltimore Corgis decided to move to a more customized and performant solution for their community website.
I helped make their ideas a reality, as well as implemented a way for them to easily update content like members and events.
Built with:
React
GatsbyJS
GraphQL
![](https://cdn.sanity.io/images/0fb9cdws/production/b90170c32fb7e69973bddc6cd644fb363cda9c11-180x180.png)
Sanity CMS
![](https://cdn.sanity.io/images/0fb9cdws/production/ac58c2893e9c0426a33629bde65b50b94cdcdfca-318x318.png)
Styled Components
Clamp Calc
![Clamp Calc](https://cdn.sanity.io/images/0fb9cdws/production/5cc7a5a22818a5b1848301252e8e978380c73cfe-1600x900.png?w=1600&h=900&auto=format)
A tool for generating clamp CSS functions
This app allows users to specify the minimum and maximum sizes for their elements, as well as the minimum and maximum viewport widths.
Using these parameters, the app generates a CSS clamp function that ensures the element scales dynamically with the viewport width.
Built with:
React
![](https://cdn.sanity.io/images/0fb9cdws/production/9296f1045f5778317e794431775ae1d9db09741d-488x488.png)
NextJS
![](https://cdn.sanity.io/images/0fb9cdws/production/aef0354cef9f88ce3b0302d332605bd8ee76fab6-320x320.png)
Sass
Tab Lab
![Tab Lab](https://cdn.sanity.io/images/0fb9cdws/production/89c4d399bac0ed36da5cca43cea05a711c403b7e-4240x2385.png?w=4240&h=2385&auto=format)
A tool for creating guitar tablature templates
Users can see a preview of the template, make adjustments, then download or print the page.
Finding the perfect template can be difficult, so I built a tool to create my own.
I plan to add features such as user-saved templates and offer this helpful tool to more musicians over time.
Built with:
React
![](https://cdn.sanity.io/images/0fb9cdws/production/9296f1045f5778317e794431775ae1d9db09741d-488x488.png)
NextJS
![](https://cdn.sanity.io/images/0fb9cdws/production/ac58c2893e9c0426a33629bde65b50b94cdcdfca-318x318.png)
Styled Components
![](https://cdn.sanity.io/images/0fb9cdws/production/86adfb06d12a4e6cbdde23d41c689164ec81cd86-256x256.png)
react-to-print
Smart Shopping List
![Smart Shopping List](https://cdn.sanity.io/images/0fb9cdws/production/4173a1cbe4ba50b975711993cf6faed6806d7339-2255x1184.jpg?w=2255&h=1184&auto=format)
An app built remotely by a team of developers
Smart Shopping List is an app that tracks and suggests groceries based on purchase frequency.
I worked on a team of 4 developers as part of The Collab Lab to build this app. We followed an Agile workflow with weekly sprints and pair programming.
During this project, I learned about team-centric tools and processes from my team mates, our mentors, and weekly presentations from experts.
Built with:
React
![](https://cdn.sanity.io/images/0fb9cdws/production/d13273bf76e3bd258a6c37d4287e9d27d78698e8-256x256.png)
TypeScript
![](https://cdn.sanity.io/images/0fb9cdws/production/b40061b1e2047c83a0b0ccd01a37e4255a6b2d9c-302x302.png)
Firebase
![](https://cdn.sanity.io/images/0fb9cdws/production/3e7c909e8f4470590624d9f274b89b81b81c241b-2654x2654.png)
Jest