สร้างร้านขายโคมไฟแบบอินเทอร์แอกทีฟด้วย AI (Supabase + Hostinger)

เปิดร้านโคมไฟที่ผู้ซื้อลากเมาส์ผ่านรางทองเหลืองเพื่อเปิดไฟ แล้วหรี่ไฟและสั่งซื้อได้ ดูเดโมสด (เปิดในแท็บใหม่)

แผนการทำงานและแหล่งข้อมูล

สิ่งที่ต้องมี

Claude Desktop

Claude Code ทำงานอยู่ในนั้นและปรับแต่งร้านของคุณ ต้องใช้แพ็กเกจ Claude แบบเสียเงิน

ดาวน์โหลด Claude Desktop

https://claude.ai/download

บัญชี GitHub

ฟรี ใช้เก็บสำเนา LUMIÈRE ของคุณเอง และ Hostinger จะดีพลอยจากที่นี่

สร้างบัญชี GitHub

https://github.com/signup

โฮสติ้ง Hostinger

ร้านของคุณที่เปิดใช้งานจริงจะทำงานที่นี่ คุณเลือกแพ็กเกจในขั้นตอนที่ 2

คุณไม่จำเป็นต้องมี Node.js, โปรแกรมแก้ไขโค้ด หรือเทอร์มินัล Hostinger เป็นผู้บิลด์และรันร้านให้ ส่วน Claude เป็นผู้แก้ไข

รับสตาร์ตเตอร์ร้านขายโคมไฟ

ดูตัวอย่างและคัดลอก LUMIÈRE

ลองร้านที่เสร็จแล้วก่อน: ลากเมาส์ไปตามรางทองเหลืองเพื่อเปิดโคมไฟแขวน ลองลากโคม แล้วคลิกโคมหนึ่งดวงเพื่อเปิดตัวหรี่ไฟ เดโมไม่มีหน้าแอดมินและไม่มีการชำระเงิน

เปิดเดโมออนไลน์ของ LUMIÈRE

หน้าร้านที่เสร็จสมบูรณ์ ทำงานอยู่ในเบราว์เซอร์ของคุณ

https://lumiere-lighting-store.vercel.app/

เปิด LUMIÈRE บน GitHub

https://github.com/salhiworks/lumiere-lighting-store

กด Use this template แล้วกด Create a new repository ตั้งชื่อแล้วเลือก Public หรือ Private กด Create repository

ยืนยันว่าเป็นสำเนาของคุณเอง

ที่อยู่ของ repository ขึ้นต้นด้วย github.com/ ตามด้วยชื่อผู้ใช้ของคุณเอง

ใต้ชื่อ GitHub ระบุว่าสร้างมาจาก salhiworks/lumiere-lighting-store

จากนี้ไปคุณจะใช้แค่ repository ของคุณเอง Hostinger จะดีพลอยมันในขั้นตอนที่ 2 และ Claude Desktop จะแก้ไขมันในขั้นตอนที่ 3 สตาร์ตเตอร์ต้นฉบับจะไม่ถูกเปลี่ยนแปลงเลย

ดีพลอยบน Hostinger

เตรียมโฮสติ้ง Node.js

เผยแพร่ก่อน ปรับแต่งทีหลัง: ภายในไม่กี่นาที ร้านของคุณจะกลายเป็นเว็บไซต์จริง และทุกการเปลี่ยนแปลงต่อจากนี้จะแสดงบนเว็บนั้น

เลือกแพ็กเกจ Hostinger

ใช้แพ็กเกจ Unlimited หรือแพ็กเกจ Cloud — LUMIÈRE ดีพลอยเป็น Node.js Web App ไม่ใช่เว็บไซต์แบบ static

นำเข้า repository ของคุณ

Hostinger Websites Create site Web App

เลือกโดเมนชั่วคราวเพื่อเริ่มต้น — คุณจะเชื่อมโดเมนของคุณเองในขั้นตอนที่ 5 เลือก Import Git Repository อนุญาต GitHub แล้วเลือกสำเนา LUMIÈRE ของคุณเองที่สร้างไว้ในขั้นตอนที่ 1 ไม่ใช่สตาร์ตเตอร์ต้นฉบับ

ตั้งค่าและดีพลอย

ใช้การตั้งค่า Next.js ที่ Hostinger ตรวจพบ — Hostinger จะบิลด์และเปิดร้านให้เอง เลือก Node.js 22 ตรวจให้แน่ใจว่าสคริปต์ build คือ build — ห้ามใช้ build:demo ซึ่งจะบิลด์เดโมแบบล็อกไว้

