All solutions

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

I am proud that I finally finished this challenge. Next time, I will do more research and dig deeper into learning the structure of the DOM, validation, and submission. Honestly, this is where I got stuck. But with the help of YouTube and ChatGPT, I made it. Thank you, Google, YouTube, and ChatGPT.

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

First, I encountered challenges in the layout and figuring out how to structure my HTML and CSS to implement the DOM. So, I researched it, read some other developers' code, and tried applying it to my own code, eventually finding my own way. I am happy that I overcame it all, including mobile responsiveness, which I managed with the help of reading documentation and implementing it in my CSS code.

The hardest part was the JS fundamentals of form validation. I researched it to understand how it works, including the functionality of addEventListener, using if statements for error messages, displaying elements using the DOM, toggling state to hide the form, and the regex for invalid email validation. This was really challenging, but I had fun and didn't give up. I must learn more and apply this knowledge to other challenging projects.

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

So far none. #HappyCodingEveryone

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

I am proud of my ability to combine HTML, CSS Grid, Flexbox, and transformations (translate along the X and Y axes and scale) to make the share button hide the element, along with using DOM JavaScript. I accomplished this by researching and reading other developers' code to complete an article preview component. I structured it responsively and added basic JavaScript functionalities using addEventListener.

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

I encountered some difficulties with the button, specifically with how to make it hide, transform, and translate on hover and when clicked by the user. I researched this issue and resolved it by studying other developers' code. Additionally, I had some challenges with the grid-template-columns property for the container size. To fix this, I decided to use grid-template-columns: 285px minmax(300px, 445px);. This means the first column will always be 285 pixels wide, while the second column will have a flexible width that adjusts between 300 pixels and 445 pixels, depending on the available space in the container. This solution works perfectly.

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

So far, none. Kindly give me some feedback to improve my coding skills. Thank you! #HappyCodingEveryone

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

I am proud that I can do mobile-first responsive but, need to study more for accuracy.

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

I face challenges with the measurement of font sizes and margins and responsiveness. I think Figma design is very important when doing this project to make your work professional and good practice for the industry when collaborating with the UI/UX team.

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

Need more feedback to improve my coding skills. Thank you. I appreciated all your feedbacks :)

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

I'm proud of the flex layout and its layer effect.

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

The exact measurement soon. I will subscribe to the pro.

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

Feedback more, please. I will continue the eye layer. Happy coding everyone :)

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

Grid layout :)

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

exact measurement but so far all goods.

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

So far none :) #happycodingeveryone

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

I am proud of with the animation of it and changing images based on the screen size

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

I encounter challenges when it comes to responsiveness that's number one, next is animation so I googled it and searched on youtube.

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

Please provide some feed back to improve this design thank you! :)

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

Grid and responsiveness of the design. I need to keep on practicing and practicing to make this precise. Because some of the industry they need an accuracy and perfect pixel.

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

I want to make the design as precise as possible. However, I have an issue with a group of images. I want to separate them and use a grid layout for each one on both the right and left sides.

Please provide feedback and help me simplify this. Thank you.

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

I'm proud of the power of Grid Layout, especially the grid template areas with mobile-first responsiveness.

#MoreFeedbackPlease :)

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

I face challenges without a Figma design layout, so I read other codes and apply them to my work. This helps me improve my coding skills and maintain DRY standards. I've noticed a big difference when we don't use Figma for design guidelines, such as padding and font sizes. I'm a slight perfectionist with pixel-perfect design to meet industry standards. Despite this, I enjoy using Grid Layout."

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

So far none.