Danieldo1 / tanstack-query-react

A resorsfull intoduction to using react query with use of TypeScript for a simple filteration that is done via use of Upstash Vector DB

Next.js E-Commerce Storefront + TanStack React Query + Upstash 🔗

This project is an e-commerce storefront built with Next.js and TypeScript, showcasing the power of TanStack React Query for efficient data fetching and state management. It utilizes Upstash Vector DB for product information storage and retrieval, which enhances the filtering capabilities of the storefront. To optimize the user experience and protect the API routes, a debounce mechanism has been implemented to introduce a delay for user requests.

Features

• Next.js: A React framework for production with server-side rendering and static site generation.
• TypeScript: A typed superset of JavaScript that compiles to plain JavaScript for type safety.
• TanStack React Query: A powerful library for fetching, caching, and updating data in React applications with minimal effort.
• Upstash Vector DB: A highly performant database tailored for vector operations, perfect for the product filtration feature in this e-commerce project.
• Debounce: An optimization technique to delay the execution of a function after the last event is detected, reducing the number of API calls.

Getting Started

To get started with the project, clone the repository and install the dependencies:

git clone https://github.com/Danieldo1/tanstack-query-react.git
cd your-project-name
yarn install

Running the Application

To run the application locally, execute the following command:

yarn dev

Your e-commerce storefront is now running on http://localhost:3000.

Contributing Contributions are welcome! Please feel free to submit a pull request or create an issue if you have any suggestions or find a bug.

License This project is open-sourced under the MIT license. See the LICENSE file for details.