Projects from roadmap.sh

A collection of web projects inspired by roadmap.sh projects. These range from simple static sites to dynamic web apps. The main page serves as an index to all projects.

Table of Contents

• Technologies Used
• Setup
• Projects
• Contact

Technologies Used

• HTML
• CSS
• JavaScript
• API calls
• DOM manipulation
• Event handling
• Promises

Setup

To view any project locally:

1. Clone this repository.
2. Open index.html in your browser.
3. Browse any project with the main page.

Projects

Tooltip UI

Master CSS positioning and hover effects to create tooltips without JavaScript.

Requirements:

• Tooltip appears above navigation items on hover
• Only HTML and CSS

---

Calculator

Practice event listeners and DOM manipulation with a calculator UI.

Requirements:

• Number and operation buttons
• Display for current value
• Evaluate math operations

---

Accordion

Use event listeners and DOM updates to create an interactive accordion.

Requirements:

• Expand/collapse questions
• Only one section open at a time

---

Testimonial Cards

Practice CSS positioning and layout with testimonial card designs.

Requirements:

• Create testimonial cards
• Match provided layout

---

Custom Dropdown

Practice DOM manipulation and interactive UI elements.

Requirements:

• Custom dropdown menu
• Placeholder, open/close states
• Highlight selected item

---

Pomodoro Timer

Practice setInterval and DOM manipulation for a timer app.

Requirements:

• Start/reset timer
• Display session type
• Configurable intervals
• Track work sessions

---

Task Tracker

Practice array manipulation and DOM updates.

Requirements:

• Add, mark, unmark, and delete tasks

---

Responsive Personal Portfolio

Practice media queries and responsive design.

Requirements:

• Multi-section website
• Responsive navigation

Contact

For questions or feedback, reach out via GitHub or at ruhlmirkojoel@gmail.com.