soidesmax®
START HERE

Installation & setup

Requirements, commands and the first steps for this template.

Version 1.0.0

📋 Requirements

  • Node.js 20.9.0 or newer and npm.
  • Frontend development knowledge for customization and connecting live services.

🚀 Quick start

  1. Download and extract the source ZIP delivered by Lemon Squeezy after purchase.
  2. Open a terminal in the extracted folder containing package.json.
  3. Run npm install.
  4. Run npm run dev -- --webpack and open http://localhost:3000 to view Overview.
  5. Run npm run build -- --webpack to create a production static export in out/.
  6. Follow the README to replace fixtures, customize tokens and connect services.

🔧 Troubleshooting

Run commands from the folder containing package.json, check your Node version and keep the lockfile. If port 3000 is busy, run npm run dev -- --webpack --hostname 127.0.0.1 --port 3217 and open http://127.0.0.1:3217. On Windows, use the Webpack commands above if Turbopack encounters a filesystem permission error. Use an HTTP server for a static export rather than opening index.html through file://. Demo changes are held in memory and reset when the page reloads.

USE IT IN YOUR PROJECTIncluded stack: TypeScript + React + Next.js + Tailwind CSS

Follow the included README first. These steps apply to the technologies listed for this product.

  1. Use the included TypeScript configuration and install the locked dependencies.
  2. Keep the supplied types when replacing fixtures or connecting your own services.
  3. Run the package’s type check and production build before publishing.
A CLOSER LOOK

About this product

Live Preview: https://vitrin.soidesmax.store/

Vitrin is a complete shop admin template behind a deep-blue glass UI: orders, products and inventory, a working point-of-sale screen, returns, discounts and gift cards, and sales analytics - every number in the demo reconciles across screens, because all of it reads from one data source. 23 layouts. Frontend UI · Demo data - no backend included.

🎯 Perfect for your next shop admin template project

  • Developers building an ecommerce admin, store operations dashboard or point-of-sale interface.
  • Product teams prototyping order management, inventory management and customer workflows.
  • Agencies creating a commerce admin frontend for a client, under the included license.
  • Designers who want to inspect realistic flows before connecting a backend.

🧩 What's inside - 23 layouts

📊 Overview and sales

Overview brings together revenue, order count, customers, average order value, top products, traffic sources, recent orders and low-stock warnings. The same ledger drives Analytics, customer totals and the sidebar revenue card.

Orders provides search, status filters, selection, fulfillment actions and CSV export. Order detail shows stored line quantities, sold prices, discounts, shipping, tax, refund amounts and order-specific notes. Draft orders retain the selected customer, variants and quantities by ID. Open a saved draft to continue the same order in POS.

Returns link to real sample order lines. Approve a request to restock the linked variant and record a refund; reject it without changing the order or stock.

🛒 Point of sale

The POS screen includes product search, category filtering, variant selection, cart quantities, active percentage or fixed discount codes, simulated card/cash checkout and receipts. Tax is 8% on the discounted subtotal. Money calculations use integer cents. Exact cash tender is accepted and change is calculated from the recorded total.

Completing a demo sale creates a paid order, reduces the selected variant stock and updates the shared financial figures. Refunding it records the amount and reduces net revenue and customer spend. Receipts retain a snapshot of the names and prices as sold, so subsequent product edits cannot rewrite an old receipt. No real payment is collected.

📦 Products, inventory and customers

Products supports grid/table browsing, search and inventory filters. Product editor saves the name, price, stock, tags and variant prices/SKUs/stock. Collections stores manual membership and computes automatic membership from product tags; displayed product counts follow actual membership.

Customers derives segments from net paid order history. Customer detail shows the customer's own order history, join date and lifetime net spend. The bundled customer/staff avatars and six product photos are local assets; there are no external image hotlinks.

📈 Growth and store

Analytics with report builder uses the same daily order/refund series as Overview, with 7/30/90-day views and CSV export. Campaigns shows recorded budgets, spending and computed usage percentages. Discounts & gift cards includes discount creation and a gift-card issuance/redemption transaction ledger.

Online store preview illustrates the customer-facing shop shell. Help center includes FAQs and an explicitly simulated support form. Four Settings layouts cover General, Payments, Shipping & taxes, and Team & roles. Settings save in-session, including team roles, while store/card status labels read the same shared status record. Sign in is a frontend demonstration, not an authentication service.

Two shared overlays complete the count: Command menu (Cmd/Ctrl+K) and Notifications panel, with events and ages derived from orders and returns. The 23-layout total is 21 named screens plus these two overlays; it does not mean 23 independent URL routes.

📁 What you receive

Your purchase delivers Vitrin-Source.zip, containing the editable app/, data/, lib/, styles/ and public/ files, package.json, package-lock.json, TypeScript/Next.js configuration, README.md, SPEC.md, LICENSE and asset credits. Customer and product images are bundled locally.

The public demo is a separate static deployment of the matching build. The paid source ZIP is not published as a public download. Internal agent files, audit notes, build caches and node_modules are excluded from the delivery ZIP.

⚙️ Tech

Next.js · React · TypeScript · Tailwind CSS, with Radix Dialog, cmdk, Phosphor icons and Motion. Sample data lives in one data/ folder. Each screen reads the same in-memory store, and selectors derive financial, inventory and customer figures from the records.

Use the included lockfile to preserve resolved dependencies. Shared tokens and reusable components provide a starting point for your own brand. Fonts use Google Fonts with fallbacks; self-host them if your deployment needs to work fully offline.

