Skip to content

SimonaPiz/Frontend-Mentor-Projects

Repository files navigation

Simona Pizio's Frontend-Mentor Projects

My challenges solutions from Frontend mentor site

Level legend:

  1. 🔵 Newbie
  2. 🟢 Junior
  3. 🟠 Intermediate
  4. 🔴 Advanced
  5. ⚫ Guru

🔵 6 - Interactive rating component | ✅

HTML CSS JS

preview interactive rating component

➡ view challange: frontendmentor.io/challenges/interactive-rating-component

➡ view my solution: repository - live demo

  • 📝Your challenge is to build out this interactive rating component and get it looking as close to the design as possible.

To do this challenge, you need a basic understanding of HTML, CSS and JavaScript.


🟠 5 - Room Homepage | ✅

HTML CSS JS

preview

➡ view challange: frontendmentor.io/challenges/room-homepage

➡ view my solution: repository - live demo

  • 📝Your challenge is to build out this e-commerce homepage and get it looking as close to the design as possible.

To do this challenge, you need a basic understanding of HTML, CSS and JavaScript.


🔵 4 - 3-column preview card component | ✅

HTML CSS

preview

➡ view challange: frontendmentor.io/challenges/3column-preview-card-component

➡ view my solution: repository - live demo

  • 📝Your challenge is to build out this 3-column preview card component and get it looking as close to the design as possible.

To do this challenge, you need a basic understanding of HTML and CSS and responsive design.


🟠 3 - E-commerce product page | ✅

HTML CSS JS

preview producy page

➡ view challange: frontendmentor.io/challenges/ecommerce-product-page

➡ view my solution: repository - live demo

  • 📝Your challenge is to build out this e-commerce product page and get it looking as close to the design as possible.

To do this challenge, you need a good understanding of HTML, CSS and JavaScript.


🟢 2 - Newsletter sign-up form with success message | ✅

HTML CSS JS

preview newsletter sign-ip

➡ view challange: frontendmentor.io/challenges/newsletter-signup-form-with-success-message

➡ view my solution: repository - live demo

  • 📝Your challenge is to build out this newsletter form and get it looking as close to the design as possible.

This will test your skills with basic form structure, validation, and submission. The success state will also be an excellent opportunity to work with DOM manipulation.


🔵 1 - QR code component | ✅

HTML CSS

preview QR code component

➡ view challange: frontendmentor.io/challenges/qr-code-component

➡ view my solution: repository

  • 📝Your challenge is to build out this QR code component and get it looking as close to the design as possible.

A perfect first challenge if you're new to HTML and CSS. The card layout doesn't shift, so it's ideal if you haven't learned about building responsive layouts yet.