ก่อนดีพลอย ให้เพิ่มที่อยู่ของเว็บไซต์เป็นตัวแปรสภาพแวดล้อม (environment variable) ซึ่งก็คือที่อยู่ชั่วคราวที่คุณเพิ่งเลือก ตอนนี้ยังไม่ต้องใช้โดเมนจริง — ขั้นตอนที่ 5 จะเปลี่ยนให้และดีพลอยใหม่

NEXT_PUBLIC_SITE_URL

NEXT_PUBLIC_SITE_URL

ที่อยู่ชั่วคราวของคุณ ขึ้นต้นด้วย https://

ร้านต้องการเท่านี้ก็พอ Supabase และ Stripe เป็นตัวเลือกเสริมทั้งคู่ เก็บไว้ทำทีหลังได้

กด Deploy แล้วรอให้บิลด์เสร็จ เปิดที่อยู่ชั่วคราวของคุณ

ดูร้านของคุณที่เปิดใช้งานจริง

ที่อยู่ชั่วคราวของคุณจะเปิดร้าน LUMIÈRE ของคุณ

ลากเมาส์ผ่านรางแล้วโคมไฟสว่างขึ้น และรูปทุกรูปโหลดได้

หน้าร้านค้าและหน้าสินค้าเปิดได้

ร้านของคุณเปิดใช้งานแล้ว จากนี้ไป ทุกการเปลี่ยนแปลงที่ push ไปยัง branch main ของ repository คุณ Hostinger จะบิลด์ใหม่และเผยแพร่ให้อัตโนมัติ

ปรับแต่งด้วย Claude Desktop

เปิดโปรเจกต์ของคุณใน Claude Desktop

Claude Desktop Code Local

เริ่มเซสชัน Local ในโฟลเดอร์อย่าง Documents ใส่ที่อยู่ repository ของคุณด้านล่าง แล้วส่ง:

โคลนสำเนาของคุณ

ดาวน์โหลด repository LUMIÈRE ของคุณเองลงในโฟลเดอร์ย่อยใหม่ และตรวจสอบว่า Claude อัปเดตมันได้

Clone {{REPOSITORY_URL}} into a NEW subfolder inside the folder I selected, named after the repository. Never clone directly into the selected folder and never overwrite existing files. If Git is missing, tell me exactly how to install it. Then check that you can push to this repository with git push --dry-run. If GitHub needs me to sign in, tell me exactly what to do, and never ask me to paste a password or token into the chat. When it is done, tell me which new folder to open in my next Claude Desktop Local session.

ที่อยู่ repository ของคุณ

https://github.com/your-name/my-lighting-store

เปิดโฟลเดอร์ LUMIÈRE ของคุณ

เริ่มเซสชัน Local ใหม่ เปิดโฟลเดอร์ที่ Claude เพิ่งสร้าง — โฟลเดอร์ที่มี README.md อยู่ข้างใน ถ้า Claude Desktop ถาม ให้เชื่อถือโฟลเดอร์นี้

Claude แก้ไขสำเนานี้ของร้านคุณ แล้วส่งการเปลี่ยนแปลงไปยัง GitHub repository ของคุณเอง จากนั้น Hostinger จะอัปเดตเว็บไซต์จริงของคุณ

เล่าเรื่องร้านของคุณให้ Claude ฟัง

กรอกเท่าที่รู้ — ช่องที่เว้นว่างไว้ Claude จะใช้ของ LUMIÈRE ตามเดิม จากนั้นส่งในเซสชัน LUMIÈRE ของคุณ:

ปรับแต่งร้านโคมไฟของฉัน

เปลี่ยนชื่อ สินค้า ข้อความ และหน้าตาร้าน โดยคงแอนิเมชันโคมไฟและคู่รูปภาพไว้เหมือนเดิมทุกอย่าง

