Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mays-m/online-store
Zenobia online Store
https://github.com/mays-m/online-store
css html javascript
Last synced: 7 days ago
JSON representation
Zenobia online Store
- Host: GitHub
- URL: https://github.com/mays-m/online-store
- Owner: Mays-M
- Created: 2022-12-17T21:24:28.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-06-19T19:55:05.000Z (5 months ago)
- Last Synced: 2024-06-20T09:00:40.970Z (5 months ago)
- Topics: css, html, javascript
- Language: HTML
- Homepage: https://mays-m.github.io/Online-Store/
- Size: 3.18 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Online Store: [Zanobia]( https://mays-m.github.io/OnlineStore/)
The idea of the website to have a dynamic online store that help the customers to find their needs in different path of life.
The website was inspired by Zara.fi. I chose this name because I believe it is marketable and easy to remember. Zanobia is a name that I find intriguing and memorable.
![mainpage](images/main-screen2.png)
## Resourcing
The resoures used in this assignment is many websites to get ideas for the project and for the technologies used also
- w3school.com
- github.com
- Wimma lab: project I was working with in WiMMA LAB called conduit I used some function to use java script in the project .
- zara.fi : To have an idea of the front-end should be like even the website 'Zanobia' ended totally differenet### use of time to the project was about 80-100h
- The time consumed quite alote beacuse I worked with two different websites and I wasn't sure about the best idea to go with but I choice the online store## Technology choices with reasoning behind them
- HTML : For front-end development of the website to create a content and add pictures to the page.
- advanced CSS3 : Responsive design is the term commonly used for describing that approach.For Web developers, it is now fairly common to be called upon to create a Web site or app that changes its user interface depending on the browser or device accessing the site to provide an optimized experience. One approach to this is to create different versions of your site/app for different platforms or browsers and serve them appropriately after detecting which browser or platform is looking at your site. But this is increasingly inefficient: browser sniffing is inherently error prone, and maintaining multiple copies of your code can turn out to be a nightmare.
- Advanced JavaScript : used some js to wotrk with some function so the customer can use the online store to buy items and add item to the cart.![mainpage](./images/screen2.png)
## General thoughts about the work process and what was learned :
### Features of the website
- User can buy any type of products.
- Users can sort & filter different kinds of products according to price, delivery time and importing country.
- Users can login or create an account.
- User can save their favoirte products### Page and Responsibilities
* Home Page
* Product Page :
** filter/Sort: User can filter/Sort the products according to choice.
** Product Description Page: User can get more information about product
* Cart Page: user can add and remove products from cart
* Wish List Page: users can save their favorite products.
* Payment Page: user will have to fill their payment details.### 📌 How to use
Users can access the website by clicking the login button and entering their credentials. New users can register by clicking on the register button and completing a simple form. Once logged in successfully, users can begin shopping. They can browse categories of interest and sort products according to their preferences. After selecting a product, they can add it to their cart or save it to their wishlist. To complete a purchase, users can simply click on "place order."
## Creators: Mays-M