terre-rouge.shop is an headless ecommerce website built in TypeScript with Next.js, Algolia, TailwindUI, HeadlessUI, React Query and Shopify Storefront GraphQL API.
- Description
- Tech Stack
- Third parties
- Performances
- Features
- Incoming Features
- Installation
- Deployment
- License
terre-rouge.shop is a web application that allow users to order Malagasy spices with a focus on performance and user experience.
The application is built with Next.js, a popular React-based framework for building web applications. It is also integrated with Algolia for search functionality, Partytown for performance optimization, TailwindUI and HeadlessUI for UI components, React Query for data fetching, Sentry for error monitoring, GraphQL for data management, and TypeScript + Codegen for type safety.
The primary objectives of this website are to ensure both user-friendly and speed 🚀.
In order to achieve these goals, the following tools are used:
🎉 Partytown is a library that uses web workers to load third-party libraries, which can otherwise negatively impact lighthouse scores.
🔍 Algolia is used for fast search results, while Next.js is used for static page rendering.
I'm currently working on a migration to Astro to solve this issue.
- Using storefront Shopify API
- Algolia autocomplete for global search
- Category page plugged to algolia search results
- Cart management
- Cookie banner
- Custom checkout
- Storybook (sanitize components)
- Improve performances (Switching to Astro)
- Improve SEO
The website is hosted on Vercel platform.
MIT