This folder is my own copy of the LUMIÈRE lighting store. Before you change anything, read README.md, AGENTS.md, docs/ARCHITECTURE.md and docs/ASSETS.md. AGENTS.md matters: this version of Next.js differs from what you may know. Customize the store for my business. Store name: {{STORE_NAME}} What makes us different: {{STORE_STORY}} Visual identity: {{VISUAL_STYLE}} Products: {{PRODUCTS}} Photos: {{PHOTOS}} Where each change belongs: - Name, description and navigation: lib/site.ts and the wordmark in components/layout/wordmark.tsx - Products and collections: lib/catalog/demo-data.ts. Make the same changes in supabase/seed.sql, so a database I connect later starts with the same catalog. - Homepage and studio copy: components/home/ - Colours and fonts: app/globals.css and app/layout.tsx Keep these exactly as they are: - The Pendant Lamp Rail in components/ui/pendant-lamp-rail.tsx: brushing the rail to switch lamps on, dragging, the detail view with its dimmer, and every animation, timing and hit area - The paired photos: every product keeps one OFF and one ON photo of the same size, at /lamps/<product-id>-off.webp and /lamps/<product-id>-on.webp, following the rules in docs/ASSETS.md - The admin, checkout, Supabase migrations and environment variables - The dependencies: don't add new ones Prices are in cents, as the catalog already stores them ($240 = 24000). The store uses one currency, USD by default. First show me a short plan: every file you will change, and what changes in it. Wait for my approval. Then make the changes, and run npm install, npm run lint and npm run typecheck so the build can't break. Fix anything they report. Don't start a local server and don't push anything yet: I'll ask you to publish when I'm ready.

ชื่อร้าน

Atelier Nord

สตูดิโอโคมไฟของคุณแตกต่างอย่างไร?

โคมไฟแขวนเซรามิกและทองเหลืองผลิตจำนวนน้อย ทำมือที่ลิสบอนและจัดส่งทั่วยุโรป

อัตลักษณ์ทางภาพ

โคมไฟของคุณ — บรรทัดละหนึ่งรายการ: ชื่อ, งานผิว, ราคา

โดมเซรามิก, สีทราย, $240 กรวยทองเหลือง, ผิวขัดด้าน, $310

รูปโคมไฟ

อ่านแผนก่อนอนุมัติ และขอให้ Claude แก้เพิ่มในเซสชันเดิมได้จนกว่าร้านจะเป็นแบบที่คุณต้องการ

ใช้รูปโคมไฟของคุณเอง

เปลี่ยนรูปเดโมก่อนเริ่มขาย

รูปโคมไฟเดโมทั้ง 16 รูปมาจากเดโมของคอมโพเนนต์ต้นฉบับ และยังไม่ได้ตรวจสอบลิขสิทธิ์ สำหรับร้านจริง ให้ใช้รูปที่คุณเป็นเจ้าของหรือได้รับอนุญาตแล้ว

โคมแต่ละดวงต้องมีสองรูป: ตอนปิดไฟหนึ่งรูป และตอนเปิดไฟหนึ่งรูป รางจะเปิดไฟโดยเฟดจากรูปหนึ่งไปอีกรูป ทั้งสองรูปจึงต้องซ้อนกันได้พอดี:

กล้อง ตำแหน่ง และขนาดเดียวกัน — เปลี่ยนแค่แสงเท่านั้น

พื้นหลังโปร่งใส และไม่มีเงาติดอยู่ในรูป

สายโคมออกจากขอบบน ตรงกึ่งกลางพอดี

แนวตั้ง ใช้ขนาดภาพเดียวกันทุกรูป — เดโมใช้ 557 × 900 px

ถ้าไม่ใช้ Supabase ให้วางภาพแต่ละคู่ไว้ในโฟลเดอร์นี้ของโปรเจกต์ โดยตั้งชื่อตามสินค้า เช่น dome-enamel-off.webp และ dome-enamel-on.webp แล้วสั่งให้ Claude นำไปใช้และเผยแพร่ ถ้าใช้ Supabase ให้อัปโหลดภาพเป็นคู่ในหน้าแอดมินแทน ระบบจะตรวจให้คุณ

public/lamps/

เผยแพร่การเปลี่ยนแปลงของคุณ

Claude ส่งร้านที่คุณปรับแต่งแล้วไปยัง GitHub repository ของคุณเอง และ Hostinger จะบิลด์เว็บไซต์จริงของคุณใหม่จากนั้น เมื่อพอใจกับการเปลี่ยนแปลงแล้ว ให้ส่งข้อความนี้:

เผยแพร่การเปลี่ยนแปลงของฉัน

ตรวจสอบร้าน จากนั้น commit การเปลี่ยนแปลงและ push ไปยัง branch main ของ repository คุณ

