javascript-projects

1. transparent_form

• Reference 🎨
• LIVE 🌐
• HTML: form elements
• CSS: selectors, background, flex, backdrop-filter, padding, margin, font-size, border, border-radius, box-shadow, color etc.
• JS: DOM manipulation, Form Validation, Events

2. calculator

• Reference 🎨
• LIVE 🌐
• CSS : box-shadow, grid, important, multiple classes, line-height, cursor, grid-column
• JS : querySelector, replaceAll(), eval(), toFixed(2), slice()method

3. emoji art

• Reference 🎨
• LIVE 🌐
• CSS: position

4. Animated page load

• Reference 🎨
• LIVE 🌐
• CSS : animation, keyframes, media-query, grid

5. Form Validation

• LIVE 🌐
• HTML: Form elements for user input.
• CSS: Styling for form layout and validation messages.
• JS: Validation logic to check user input and display appropriate messages.

6. TODO List

• LIVE 🌐
• HTML: List structure for tasks, input field for adding new tasks.
• CSS: Styling for layout, colors, and task items.
• JS: DOM manipulation for adding, deleting, and updating tasks.

7. Digital Clock

• LIVE 🌐
• HTML: Structure for displaying digital clock.
• CSS: Styling for layout, colors, and font size.
• JS: Script to update clock time in real-time.

8. Projectile Simulation

• LIVE 🌐
• HTML: Structure for displaying simulation environment.
• CSS: Styling for layout and animation.
• JS: Physics simulation for projectile motion.

9. Portfolio

• LIVE 🌐
• HTML: Structure for portfolio sections, projects, and contact information.
• CSS: Styling for layout, colors, and typography.
• JS: Optional interactivity like smooth scrolling or project filtering.

10. Mini Calendar

• LIVE 🌐
• HTML: Structure for displaying a mini calendar.
• CSS: Styling for layout and visual representation of dates.
• JS: Script to populate calendar with current month dates and handle navigation.

11. Tic Tac Toe

• LIVE 🌐
• HTML: Structure for game board and UI elements.
• CSS: Styling for layout, colors, and game grid.
• JS: Logic for game mechanics, including detecting wins and handling player turns.

12. Responsive Login Form

• LIVE 🌐
• HTML: Form elements for login input.
• CSS: Styling for form layout and responsiveness.
• JS: Basic form validation and submission handling.

13. Spotify

• LIVE 🌐
• HTML: Structure for music player, buttons, and controls.
• CSS: Styling for layout, colors, and player controls.
• JS: DOM manipulation for playing/pausing music, changing tracks, and displaying metadata.

14. Youtube [Responsive, REST API, Tooltip, Drawer]

• Reference 🎨
• LIVE 🌐
• CSS :
• JS :

console.log("to be continued");