Frontend Mentor | Arekpok29's profile

Lawrence Webber•160

@lwebbz

Submitted 5 months ago

What are you most proud of, and what would you do differently next time?

Using css variables for the first time

Responsive Product Card Page

2

Arekpok29•50

@Arekpok29

Posted 5 months ago

Looking good!

basSluiter•50

@basSluiter

Submitted 5 months ago

What challenges did you encounter, and how did you overcome them?

the nutrition section with the table

Recipe Page

1

Arekpok29•50

@Arekpok29

Posted 5 months ago

Nice job!

Mohamedibrahim0419•100

@Mohamedibrahim0419

Submitted 5 months ago

What are you most proud of, and what would you do differently next time?

Simple and elegant design: ✨

The code reflects a good understanding of formatting elements using Flexbox and applying colors in an attractive way. 🎨 Using effects such as changing the color and background on hover shows interest in the user experience. 🚀 Organization of the code: 📂

The code is organized and understandable, making it easy to read and edit. 🛠️ Dividing elements such as .card, .profile, and ul li a makes the code easy to customize. 📋 What could be improved next time: 🔧 Add comments: 📝

Code annotations can be added to explain the purpose of each part, making it easier to collaborate with others. 🤝 Improve scalability: 🔄

It might be a good idea to use CSS variables (:root) to define colors and fonts. This will allow for easier design changes in the future. 🎯 Add responsiveness: 📱

Although the code supports flexibility in display using Flexbox, the design can be improved to be more suitable for different screen sizes using media queries. 🌐 Reduce duplication: ➖

Create general CSS rules to avoid duplicating similar styles, such as rules for margin and padding. 🎛️ Improve accessibility: ♿

Add attributes like alt to images and place greater emphasis on contrast between text colors and backgrounds. 🕶️

What challenges did you encounter, and how did you overcome them?

Formatting elements using Flexbox 🔄 Challenge: You may have struggled to make elements within the card, such as text and images, consistent and centered. How I overcame it: I relied on Flexbox effectively, using properties like justify-content and align-items to ensure good centering of elements. Make the code organized and easy to read 📂 Challenge: Organizing code can be a challenge, especially when there are many elements and styles. How I overcame it: I named classes clearly, such as .card and .profile, which made it easier to understand the purpose of each part.

What specific areas of your project would you like help with?

Add interactive features using JavaScript: ⚡

Incorporate interactive elements, such as showing or hiding content on scrolling or clicking.

Improve response to events such as pressing buttons or moving elements

Test the project and ensure it is free of errors: 🧪

Ask for help in testing the project and discovering errors or issues. Improve performance based on feedback.