Publish my customized store. 1. Make sure npm run lint, npm run typecheck and npm run build all pass, and fix anything that fails. 2. Make sure .env.local and any other secrets are not committed. 3. Commit all my changes with a clear message and push them to the main branch of my own GitHub repository. Never push to any other repository. If GitHub needs me to sign in, tell me exactly what to do. When it is done, tell me the commit you pushed.

ดูการเปลี่ยนแปลงของคุณที่เปิดใช้งานจริง

รอสักไม่กี่นาทีให้ Hostinger บิลด์ร้านของคุณใหม่ รีโหลดที่อยู่ของเว็บจริงของคุณ ลากเมาส์ไปตามราง — โคมทุกดวงต้องสว่างขึ้น และสายโคมต้องต่อถึงราง คลิกโคมแล้วเลื่อนตัวหรี่ไฟ — ต้องเปลี่ยนแค่แสงเท่านั้น เปิดหน้าร้านค้าและหน้าสินค้า แล้วใส่โคมไฟลงตะกร้า

ผ่านไปไม่กี่นาทีแล้วยังไม่เปลี่ยน? เปิด Settings & Redeploy ใน Web App ของคุณแล้วดีพลอยใหม่ รู้สึกว่ามีอะไรผิดปกติ? อธิบายให้ Claude ฟังในเซสชันเดิม บอกให้แก้โดยไม่แตะราวโคมไฟ แล้วเผยแพร่อีกครั้ง

อยากดูตัวอย่างบนคอมพิวเตอร์ของคุณไหม? (ไม่บังคับ)

ไม่จำเป็นต้องทำเลย แต่ถ้าอยากดูการเปลี่ยนแปลงก่อนเผยแพร่ ให้สั่ง Claude ในเซสชันว่า ติดตั้ง dependencies, เริ่ม development server ด้วย npm run dev แล้วบอกที่อยู่ในเครื่องให้ฉัน ต้องใช้ Node.js 22 หรือใหม่กว่า และ Claude จะแจ้งถ้ายังไม่มี ร้านจริงของคุณไม่ได้ขึ้นอยู่กับขั้นตอนนี้

เชื่อมต่อ Supabase และหน้าแอดมิน (ไม่บังคับ)

สร้างโปรเจกต์ Supabase

ร้านที่เปิดใช้งานจริงของคุณใช้งานได้อยู่แล้วโดยไม่ต้องมี Supabase — ถ้าต้องการแค่นั้น ให้ข้ามไปขั้นตอนที่ 5 ได้เลย เชื่อมต่อเมื่อต้องการจัดการสินค้า รูปภาพ สต็อก และคำสั่งซื้อในหน้าแอดมินของคุณเองที่ /admin

สร้างบัญชี Supabase

https://supabase.link/r4gdwhi

กด New project — เลือกภูมิภาคใดก็ได้ และแพ็กเกจ Free ก็เพียงพอ บันทึกรหัสผ่านฐานข้อมูลไว้ในที่ปลอดภัย เมื่อโปรเจกต์พร้อมแล้ว ให้คัดลอก Project ID

Supabase Project Settings General

ให้ Claude เข้าถึงโปรเจกต์ของคุณ

ขั้นตอนนี้ให้ Claude ตั้งค่าฐานข้อมูลให้คุณ ในเซสชัน LUMIÈRE ของคุณใน Claude Desktop:

เปิด Customize ในแถบด้านข้าง จากนั้นเลือก Connectors แล้วเพิ่ม Supabase — หรือคลิก + ข้างช่องพรอมต์แล้วเลือก Add connectors คลิก Connect แล้วอนุมัติการเข้าถึงในเบราว์เซอร์ โดยเลือก organization ที่มีโปรเจกต์ของคุณ เริ่มเซสชัน Local ใหม่ในโฟลเดอร์เดิม เพื่อให้ Claude รับการเชื่อมต่อนี้

คุณลงชื่อเข้าใช้ผ่าน Supabase ในเบราว์เซอร์ จึงไม่ต้องใส่คีย์หรือรหัสผ่านลงในพรอมต์ การเชื่อมต่อนี้มองเห็นทุกโปรเจกต์ใน organization ที่คุณอนุมัติ ดังนั้นพรอมต์ถัดไปจะจำกัดให้ Claude ทำงานกับโปรเจกต์ LUMIÈRE ของคุณเท่านั้น

หา Supabase connector ไม่เจอ หรือไม่อยากใช้ใช่ไหม ข้ามพรอมต์ถัดไปแล้วใช้การตั้งค่าแบบแมนนวลท้ายขั้นตอนที่ 4 แทน: ไฟล์ SQL ชุดเดียวกัน 3 ไฟล์ โดยไม่ต้องใช้ connector

