Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • blackie11 100

    @blackie11

    Submitted

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

    I am proud to finally find some consistency, while I love developing and resolving bugs in my code I struggle with consistency. this project helps me with focus and commitment to finish it. If there is anything different I would have done it maybe to add proper documentation to my code.

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

    some of the problems I encountered were responsive, especially using a grid with a laptop-first design strategy.

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

    I would love this community to help me with javascript, so far that is where I see my struggles.

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Hi @blackie11 you've done a great job here
    • I learned my JS fundamentals through freecodecamp, from basic to advance
    • Hope this helps!
    • Happy coding!

    Marked as helpful

    1
  • P
    dcubic 330

    @dcubic

    Submitted

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

    Not really proud, but I learned how to use VSC

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

    VSC git command line was a pain. Didn't realize I had to manually save files; I've been spoiled

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

    Don't know much about conventions

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Hi @dcubic nice work here
    • If you want to understand more about best practices and all, this is a good read: BEM Methodology
    • Hope this helps!
    • Happy coding :D
    0
  • P
    jrgenweb 450

    @jrgenweb

    Submitted

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

    I managed to do it without Googling. I would do more testing and try to write even better code.

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

    It was difficult to limit the font sizes and the maximum size of the desktop. I started from the font size of the mobile view.

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

    It was difficult to limit the font sizes and the maximum size of the desktop.

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Hey @jrgenweb nice work!
    • If you want to get proper size of elements/components from the given design images, try using figma or photoshop then use line tool to measure padding, margin and such
    • It works for me. Hope this helps!
    • Happy coding!

    Marked as helpful

    0
  • Rayza-18 60

    @Rayza-18

    Submitted

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

    construir e bem mudaria algumas coisas

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

    colorir as lista

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

    .

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Nice Work here
    • Try to incorporate the right color blocking next time. It makes a better readability and it also makes sense that some elements are different from the others.
    • Hope this helps!
    • Happy Coding
    0
  • @cristianccgg

    Submitted

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

    I made this one in just 40 minutes so I think I am learning and improving and that makes me proud.

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

    There's always this issue that the images are not shown when deployed on GitHub pages and I have to change the extension file, the name, and the path to finally make it work.

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Nice work!
    • Importing images on github is a pain in the a** sometimes. Make sure to add "." before the asset links like "./images/image.jpg"
    • Hope this helps
    • Happy coding!
    0
  • Gopihacks 30

    @Gopihacks

    Submitted

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

    I will try new web development tools and frameworks to complete the projects from frontend mentor.io.

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

    I have some issues in css ans i have cleared it through myself with the help of google.

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Nice work
    • Currently not center though, make sure to add min-height of 100vh to the body element to adjust the height to window size
    0
  • @khalifa-ltaief

    Submitted

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

    i used flex for the first time

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

    i didn't know how flex work exactly but i started to know it

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

    nothing

    Myk Escala 600

    @Mikoyzskie

    Posted

    • Nice work!
    • Try using figma next time to analyze the design. It helps me try to process all the elements one by one
    • Maybe use libraries or frameworks to familiarize with modern techs out there
    • Hope this helps
    1
  • Myk Escala 600

    @Mikoyzskie

    Posted

    Hey phonkytoast,

    • Saw your solution, code looks clean and organized. Well done!
    • You can try implement this very old school methodology but this relevant up to this date.
    • https://getbem.com/introduction/
    • Hope this helps

    Happy Coding!

    1
  • P
    Charles 110

    @chleighton1

    Submitted

    Built this with Nextjs. May be a bit overkill for how simple the application is but I wanted to get some practice with Nextjs.

    Not sure the best way to do responsive design. I used state to determine the width of the screen and conditionally render based off of that. I might try making use of the tailwind breakpoint pre-fixes but I am worried it will get messy and not very readable. Also interested in trying Mobile first as I usually do desktop first.

    Myk Escala 600

    @Mikoyzskie

    Posted

    Hey chleighton1!

    • Clean code! Impressive.
    • If you're trying to implement mobile responsive site, there's no need of using states for that.
    • Tailwind actually has its own viewport width device width classnames for that
    • For example, if you want your component to be row on desktop and column on smaller screens, you can use "flex-col md:flex-row" since tailwind is a mobile first css framework
    • Also sm: / md: / lg: / xl: are min-width not max-width
    • Hope this helps

    Happy Coding!

    Marked as helpful

    0
  • John 410

    @MiyaoCat

    Submitted

    I had a lot of trouble with the spacing of the <li>'s. If someone wouldn't mind looking at how I styled them and provide feedback, that would be great! I styled the <ul> and <ol> differently. I use meyer-reset to start of with zero styling.

    As usual, please let me know how I can make it more accessible as well. I don't know anything about aria standards so any input there is helpful.

    Myk Escala 600

    @Mikoyzskie

    Posted

    Hi John!

    • if you are trying to make spaces between them, try using display: flex, flex-direction: column, then add gaps between them
    • for spaces between texts and bullets which is very tricky, try to use other css pseudo classes like ::after or in this this case ::marker so you will have a more freedom on styling them
    • hope this helps, man

    Happy Coding!

    Marked as helpful

    0
  • Myk Escala 600

    @Mikoyzskie

    Posted

    Hey Karan!

    • First of, clean code. Very organized.
    • In Tailwindcss, we use the classnames sm,md,lg, and xl for viewport widths or device widths
    • For example, if you want your flex-direction to be row on larger screens and column on smaller screens, you use "flex-col md:flex-row"
    • Since sm: / md: / lg: and so on is min-width not max-width
    • Hope this helps

    https://tailwindcss.com/docs/responsive-design#working-mobile-first

    Marked as helpful

    1
  • tintin 10

    @tintinsn

    Submitted

    • responsive it difficult for me when i shrink scrollbar appear.
    • in body element i use position absolute in order to qr code component to center because when it use body height 100vh and flexbox when shrink it have scrollbar

    body { margin: 0; padding: 0; box-sizing: border-box;

        background-color: hsl(212, 45%, 89%);
        font-family: "Outfit", sans-serif;
        font-size: 15px;
        border: 1px solid red;
    
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .qrcode-container {
        background-color: #fff;
        width: 300px;
        padding: 16px 16px 32px;
        border-radius: 11px;
        box-shadow: 0 15px 20px rgba(0, 0, 0, 0.09);
      }
    
    Myk Escala 600

    @Mikoyzskie

    Posted

    • Looks good on mobile. Try using Chrome DevTools Mobile view by pressing Ctrl + Shift + M.
    • Also, no need for position absolute. If you want to center elements inside the body just set the body to min-height: 100vh then display flex, align-items: center, justify-content: center
    • hope this helps!
    • happy coding!
    0