@AVARUSJOSE
@wotanut
Submitted
What are you most proud of, and what would you do differently next time?
Most proud of the fact that I completed this challenge in under an hour, although I was aiming for 30 minutes. My emmet usage and skills has improved significantly which pleases me and i'm nearly there on remembering how to use favicons
What specific areas of your project would you like help with?
Writing the box shadows and how I can use pseudo elements like ::before for the box shadows
@AVARUSJOSE
Posted
good
@antoniomontoia
Submitted
What are you most proud of, and what would you do differently next time?
As I reflect on this project, I'm most proud of successfully implementing a number of significant changes to my workflow while still delivering a quality outcome. By incorporating new tools and techniques, such as SASS, BEM, CSS Grid, and a mobile-first approach, I was able to streamline my process and improve the overall quality of my code.
What I'm most proud of is that I was able to navigate these changes without getting overwhelmed or losing sight of the project's goals. It's not always easy to adapt to new workflows and techniques, but I was able to stay focused and ensure that the project remained on track.
If I were to do things differently next time, I might take a more incremental approach to implementing new tools and techniques. While I was able to successfully integrate a number of new elements into my workflow, it was a bit of a challenge to manage them all at once. In the future, I might focus on introducing one or two new techniques at a time, allowing myself to become more comfortable with each one before adding more to the mix.
Overall, however, I'm pleased with how the project turned out and feel that the changes I made to my workflow will have a lasting impact on my development process.
What challenges did you encounter, and how did you overcome them?
As with any project, I encountered several challenges that required creative problem-solving and perseverance. Here are some of the key challenges I faced and how I overcame them:
Integrating multiple new techniques: One of the biggest challenges was incorporating multiple new techniques, such as SASS, BEM, CSS Grid, and a mobile-first approach, into my workflow.
Creating a responsive card layout: Another challenge was making the card layout responsive, particularly when it came to shifting the alignment of the card's content as the screen width changed. I initially struggled to achieve a smooth transition between the mobile and desktop layouts, but I eventually realized that I could use CSS Grid to create two similar columns in the desktop version.
Grid layout nuances: While CSS Grid was a game-changer for creating responsive layouts, I encountered some nuances that required careful attention. For example, I had to ensure that the grid items were properly aligned and spaced, and that the grid container was correctly sized.
What specific areas of your project would you like help with?
For this project, I would appreciate feedback and guidance on two specific areas: code readability and maintainability, as well as responsive design for the card component. I'm looking for suggestions on how to improve the organization and structure of my code to make it easier to understand and work with. Additionally, I'm interested in exploring alternative approaches to making the card responsive.
@AVARUSJOSE
Posted
good work!
@jadefurtado
Submitted
@AVARUSJOSE
Posted
excellent work There were only a few things missing, as far as I can tell... like the color of the characters and other spacing things, but excellent.
@Stephen-Salano
Submitted
@AVARUSJOSE
Posted
Good job!
@Wambugu-Francis
Submitted
What are you most proud of, and what would you do differently next time?
The fact that i did create this responsive site all by my own is an achievement seeing that I'm improving my skills through these challenges by learning from them. I would try and take as little time as possible to complete the next task unlike this one which i took more time than i had expected.
What challenges did you encounter, and how did you overcome them?
mostly its was on the styling part but i watched some tutorials and also got some help from the discord community and worked my way up.
What specific areas of your project would you like help with?
How can i easily style a container inside another container without interference from each other
@AVARUSJOSE
Posted
good!
@BManrriqueCastro
Submitted
What are you most proud of, and what would you do differently next time?
I am particularly proud of my ability to create a visually appealing and responsive design using HTML and CSS. Using Flexbox to center elements both vertically and horizontally was a significant achievement for me as it improved the overall user experience. Additionally, I successfully implemented a mobile-first approach, allowing me to ensure the card looked good on devices of all sizes. The project also helped me hone my skills in typography and design.
If I were to tackle a similar project again, I would explore using CSS Grid in addition to Flexbox to better understand the layout options and capabilities. I would also consider adding interactivity using JavaScript, such as hover animations on the card or a function that dynamically changes the content displayed on the card. Finally,
What challenges did you encounter, and how did you overcome them?
Challenges faced:
Adaptive design : One of the biggest challenges was to ensure that the QR code card looked good on different screen sizes. Balancing the design between mobile and desktop layouts required careful consideration of padding, margins and font sizes.
Consistency in style: maintaining a consistent design language across the different elements of the card was also a challenge. I had to pay attention to colour schemes, font choices and spacing to make sure everything was consistent.
Understanding Flexbox: While I had some experience with Flexbox, using it effectively to centre elements both vertically and horizontally took practice. I had moments of frustration when elements didn't line up as I expected.
How I overcame them:
Adaptive design : To meet the adaptive design challenge, I used media queries to adjust the card layout based on screen size. I tested the design on various devices and emulators to make sure it was easy to use on all platforms.
Style consistency: I created a style guide for the design elements of the card, including colour codes, font sizes and spacing guidelines. This helped me maintain consistency throughout the project and made it easy to make adjustments as needed.
Understanding Flexbox: To improve my knowledge of Flexbox, I consulted online tutorials and documentation. I practised creating small test layouts before applying the concepts to the card component, which helped me gain confidence and understanding.
@AVARUSJOSE
Posted
good!