ขอให้ Claude ตั้งค่าฐานข้อมูล

ตั้งค่า LUMIÈRE บน Supabase

Claude จะใช้ migration และสินค้าของสตาร์ตเตอร์ ตรวจสอบความปลอดภัยและ storage แล้วส่งค่าสาธารณะสองค่าสำหรับ Hostinger ให้คุณ

Connect this LUMIÈRE store to my Supabase project {{PROJECT_REF}}. Work only on that project and never touch any other. Read README.md ("Connect Supabase"), docs/SUPABASE.md and docs/ADMIN.md first, and follow them. Use only the SQL this project already has. Don't write new tables, policies or setup SQL, and don't change the store's code. How to reach Supabase: - Use the Supabase connection in this session if it is connected. - Otherwise, use the Supabase CLI if I'm signed in, with the commands in docs/SUPABASE.md. - If neither works, stop and tell me exactly what to do. Never ask me for a password, an access token or a Secret key. Tell me what each step does before you run it: 1. Apply supabase/migrations/20261101120000_catalog_and_admin.sql, then supabase/migrations/20261101150000_orders_checkout.sql, in that order. They create the tables, the Row Level Security policies and the lamp-photos storage bucket. 2. Run supabase/seed.sql to add the three collections and the eight pendants. 3. Verify the setup: Row Level Security is on for every table, the lamp-photos bucket exists, there are 8 products and 3 collections, and Supabase's security advisor shows no warnings. Fix nothing by hand: tell me what's wrong. 4. Read my Project URL and Publishable key from the project, and show them to me as NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY, ready to copy into Hostinger. Never read, use or write the Secret key or service_role key, and don't create .env.local. Then stop and tell me to create my admin user in the Supabase Dashboard. When I give you my admin email, never my password, add that user to public.admin_users with the SQL in docs/ADMIN.md, check that the row exists, and tell me to sign in at /admin on my live store.

Project ID ของ Supabase

abcdefghijklmnopqrst

Claude จะถามก่อนทำทุกขั้นตอน — อ่านให้ดีแล้วจึงอนุญาต Claude จะหยุดรอเมื่อถึงตาคุณ

สร้างบัญชีแอดมินของคุณ

Supabase Authentication Users

กด Add user แล้วกด Create new user ใส่อีเมลและรหัสผ่านที่คาดเดายาก ปล่อยให้ติ๊ก Auto Confirm User ไว้ แล้วสร้างผู้ใช้ บอกอีเมลแอดมินให้ Claude รู้ — ห้ามบอกรหัสผ่านเด็ดขาด

Supabase Authentication Sign In / Providers

ปิด Allow new users to sign up แล้วบันทึก — ร้านนี้ไม่มีบัญชีลูกค้า

ไม่มีการเชื่อมต่อ Supabase? ตั้งค่าด้วยตัวเอง

ในโปรเจกต์ Supabase ของคุณ ให้เปิด SQL Editor แล้วรันไฟล์สามไฟล์นี้จากโฟลเดอร์ LUMIÈRE ของคุณตามลำดับ แต่ละไฟล์ให้เปิด คัดลอกทั้งหมด วางลงในคิวรีใหม่ แล้วกด Run ทุกไฟล์รันซ้ำได้อย่างปลอดภัย

supabase/migrations/20261101120000_catalog_and_admin.sql

supabase/migrations/20261101150000_orders_checkout.sql

supabase/seed.sql

คัดลอก Project URL และ Publishable key จาก Connect ไปใส่ใน Hostinger ตามที่แสดงในขั้นตอนถัดไป หลังสร้างผู้ใช้แอดมินด้านบนแล้ว ให้ใส่อีเมลของคุณด้านล่าง แล้วรันคำสั่งนี้ใน SQL Editor:

ตั้งให้ฉันเป็นแอดมิน

insert into public.admin_users (user_id) select id from auth.users where email = '{{ADMIN_EMAIL}}';

อีเมลแอดมินของคุณ

you@example.com

เพิ่มตัวแปร Supabase บน Hostinger

ร้านที่เปิดใช้งานจริงของคุณอ่านข้อมูล Supabase ผ่านค่าสาธารณะสองค่า ในแดชบอร์ด Web App ของคุณ เปิด Environment Variables แล้วเพิ่ม:

