Strona jako kod

Strona Twojego sklepu to projekt z plikami TSX, CSS i HTML — wersjonowany, budowany i publikowany przez ItemShop.

W ItemShop 3.0 strona, którą widzi gracz, to projekt z kodem — tak jak strona zrobiona w generatorze stron, tylko podpięta do Twojego sklepu. Nie musisz programować: zaczynasz od szablonu i zmieniasz go rozmową z AI. Jeśli programujesz — masz pełną kontrolę nad każdym plikiem.

​

Trzy drogi do strony

Szablon

Wybierz gotowy szablon open source (MIT) i zmień logo, kolory, teksty.

AI edytor

Opisz zmianę słowami. AI edytuje pliki, buduje podgląd, Ty publikujesz.

Własny kod

Wgraj zip, folder albo użyj itemshop deploy z terminala.

Drogi można łączyć: wybierasz szablon, poprawiasz go z AI, a potem ściągasz projekt przez CLI i dalej rozwijasz u siebie.

​

Jak to działa

Pojęcie	Co to jest
Strona (Site)	Projekt strony sklepu. Jeden sklep ma jedną stronę.
Szkic (draft)	Robocze zmiany — tu pracuje AI edytor i edytor plików. Nie są widoczne dla graczy.
Rewizja	Niezmienny zapis wszystkich plików po zatwierdzeniu szkicu. Autor: Ty, AI, upload albo CLI.
Build	Zamiana rewizji na statyczne pliki (HTML, CSS, JS) w izolowanym środowisku.
Wdrożenie	Opublikowany build: podgląd (prywatny adres) albo produkcja (Twoja domena).

Więcej o budowaniu, adresach podglądu i wycofywaniu zmian: Build i hosting.

​

Plik itemshop.site.json

W katalogu głównym projektu leży manifest, który mówi ItemShop, jak zbudować stronę:

itemshop.site.json

{
  "$schema": "https://itemshop.pl/schema/site.json",
  "name": "bento",
  "framework": "vite-react",
  "build": { "command": "npm run build", "output": "dist" },
  "template": { "id": "bento", "version": "1.0.0" }
}

Pole	Znaczenie
framework	vite-react (TSX + CSS, domyślny dla szablonów i AI) albo static (czysty HTML/CSS/JS, bez builda).
build.command	Komenda budowania. Dla static pomijana.
build.output	Katalog z gotowymi plikami po buildzie.
template	Z jakiego szablonu i wersji powstał projekt (informacyjnie).

Brak manifestu, ale jest index.html w katalogu głównym? ItemShop potraktuje projekt jako static — zwykła strona HTML zadziała od razu.

​

Istniejące sklepy

Sklep zbudowany w konfiguratorze bloków działa bez zmian, dopóki nie opublikujesz pierwszej strony z kodu: do tego czasu graczy obsługuje dotychczasowa strona sklepu. Pierwsza produkcja nowej strony przełącza ten sam adres (i Twoją domenę) na projekt z kodem. Zobacz Migracja z konfiguratora.

​

Skąd strona bierze dane

Strona działa wyłącznie po stronie przeglądarki — nie ma własnego serwera. Produkty, ceny, metody płatności i widżety pobiera z publicznego Storefront API przez @itemshop/sdk. Płatność zawsze obsługuje kasa ItemShop: strona tworzy zamówienie i przekierowuje gracza do bramki.

import { createStorefront } from "@itemshop/sdk";

const sf = createStorefront(); // shopId i adres API z window.__ITEMSHOP__
const { products } = await sf.products.list();

Szablony

Galeria i co możesz zmienić bez kodu.

Limity

Rozmiary, czas builda, limity AI.