Templates and other code - uttamsai/digital-art-supplies GitHub Wiki
Templates and other code
Third-party templates
No third-party page template or Bootstrap example theme was used. The layout and styling were built from scratch using Bootstrap 5's utility classes and components (grid, navbar, forms, buttons, pagination) directly — no copied template files.
Library used: Bootstrap 5 — grid system, navbar, forms, buttons, pagination components, and utility classes. No other third-party UI library/template was used.
Product data and images
Real drawing-tablet listings can't be scraped from Amazon directly (its robots.txt blocks it), so the catalog in src/data/products.json was built from public research — manufacturer sites and independent buyer's-guide comparisons of Wacom, Huion, XP-Pen, GAOMON, and Xencelabs tablets. Model names and brands are real; exact prices/specs are approximate and illustrative, not live pricing.
27 of 28 products' images are hotlinked directly from each manufacturer's own official site (wacom.com/estore.wacom.com, huion.com, xp-pen.com, gaomon.net, xencelabs.com). One product, the GAOMON PD1560, uses a generated placeholder because its product page renders its photo gallery entirely in JavaScript, with no static image URL to extract (product page).
AI-assistance disclosure
This project was developed with assistance from Claude (Anthropic), an AI coding assistant, used as a pair-programming tool throughout development. Claude:
- Researched real drawing-tablet models, brands, and specs from manufacturer sites and independent comparison articles to build the
products.jsoncatalog - Generated the placeholder SVG product artwork used as a fallback image
- Sourced real product photo URLs for 27 of 28 products directly from each manufacturer's official website
- Wrote the client-side form validation logic in
CreateAccountView.jsxandAccountView.jsx - Wrote the image-fallback utility in
src/utils/images.jsthat swaps a hotlinked product photo back to the generated placeholder if it ever fails to load - Diagnosed and fixed a Vite asset-path bug (
base: './'invite.config.js) needed for the site to work when hosted under a GCS bucket subpath
I reviewed the generated code, tested it in the browser, and contributed to the overall UI design and layout, helped set up the basic shop structure, organized and filled out the product data in the JSON file, and worked on the multiple routed views and navigation between the different sections of the site.