En Base Studio Online Store
This project was created for my girlfriend’s business. She is an architect and she designs and sells home decor products made with concrete.
Right now the website is not live as she is focused on selling her products in local stores and events. But we are planning to launch the website again in the future.
Tech Stack
- Gatsby for the frontend. I really enjoy working with Gatsby, even though it’s popularity has decreased a lot in the last few years. It might be a little rough to get started because of the graphql queries but once you get the hang of it it’s really easy to work with, also the plugin ecosystem is great.
- Snipcart for the shopping cart. I wanted to try Snipcart for a while and this was the perfect project for it. I didn’t want to depend on a big ecommerce platform like Shopify or BigCommerce. I heard a lot of good things about Snipcart and I wanted to try it myself. It’s really easy to set up and it’s very customizable.
- Sanity for the CMS. Sanity is great, very customizable and easy to use as a developer. I’m using it to manage the products and the content of the website. I’m using the Gatsby Source Sanity plugin to get the data from Sanity and the optimized images. With the Gatsby plugin I can query the data with graphql. Sanity offers an alternative to graphql called GROQ but I didn’t want to learn a new query language just for this project.
- Chakra for the UI. All the components, with the exception of the shopping cart, were created with Chakra. It’s very easy to use and I was able to find good examples, specially in the Chakra templates website. It uses CSS-in-JS under the hood with emotion but the developer experience is very similar to Tailwind.
Key learnings
While working on this project I learned a lot about e-commerce. Even though the stack works great I would probably use a different approach in the future. There are a lot of edge cases that you have to consider when working with e-commerce. For example inventory management, shipping, taxes, etc.
I would probably use a big e-commerce platform like Shopify or BigCommerce. They have a lot of features out of the box and they are very customizable. My only concern is that they could be a little expensive for a small business.
Future Plans
I want to rebuild this project with a different stack, mostly because I want to learn something new. I want to try the Shopify framework Hydrogen, it’s build on top of Remix and it looks very promising. I would probably continue using Sanity but for the UI I want to switch to Tailwind.
I heard that Remix is adopting server components so I would probably wait for that to be released before starting the project, the last thing I want is to do a big refactor after a few months.
I could also use Next.js with Shopify or BigCommerce. I need to do more research before deciding.