Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/akibanks/tienda_musica_web/llms.txt

Use this file to discover all available pages before exploring further.

VinylVibes is a static site. There is no build step, no npm install, and no environment file to configure. The entire frontend is plain HTML, CSS, and JavaScript — clone the repository, start any static file server, and the store is running. The only external dependency is the REST API at https://api-tienda-vinilos.onrender.com, which is already configured in all three JavaScript files and is publicly reachable.

​
Running Locally

1

Clone the repository

Clone the repository from GitHub and navigate into the project directory.
git clone https://github.com/akibanks/tienda_musica_web.git && cd tienda_musica_web
2

Start a local file server

Serve the project with any static file server. The two most common options require nothing beyond Node.js or Python, both of which are typically already installed.
npx serve .
3

Open the app in your browser

Navigate to the address printed by your chosen server.The main catalog page will load immediately. The carousel, genre filters, and search bar are all functional as soon as the page opens — no login required to browse.
4

Log in with the demo account

To explore the admin panel and protected features, sign in with the built-in demo account.
FieldValue
Usernameadmin_chocolate
Passwordchocolate
This account has the demo role, which grants read-only access to the admin panel. All write controls (role changes, user deletion, sale status updates) are visible but disabled, and a read-only banner is displayed at the top of the admin layout.

​
Connecting to Your Own Backend

The API constant at the top of script.js, login.js, and admin.js controls which backend the frontend talks to. By default, all three files point to the hosted instance:
script.js
const API = 'https://api-tienda-vinilos.onrender.com';
To use a local or custom backend, replace the value of API in all three files. For example, if you are running the backend locally on port 4000: 
const API = 'http://localhost:4000';
You must update the constant in all three files — script.js, login.js, and admin.js — for the frontend to route every request correctly. Each file declares its own API constant independently at the top of the file.

​
Token Storage and Protected Requests

After a successful login, login.js stores the JWT returned by POST /login in localStorage under the key vv_token. Every subsequent request to a protected endpoint reads that token and attaches it as a Bearer header: 
function authHeaders() {
    return {
        'Content-Type':  'application/json',
        'Authorization': `Bearer ${localStorage.getItem('vv_token') || ''}`,
    };
}
This header is added automatically by script.js (for checkout, recommendations, and purchase history) and by admin.js (for all admin endpoints). You do not need to manage the token manually — it is set after login and cleared on logout.
To log out programmatically or reset a stuck session, remove the relevant keys from localStorage in the browser console: localStorage.removeItem('vv_token'), localStorage.removeItem('usuarioLogueado'), localStorage.removeItem('esAdmin'), and localStorage.removeItem('esDemo').

​
Deploying to GitHub Pages

VinylVibes requires no build or deployment configuration for GitHub Pages. Push your changes to the main branch and GitHub Pages serves the static files automatically. 
git add .
git commit -m "your changes"
git push origin main
GitHub Pages will detect the repository and begin serving index.html as the site root within minutes of the push. No gh-pages branch, no Actions workflow, and no configuration file is needed.

Build docs developers (and LLMs) love

Get started for freeTalk to us