Cyango 3D E-commerce Product Page Example

This is an example of a 3D product page built with Cyango's iframe embed feature. The page can interact with a Cyango Story that is embedded in the page, by changing the colors and other features of the products.

This project is a React-based e-commerce product page component built with TypeScript, Vite, and Tailwind CSS.

Features

• Responsive product image gallery with support for images and iframes
• Color and size selection with interactive UI
• Product rating display
• Detailed product information and description
• Specifications table
• Responsive header with navigation

Getting Started

Prerequisites

• Node.js (v14 or later)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/cyango/cyango-ecommerce-example.git
   cd cyango-ecommerce-example
   

2. Install dependencies:

   npm install
   

Running the Development Server

To start the development server, run:

npm run start

The application will be available at http://localhost:5173.

Building for Production

To create a production build, run:

npm run build

The built files will be in the dist directory.

Customization

• Modify src/App.tsx to change the product data.
• Update components in the src/components directory to adjust the layout and functionality.
• Customize styles by