This sample app is built using:
- React
- NextJS - Server Side Rendering and SEO/Structured Data
- Styled Components
- TanStack Query - Data fetching and caching, and state management
You can use this as a starter template to build your own Next.js app, or use it as a reference to build your own custom retailer site on another platform (Wordpress, etc...) This app follows the guidelines of the Dispense Blueprint docs to build a fully custom retailer site.
A live version of this repo can be found here
https://www.highscore-cannabis.com
- Category, brand, cannabis type and effects landing pages.
- Product pages with product details, reviews, and related products.
- Cart and order complete pages.
- SEO meta data
- Structured Data (JSON+LD)
Clone this repository, and run the following command to install the dependencies:
cd into the project directory
pnpm install
You will need to create a .env.local
file in the root of the project and add the following environment variables:
NEXT_PUBLIC_ENV = dev
NEXT_PUBLIC_DISPENSE_BASE_URL = https://api.dispenseapp.com/2023-03
NEXT_PUBLIC_DISPENSE_API_KEY = your dispense api key here
NEXT_PUBLIC_DISPENSE_VENUE_ID = your dispense venue/retailer id here
NEXT_PUBLIC_AUTH_COOKIE = 'highscore-auth //use whatever name you'd like for the auth cookie
To start the development server, run the following command:
pnpm dev
Open http://localhost:1313 with your browser to see the result.