🛠️ Setup and customization

📋 Requirements

  • Node.js 20.9.0 or newer and npm.
  • Frontend development knowledge for customization and connecting live services.

🚀 Quick start

  1. Download and extract the source ZIP delivered by Lemon Squeezy after purchase.
  2. Open a terminal in the extracted folder containing package.json.
  3. Run npm install.
  4. Run npm run dev -- --webpack and open http://localhost:3000 to view Overview.
  5. Run npm run build -- --webpack to create a production static export in out/.
  6. Follow the README to replace fixtures, customize tokens and connect services.

🔧 Troubleshooting

Run commands from the folder containing package.json, check your Node version and keep the lockfile. If port 3000 is busy, run npm run dev -- --webpack --hostname 127.0.0.1 --port 3217 and open http://127.0.0.1:3217. On Windows, use the Webpack commands above if Turbopack encounters a filesystem permission error. Use an HTTP server for a static export rather than opening index.html through file://. Demo changes are held in memory and reset when the page reloads.

ℹ️ Demo scope

Frontend UI · Demo data - no backend included. There is no database server, authentication service, payment processor, live inventory integration or email delivery. Sample identities and store records are fictional. In-session edits reset on reload and are not shared between visitors. Bring your own backend, credentials and production services, keeping secrets out of frontend code.

❓ FAQ

❓ Is Vitrin a working AI backend?

No. Vitrin includes frontend UI and typed demo data. You connect your own live services.

❓ Is this a Framer or Figma product?

No. This download contains Next.js and React source code. No Framer remix link or Figma file is included.

❓ Can I use it for client projects?

The included license permits personal and commercial end products, including client projects. Standalone template resale or redistribution is prohibited. See LICENSE for full terms.

❓ Where do I replace sample data?

Use the data/ folder and follow the included README for setup and customization.

📄 License & Support

The included license permits personal and commercial end products, including client projects. You may modify the template for those projects. You may not resell or redistribute Vitrin, or a modified version, as a standalone template, UI kit, starter, theme or competing source-code product. Third-party assets and dependencies retain their own license terms. Read the included LICENSE for the full terms.

🏷️ Price and preview

Regular price: $99 · Sale price: $59 · Save $40.

Use VITRIN10 for an additional $10 discount: $49 before applicable taxes, limited to 10 redemptions and applicable only to Vitrin.

Browse more templates at Soidesmax, see support, and consult the official Next.js documentation when connecting your own services.

🔖 Tags

shop admin template, ecommerce admin, admin dashboard template, pos, point of sale, order management, inventory management, product management, store admin, sales analytics, react admin template, nextjs template, ecommerce dashboard, dashboard ui kit, discounts, gift cards

Included screens / pages

  • Overview
  • Orders
  • Order detail
  • Draft orders
  • Returns
  • POS - Point of sale
  • Products
  • Product editor with variants
  • Collections
  • Customers
  • Customer detail
  • Analytics with report builder
  • Campaigns
  • Discounts & gift cards
  • Online store preview
  • Help center
  • Settings - General
  • Settings - Payments
  • Settings - Shipping & taxes
  • Settings - Team & roles
  • Sign in
  • Command menu (Cmd/Ctrl+K) overlay
  • Notifications panel overlay

UI interactions

  • POS cart, variants, stored discounts, simulated card/cash checkout and snapshot receipts
  • Shared order creation, refund records, stock updates and net financial selectors
  • Product/variant editing, tags, manual and automatic collections
  • Draft customer/item preservation and approve/reject return workflows
  • CSV export, customer history, command search and derived notifications
  • In-session settings and team roles; reload restores demo fixtures

What you get

  • app/ - Next.js workspace screens and shared forms
  • data/ - typed sample records, cents math, actions, store and selectors
  • lib/ - motion helpers
  • styles/ - shared tokens
  • public/ - local product/avatar photos and glass asset
  • package.json + package-lock.json + Next.js/TypeScript configuration
  • README.md + SPEC.md + LICENSE + ASSET-CREDITS.md

Integrations

Frontend UI · Demo data. No backend, database, authentication service, payment processor, inventory integration or email delivery is included. POS checkout is simulated. Demo changes and saved settings are in-memory and reset on reload. Connect your own production services and keep credentials out of frontend code.

Changelog

Release notes · Current version 1.0.0

v1.0.0 - Nov 10, 2026 (Initial release)

FAQ

❓ Is Vitrin a working AI backend?

No. Vitrin includes frontend UI and typed demo data. You connect your own live services.

❓ Is this a Framer or Figma product?

No. This download contains Next.js and React source code. No Framer remix link or Figma file is included.

❓ Can I use it for client projects?

The included license permits personal and commercial end products, including client projects. Standalone template resale or redistribution is prohibited. See LICENSE for full terms.

❓ Where do I replace sample data?

Use the data/ folder and follow the included README for setup and customization.

Version 1.0.0 · Updated

Assets & usage rights

Six product photos and nine fictional customer/staff portraits are bundled locally from Unsplash. See ASSET-CREDITS.md for local mappings and hashes. The indigo glass background is included. Third-party assets retain their own terms. Fonts use Google Fonts with fallbacks.

BEFORE YOU GET STARTED

License & usage

Personal and commercial end products, including client projects. You may modify the template for those projects. You may not resell, sublicense, publish or redistribute Vitrin or a modified version as a standalone template, UI kit, starter, theme or competing source-code product. Third-party assets and dependencies retain their own license terms. See the LICENSE included in the source ZIP for full terms.