At first, adding or deleting service cards required manually hardcoding HTML into the index.html file. Now, the dashboard is fully dynamic! You can manage your services directly via the “+ Add Service” button / ui and all data is instantly saved in the browser’s localStorage,

Though, when moving from hardcoded files to user inputs, you openup two dangerous vulnerabilities: XSS (Cross-Site Scripting) and URL Script Injection (e.g. entering javascript:alert(‘test’) into the URL field to execute code). To fix that, I changed the saving logic. Here is what I added:

if (!url.toLowerCase().startsWith(‘http://’) && !url.toLowerCase().startsWith(‘https://’)) {

return alert(’The URL must start with http:// or https:// ’);

}

So now it has to start with http:// or https:// and you cant add code because it would just open a website.