Made a comic store website with cool animations — checkout…
0 reactions
Made a comic store website with cool animations — checkout flow, animated cart, custom torn-paper style UI
I've been building this on and off for a while — a shop-style website for digital comics. Mainly did it to get better at animations and try out some new styling tools.
Built with: Next.js, Tailwind CSS, Framer Motion (for animations), Lucide icons.
Some parts that took way longer than I expected:
\- The torn-paper look you see around the site isn't images — I made it with SVG code so it stays sharp at any screen size. Getting the texture to look right without slowing the page down took a few tries.
\- The cart works using React's built-in state, no extra library. It's fine for now, but if I add saving carts later I'll probably need something stronger.
\- Checkout has 3 steps (shipping → payment → review) with a progress bar and animations between each step. Keeping the form data from resetting while switching steps was the tricky part.
\- There's no backend yet, so nothing saves after you close the tab. That's what I'm working on next, along with login/signup.
Live demo: comic-verse-delta.vercel.app http://comic-verse-delta.vercel.app
Would love any feedback — especially on how the animations feel on Web, and if anything in my cart code looks messy or could be done better. Also open to suggestions on what to add or fix next, this is still very much a work in progress.
#dev #programming #technology
source
I've been building this on and off for a while — a shop-style website for digital comics. Mainly did it to get better at animations and try out some new styling tools.
Built with: Next.js, Tailwind CSS, Framer Motion (for animations), Lucide icons.
Some parts that took way longer than I expected:
\- The torn-paper look you see around the site isn't images — I made it with SVG code so it stays sharp at any screen size. Getting the texture to look right without slowing the page down took a few tries.
\- The cart works using React's built-in state, no extra library. It's fine for now, but if I add saving carts later I'll probably need something stronger.
\- Checkout has 3 steps (shipping → payment → review) with a progress bar and animations between each step. Keeping the form data from resetting while switching steps was the tricky part.
\- There's no backend yet, so nothing saves after you close the tab. That's what I'm working on next, along with login/signup.
Live demo: comic-verse-delta.vercel.app http://comic-verse-delta.vercel.app
Would love any feedback — especially on how the animations feel on Web, and if anything in my cart code looks messy or could be done better. Also open to suggestions on what to add or fix next, this is still very much a work in progress.
#dev #programming #technology
source
| 3,000 mlx | |
| 4 | |
| 0 |