Music-Website

Used Tehnologies: HTML, CSS, JavaScript, Node.js, Express.js

Test the page here (without the server-side functionality).

Instructions for using the page:

Before running the server index.js, you need to execute the following commands to install dependencies:

• npm install express --save
• npm install formidable --save
• npm install express-session –save

After installing the dependencies, run the command: node index.js

Now the server is ready to use. Access it in your browser at localhost:5000.

Minimum general requirements for part 1 (HTML + CSS):

HTML:

• Pass HTML validation tests at http://validator.w3.org/
• Use semantic tags presented in the course/lab

CSS:

• Separate files for HTML and CSS
• The site content must be meaningful (avoid filling it with Lorem Ipsum)
• The use of frameworks and libraries is not allowed

HTML:

• Pass HTML validation tests at http://validator.w3.org/
• Use semantic tags presented in the course/lab

CSS:

• Pass CSS validation tests at https://jigsaw.w3.org/css-validator/
• The site must be responsive (media queries, relative units, display types)
• Use basic CSS selectors (by id, class, tag, content element, child element, nth-of-type)
• Specify properties such as width, height, color, background, font-size, border, padding, margin, display, etc.
• Use columns for at least one page layout
• Create the layout without tables (using flex and grid)
• The site must include a dropdown menu (or another expandable element) implemented with CSS
• The site must include a transition that changes multiple properties at different time intervals
• The site must include an animation that modifies multiple properties of the same element
• ! Bonus point ! for content generation using :after, :before (must be meaningful; be creative)

Minimum general requirements for part 2 (JavaScript + Node.js misc):

A. JavaScript

• Separate file for JavaScript code
• Modify the style of an element or a group of elements
• DOM manipulation (selection by id, tag, class, using CSS selectors)
• Create and delete HTML elements
• Use and modify events triggered by mouse and keyboard
• Modify properties
• Functional inputs (e.g., text/range/number/radio/checkbox input, select, textarea)
• Use setTimeout or setInterval
• Use localStorage (store a collection of elements in localStorage)
• Use at least one method from the following classes: Math, Array, String, Date
• Randomly change the value of a property (e.g., color, size, position)
• Use properties like classList, target, or currentTarget
• Use methods like getComputedStyle, stopPropagation
• Validate form data using regular expressions

B. AJAX & Node.js

• GET/POST requests: retrieving data from a form

• AJAX requests fetching data from a JSON file

• Sessions: login/logout (using Node.js or Storage)

• Page for 404 error handling

• In addition to implementing these minimum requirements (which do not guarantee the maximum score), include solutions for other issues (of your choice) such as accessibility, internationalization (translation, special characters, etc.), the use of canvas/svg, etc.