NEXT_PUBLIC_SUPABASE_URL NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY

NEXT_PUBLIC_SUPABASE_URL

Supabase Project URL

NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY

Supabase Publishable key

Claude ให้ค่าทั้งสองกับคุณแล้ว และยังดูได้ใน Connect ด้วย

เปิด Connect

https://supabase.com/dashboard/project/_?showConnect=true

เฉพาะค่าสาธารณะ

ห้ามใส่ Secret key หรือ service_role key ของ Supabase ที่นี่เด็ดขาด ค่าที่ขึ้นต้นด้วย NEXT_PUBLIC_ ทุกคนมองเห็นได้ในเบราว์เซอร์

บันทึกตัวแปร — Hostinger จะบิลด์ร้านของคุณใหม่ด้วยค่าเหล่านี้ ยังไม่บิลด์ใหม่? ดีพลอยใหม่จาก Settings & Redeploy เปิด /admin บนที่อยู่เว็บจริงของคุณ แล้วลงชื่อเข้าใช้ด้วยอีเมลแอดมิน

ในหน้าแอดมิน คุณเพิ่มและแก้ไขสินค้า อัปโหลดคู่รูป OFF/ON และจัดการสต็อกกับคำสั่งซื้อได้ ทุกครั้งที่บันทึก ราง หน้าร้านค้า และหน้าสินค้าจะอัปเดตตาม

เชื่อมโดเมนและเปิดตัว

เชื่อมต่อโดเมนของคุณ

Hostinger Your Web App Connect domain

ใส่โดเมนของคุณแล้วทำตามขั้นตอนการเชื่อมต่อ จดโดเมนไว้ที่อื่น? เพิ่มเรคคอร์ด DNS ที่ Hostinger แสดงไว้ที่ผู้ให้บริการจดโดเมนของคุณ เก็บเรคคอร์ดอีเมลที่มีอยู่ไว้ รอจนโดเมนแสดงว่าเชื่อมต่อแล้วและ SSL ใช้งานได้

การเปลี่ยน DNS อาจใช้เวลาหลายชั่วโมงกว่าจะมีผลกับทุกคน — สูงสุด 24 ชั่วโมง

เชื่อมต่อโดเมนของคุณเองกับเว็บไซต์หรือเว็บแอป

คำแนะนำฉบับเต็ม รวมถึงโดเมนที่จดไว้ที่อื่น

/video/connect-a-custom-domain-to-your-website-or-web-app

เปลี่ยนเป็นโดเมนของคุณแล้วดีพลอยใหม่

ร้านของคุณสร้างลิงก์ sitemap และระบบเข้าสู่ระบบที่ปลอดภัยของหน้าแอดมินจากที่อยู่นี้เพียงที่เดียว ในแดชบอร์ดของ Web App ให้เปิด Environment Variables แล้วเปลี่ยนเป็นโดเมนของคุณ:

NEXT_PUBLIC_SITE_URL

NEXT_PUBLIC_SITE_URL

โดเมนของคุณ ขึ้นต้นด้วย https://

บันทึกตัวแปร ดีพลอยใหม่จาก Settings & Redeploy เพื่อให้ที่อยู่ใหม่ถูกบิลด์รวมไว้ รอให้บิลด์เสร็จ

ทดสอบร้านที่ออนไลน์จริง

เปิดโดเมนของคุณแล้วตรวจสอบ:

ที่อยู่ขึ้นต้นด้วย https:// และมีรูปแม่กุญแจ

ลากเมาส์ผ่านรางแล้วโคมไฟสว่างขึ้น และรูปทุกรูปโหลดได้

หน้าร้านและหน้าสินค้าเปิดได้ และโคมไฟถูกใส่ลงในตะกร้า

ถ้าใช้ Supabase: เข้าสู่ระบบที่ /admin ได้

ที่อยู่ที่ไม่มีอยู่จริง เช่น /shop/no-such-lamp แสดงหน้าไม่พบหน้าเว็บ

ร้านขายโคมไฟของคุณเปิดใช้งานบนโดเมนของคุณเองแล้ว หากต้องการเปลี่ยนแปลงภายหลัง ให้แก้ไขสินค้าในหน้าแอดมิน หรือสั่งให้ Claude แก้โค้ดและเผยแพร่ให้ เพราะ Hostinger จะบิลด์ร้านของคุณใหม่ทุกครั้งที่มีการ push ไปยัง main