• Introduction
• Frameworks
• UI
• Hooks and Utilities
• Code quality
• Prerequisites
• Usage
• License
• Author

Live like Josh's alter ego, j@28. Inspired by Aubrey Graham.

• Next.js – React framework for building performant apps with the best developer experience
• React Query – Efficient data fetching and state management library for React applications

• Tailwind CSS – Utility-first CSS framework for rapid UI development
• Radix – Primitives like modal, popover, etc. to build a stellar user experience
• Shadcn UI – Beautifully designed components that you can copy and paste into your app.
• Lucide – Beautifully simple, pixel-perfect icons
• geist – A typeface specifically designed for developers and designers.
• next-themes – A library for adding dark mode support to Next.js applications

• TypeScript – Static type checker for end-to-end typesafety
• Zod – A powerful TypeScript-first validation and parsing library for robust data handling.
• Prettier – Opinionated code formatter for consistent code style
• ESLint – Pluggable linter for Next.js and TypeScript

☑ set up repo

☑ install dependencies

☑ establish general layout

☑ design 404 page

☑ fix minor api and db bugs

☑ add menu feature

☑ edit toast

☑ build product page with disclaimer and carousel

☑ complete grid item functionality

☑ build cart and implement checkout

☑ filter and sort first 4 related products in product page

☑ switch getAllCategories and getAllProducts to useInfiniteQuery

☑ update database

☑ fix seo

☑ fix product grid item ui & responsiveness

☐ test on other devices and browsers

☐ build and deploy

☐ add links to bedroom bg-image and remove redirect?

☐ make cart scrollable with mousewheel?

☐ make bedroom bg-image scrollable?

☐ design and implement footer image?

☐ fix exit animation on some pages?

☐ add search feature? (probably in menu)

Before you begin, ensure you have the following software installed:

• Node.js
• npm or Yarn

Follow these steps to set up and run shop josh locally.

1. Create a new project:

   npx create-next-app --example https://github.com/joshuaedo/shop 

2. Create a .env file in the project root and add the following variables:

NEXT_PUBLIC_SHOP_API_URL=shop_api_url
SHOP_API_KEY=shop_api_key
NEXT_PUBLIC_SHOP_ID=shop_id
DATABASE_URL=your_database_url

Replace the placeholders.

3. Run the development server:

npm run dev

The application should be accessible at http:https://localhost:3000.

This project is licensed under the MIT License

• Joshua Edo (joshuaedo.com)