Submission for the [Wix Studio Challenge ]
Tags: devchallenge, wixstudiochallenge, webdev, javascript
Published: 2024-07-04 20:43:38

*This is a submission for the* _[Wix Studio Challenge](https://dev.to/challenges/wix)_


## What I Built
I built an innovative eCommerce website called NovaMart. NovaMart offers a dynamic and user-friendly shopping experience, designed to cater to modern shoppers looking for convenience, personalization, and a seamless online experience.

## Demo

**Live-Link** - _[NovaMart](https://sr9993663832.wixstudio.io/novamart)_

**Github-Link** - _[NovaMart Github](https://github.com/Shyam-Raghuwanshi/NovaMart)_

## Development Journey

**Leveraging Wix Studio’s JavaScript Development Capabilities**
Creating NovaMart was an exciting journey that allowed me to fully utilize Wix Studio's robust JavaScript development platform. I began by using the powerful visual builder to design a clean and appealing interface that ensures an intuitive user experience

Local Development with @wix/cli
One of the most valuable tools during development was the npm package @wix/cli. This package allowed for efficient local development, enabling me to develop and test features locally before deploying them. The ability to work in a local environment significantly streamlined the development process, allowing for rapid iteration and testing.

Seamless Integration with GitHub
Another crucial aspect of the development process was the integration with GitHub. Wix Studio provides functionality to connect your project with a GitHub repository. This integration was incredibly helpful as it allowed for continuous integration and deployment. Whenever changes were pushed to the main branch, the site would automatically update with the latest changes, ensuring that the development and production environments were always in sync.

**Demo Video** [Loom Demo Video](https://www.loom.com/share/99953f5302a74e989ca3435cfac81d2e?sid=f5381f03-5316-4ce9-b1b8-76857817bd09)


**ScreenShorts**


**User Account page**

![User Account page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/naba7l91o3ri1tcv99ti.png)

**Login Page**

![Login Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/so2c9eoqd75fli7mud98.png)


**Home page**

![Home page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mpopod8yzeobrjnzyzhg.png)


**Products Page**

![Products Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4qe17opyxr4ljtv223lw.png)


**Product Page**


![Product Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yl7shox1vzxvfc69i18n.png)


**Donation Page**

![Donation Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x2pu9iqu3z661bxiy44w.png)


**Refer & Earn Page**

![Refer & Earn Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b5ylh8j8gtp1t8wye88z.png)





**To enhance the functionality of NovaMart, I integrated several of Wix’s APIs and libraries:**

Wix Stores API: This was crucial for managing product listings, inventory, and categories.
Wix Users API: Enabled user authentication and personalized experiences based on user data.
Wix Pay API: Facilitated secure and smooth payment processing(But unfortunatily, I am not able to apply this because it need to have a plan).
Wix Animations: Added dynamic content and animations to create an engaging shopping experience.
Wix SEO API: Ensured that NovaMart is optimized for search engines, improving visibility and reach.