Planthome

purpose and goal

I wanted to get really good with Gatsby, and that's by building many projects. So I decided to build another Gatsby project.

Before this project, the UIs of all the projects I've built were designed by me tinkering around until it looks good to me, I wanted to implement a design created by a professional designer and also have experience implementing a design file.

So I asked one of my UI designer friends on the web, I got a Figma Landing Page design to implement.

general requirement

As always, apart from the bare minimum that the generated website must be fast and responsive. I had a few requirements in mind to be able to call this project a success:

The resulting website must match the design on the Figma file.

Non-technical users should be able to add and update the site content and use a CMS that I haven't used before.

Add simple animations.

stack explanation

I just started learning Tailwind CSS so I decided to use it in this project.

I used Sanity CMS for content management because I've been hearing great things about it and wanted to try it out.

I used React-Reveal for the slide-up animation because it's simple and fits in my use case.

challenges

Sanity CMS wasn't as straightforward as the other CMS I've used, I had some difficulties getting up and running. Thanks for the great doc.

wrapping up

I learned to implement designs I learned another CMS. Got more experience with GatsbyJS and Typescript.