-This project is an online store that offers Nintendo consoles and games, both new and retro. -The development has been done using HTML, Tailwind CSS, with a touch of custom CSS, and Vanilla JavaScript.
-Access the site from a computer, tablet, or mobile for a consistent browsing experience. -On desktop, the cart sidebar opens automatically when you move to the right, and there's also an accessibility button.
-Add items from various sections, including search results, category sliders, or filtered items below. -The cart includes partial total, total items, and options to remove individual items or clear the entire cart.
-Register and create an account, and user data is stored in local storage, just like cart contents.
-Utilize a database array for the search functionality across all pages (dataBase). It provides partial results beneath the input, including the item and its price, and it's case-sensitive. We recommend using keywords like "Mario," "Zelda," or "Joystick."
-Automatic image and card sliders for a dynamic browsing experience. -Real-time search functionality with partial results and dynamic drawing. -Cart navigation and scrolling actions. -Actions on cart, login, and sign-in icons. -Buttons to add items to the cart from any part of the web app. -Full cart functionality, including buy, clear, and hide. -Real-time cart updates after clicking "Add to Cart." -"X" button to individually remove items from the cart. -Function to calculate the cart total using forEach loop for individual items and the overall total. -Real-time updating of the total value in HTML when adding, removing, or clearing items. -Restoring stock when removing an item, whether by clearing the cart or individually removing by index. -Real-time search with partial results below the input, displaying item name and price. -On desktop, the cart slides in when moving the mouse within 2% of the right margin and hides when the mouse is outside the cart. On mobile, tap within 5% to open the cart -or use the nav button. -Functional login with welcome or error alerts for data import. -Real-time item filtering by type with the option to purchase directly. -Storage of account creation data and cart content in local storage. -Dynamic database loading and real-time item rendering in each section with filters. -Addition of class lists and button functions with real-time events once drawn. -Slider movement and card divs in categories with automatic movement. -Drawing search results in divs, adapting a specific div for that purpose with individual size modification. -Aesthetic use of the Alerts library. -Asynchrony. -Ajax and fetch. -Expandable terms and conditions section in the main for an initial attempt at SAP. -All decision input functions have verification, whether it's login without content, sign-in, or attempting to buy with an empty cart.
- Mauri Arbelaiz
Libraries Used:
Thank you for visiting our project!