Skip to content
OverviewSolutions
6
Comments
7
Christina A. Pascual
@devchris03

All comments

  • P
    Christina A. Pascual•80
    @devchris03Posted 3 months ago

    The links to your project are broken

    0
  • P
    Christina A. Pascual•80
    @devchris03Posted 3 months ago

    Well done, I would like to recommend some topics that will help you for your next challenge:

    • Indicating the width and height of the images in the html will help to avoid a jump when the page loads.
    • In the prices to position one next to the other you can use flex, it automatically positions them as a row.
    0
  • P
    Christina A. Pascual•80
    @devchris03Posted 4 months ago

    I like your project, it is identical to the design.

    0
  • jeevan-v-jijo•60
    @jeevan-v-jijoSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    Grouped Structure

    In the CSS I used separate classes to specify the font style and a different class to specify other styles and used two class names in the class attribute of the tag.

    Tags

    Used a variety of tags to infer special meaning to the tags

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

    I would like insight on the techniques that I used and to know if they were optimal or not.

    If not what are other better options to make it look more professional

    Social-link-profile-solution

    2
    P
    Christina A. Pascual•80
    @devchris03Posted 4 months ago

    You can use media queries to give certain layouts to certain screen sizes. All in all it is very good

    0
  • P
    Christina A. Pascual•80
    @devchris03Posted 4 months ago

    Very good job, it would be good if you could learn about flex, that will help you to align. Also look for the css property “border radius” that property creates the rounded borders, and another property you can learn is “box-shadow” is for the shadows. I hope I helped you.

    Marked as helpful
    0
  • P
    Sai Dinesh Kopparthi•40
    @SaiDineshKopparthiSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud of my determination and resilience in completing this project. When I started, I felt completely lost and unsure of how to proceed. As someone deeply passionate about backend development, transitioning towards becoming a full-stack developer has been challenging, especially in balancing my efforts on frontend development. Despite my initial struggles and thoughts of abandoning the project altogether, I managed to pick myself up and see it through to completion.

    I did take some help by referring to others' code and using ChatGPT to overcome certain hurdles. While these resources were valuable, I aspire to rely less on such assistance in the future, focusing more on independently solving problems. My goal is to further strengthen my skills and build confidence in tackling challenges on my own.

    Next time, I aim to:

    • Dedicate more time to planning and understanding the project requirements upfront.
    • Use external resources more judiciously, reserving them as a last resort.
    • Improve my knowledge and confidence in frontend development to achieve a more balanced skill set.

    This project has been a valuable learning experience, and I’m proud of the progress I’ve made despite the obstacles.

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

    One of the biggest challenges I faced was my limited knowledge of UI development. Specifically, I struggled with properly organizing and placing elements inside a div the way I wanted, which left me feeling completely lost at times.

    To overcome this, I decided to take a step back and seek out more structured resources. Going through tutorials and documentation helped me gain a better understanding of how to structure and style elements effectively. The more I practiced and applied the concepts, the more confident I became in working with the frontend.

    Although it was challenging at first, the process of learning and solving these UI-related problems was incredibly rewarding and has significantly improved my skills in this area.

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

    I would appreciate any guidance on improving the quality of my code. Specifically, I’m looking for suggestions on best practices or more efficient approaches to achieve the same outcomes. If there are any tools, patterns, or techniques that could help me write cleaner, more maintainable code, I would be grateful to learn about them.

    QR-Code-Component using CSS Flexbox

    2
    P
    Christina A. Pascual•80
    @devchris03Posted 4 months ago

    Your solution is very good

    1
  • P
    Christina A. Pascual•80
    @devchris03Posted 4 months ago

    Hello, your solution is well, but I could like to help you about some things:

    1. Do not set a fixed width for the body, doing so will make it no longer responsive. The centering of the card looks good only when the screen complies with the fixed width you set.
    2. To align the card horizontally you can add a maximum width and add a margin-inline: auto. To do it vertically you can also set a maximum height and calculate the width of the screen - the height of the card, divide by 2 the result and assign the margin-block of the new result.
    3. If the above is complicated for you to understand, you can align with a display:flex. It will be easier to do it this way. I recommend that you can observe a little of it, you will see that it will help you a lot.
    4. It is that you add a maximum width that a fixed width to the card. This will help to make it easier for the design to adapt to any screen.

    I know that with practice you will gain more experience. Keep it up and you will succeed.

    0