Project Summary
LAMA Shop is an e-commerce fashion store built from a YouTube tutorial by Lama Dev. By leveraging Wix Headless CMS for content and product management, I focused on building a responsive, user-friendly shopping experience. Along the way, I gained an understanding of the architecture behind an E-commerce application and how to use a product-based CMS like Wix SDK. I refined my skills in creating dynamic and fast server actions, complex state logic (for product options and the shopping cart), as well as implementing user journey optimization.
Project Goals
By utilizing a headless CMS to manage products for the e-commerce store, the application allows non-technical users like potential managers and administrators to manage and monitor products in real-time. It also allows for a wide range of features than can be implemented through the Wix SDK. The project aimed to delivery a smooth user experience, from the page load to the checkout confirmation. This means that a fully-functional user and product system was developed, allowing guests and registered users to add items to their cart. Products can be easily search and browsed based on categories, prices, and more. Some products providing multiple options like color and size, and these were cross-referenced with the specific stock quantities managed from the Wix Dashboard for a stronger user experience.
Tech Stack
Next.js and TailwindCSS were used to develop the frontend and server-side logic, connecting to the Wix Headless SDK to access products, stock, categories, and authentication. Zustand was used for global cart and UI states to ensure seamless state synchronization. As per usual, GitHub and Vercel were used for CI/CD and deployment.
Core Features
SEO-Friendly Server-Side Data
Dynamic routes, eg. /products/?category=featured, and URL query parameters ensure each filtered view is indexable and shareable. Search filters including category, price, product name and search sorting persist in the URL, boosting SEO value.
Responsive UI Components
The application was designed with mobile device responsiveness in mind. As of 2025, over 70% of e-commerce traffic and sales were through a mobile device... so it's not something small you can just forget. All pages utilized resizable and responsive components which ensured that the content fit perfectly onto smaller screens.
Product Information
On the product page, color and size availabilities are automatically updated by querying Wix's stock data. The state was manage to disable combinations/options that were out of stock, as well as display low-stock notices.
Each product also has descriptions and further information that can be changed using the Wix product dashboard.
Guest Cart and Authentication
Upon the first visit, a refreshToken cookie was generated. All cart actions (add, remove, quantity change) were updated to this token on the client side. Therefore, returning users immediately see their previous cart contents—no login required.
A simple authentication system (login, register, password reset) was implemented using the Wix SDK. For users who are signed in, the cart is automatically updated to Wix and saved to the account.
Checkout Prototype
While not functional, a simple checkout flow was created to resemble a real e-commerce payment page. It serves as a prototype ready for payment integration with Stripe or another payment gateway.
Key learnings and Next Steps
This project improved my understanding about the technical aspect of building an e-commerce store, including the cart, products and finally payments. I also learnt about complex server actions that handled the filtering of products, product customization and stock, and the global cart system.
For further development, I would consider using the Wix payment gateway to complete the checkout flow. This would also allow orders to be tracked all in the Wix dashboard. Some form of user and product analytics may also be implemented to gather more information about popular products and business metrics.
Overall, a fun and interesting project to have in my project portfolio.