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

  • @DylanGangat

    Submitted

    This is my 2nd challenge I've completed and I really wanted to test myself with a intermediate challange and I'm proud with what I came up with. I have to give credit where credit is do and Coder Coder help me with getting a idea on how to make the hero section responsive in this Coder Coder

    If anyone has any advice on how I could improve the design or make it cleaner I would really appreciate it.

    @ameyadeokule

    Posted

    The webpage looks perfect and like the way you have used animations on your mobile menu activation. The only pointer I can give you is that the webpage scrolls horizontally due to the large hero image, if you could change overflow to none it would be much better. Overall a very GOOD JOB indeed!!

    0
  • @ameyadeokule

    Posted

    The overall webpage looks goods on all screen sizes. Good Job!! I would like to point out that the font hasn't loaded so you can fix that, The sizes of the font don't match the design and its sizes are not consistent, for example, the paragraphs and footer links should be of the same size but they are not. The buttons both say the same thing instead of "learn more". The Logo should be bolder than what you have used and the method you have used to open the menu in the mobile view is not a good one. I see this is your first full-page challenge so you not be discouraged by changes suggested to your code but see this as an opportunity to grow as a dev. You can read about typography [here] (https://madebyshape.co.uk/web-design-blog/heres-why-typography-is-so-important-for-your-website) and your mobile menu can be fixed with the method mentioned [here] (https://css-tricks.com/responsive-menu-concepts)

    0
  • Sara 180

    @saravdberg

    Submitted

    Hey everyone, I'm pretty new to coding, so any feedback is welcome and appreciated!

    @ameyadeokule

    Posted

    The mobile view is perfectly done, no complaints there, The only problem I noticed apart from the one mentioned above is the form is positioned relative for reasons I couldn't understand, if possible explain it to me by replying to this comment. I also appreciate the fact that you have used visibility as a toggle value to show errors and nice job on the scroll bar, it is a nice touch. One minor design issue is that your box is a little smaller in dimensions to design so that would come with practice. GOOD JOB and KEEP IT UP!!!

    0
  • Rayane 1,935

    @RayaneBengaoui

    Submitted

    Hello everyone ! 🙂

    I'm so proud to complete my first Guru challenge ! 🎉 6 months ago I could hardly finish a Newbie project but thanks to FME and his amazing community here I am !

    It was pretty challenging and once again I find myself not being very DRY friendly, but it's getting better. I plan to finish the form validation later as I want to focus on other stuff.

    Also, I found out that the website renders well on Chrome/Edge but is totally broken in Firefox. For example display: grid isn't working properly, so I'm wondering what is the problem ? I'll try to fix it, but now I get why browser compatibility is a pain haha.

    Lastly, do you know a good way to preload images ? On loading some images take time to load and thus worsen the user experience.

    Otherwise, any feedback/remark is appreciated !

    Have a nice day ☀️

    @ameyadeokule

    Posted

    Good Work!! The website looks amazing, great to see your progress. I really loved the hover effects on project images and the scroll effect on the phone was also a nice touch. The only feedback I may provide is that the standard react favicon could be changed to the custom website icon. For preloading the images and other data you can use any lazy loading npm library but if you need it only for images I would prefer react-preload-image, as I have used it the most for lazy loading and animating images. You can read about it here -> https://www.npmjs.com/package/react-preload-image

    1
  • @ameyadeokule

    Posted

    This is a very well-made, awesome project! The best part about the project is the light them to dark theme conversion, it is easy on the eyes and pretty smooth. You took out the time to have an empty list component so the list would never remain empty, that's a good touch. Nice use of the react-dnd library. My only feedback is that when you complete a task in the ALL tab you get a strike-through animation but doing the same in the ACTIVE tab removes the item very abruptly. Overall a GREAT project! Keep up the good work.

    1
  • YannikS14 110

    @YannikS14

    Submitted

    I'm pretty happy with my solution, although I've got the feeling the media queries could be simplified. Any feedback is welcome :)

    P.S.: My initrial try was using CSS grid for the main layout, but I wasn't able to get the header background image use the full width (larger than the grid childs width). Does anyone have an idea how this could be done?

    @ameyadeokule

    Posted

    The website looks awesome and has a very well-written codebase. My only pointer would be to increase the font height for headers only as they are a bit smaller than the ones in the design. Keep up the GOOD WORK!!

    Now to answer your question you can create a wrapper class and make it the grid container and use the original header to add the background property. You can read more about it here -> https://stackoverflow.com/questions/21127424/extending-background-color-of-div-in-grid-system

    0
  • @ameyadeokule

    Posted

    This is a good project! Keep up the hustle. I would like to point out that the custom font has not been used but it can be fixed by adding it to the index file or importing it into one of the CSS files. The CTA button which is should be on the single line and can be fixed by using nbsp. Overall great work but can be worked upon!!

    0
  • trudihub 140

    @trudihub

    Submitted

    This is a working demo of a full stack invoice app with all the required CRUD functionalities present. I used MERN to build this full stack application, but I didn't implement any private routes or user settings so please refrain from inserting any personal or sensitive data as everyone has access to one shared database. Any feedback is highly appreciated !

    @ameyadeokule

    Posted

    Your App looks awesome!! Good Work sir! I absolutely love the light and dark theme you have implemented and how you switch between them. There are two things I would like you to look at

    1. In the new invoice form top parts of some text fields are getting flattened due to line-height.
    2. Please add some spacing between the due date and the price. And as an improvement, you can add a Modal or confirmation message that the new invoice has been added or when something is to be deleted. Overall A Very Solid Project!! Keep up the work.
    1
  • @ameyadeokule

    Posted

    The grid came out very well. I like that you have considered all screen sizes only feedback would be to reduce the height of the cards so that it would be pixel perfect with the design since the width is actually pixel perfect. No other pointer you have hit this one out of the park.

    0
  • @ameyadeokule

    Posted

    This design looks very impressive, keep up the good work!! I can see that you have considered using multiple breakpoints to enhance the design but I saw that the cards overlapped in 1024px width which is a standard screen size so some work is needed. Apart from that, I would love to see the spacing between the images and the words reduces since it would resemble the design more closely. GOOD JOB!!

    0
  • @ameyadeokule

    Posted

    I appreciate the fact that you have put in a lot of effort and the webpage looks good. You did a very good job. The only feedback I may provide is in 4k screens your elements are not centered properly. To recreate the view go to inspect option in chrome and select the max size on the grey bar provided over your webpage.

    0
  • @ameyadeokule

    Posted

    The component looks good but is not as per design, try to keep the entire component inside the screen's dimensions. Add margins to the mobile view and try to keep it centered.

    0
  • @mohammed-kh10

    Submitted

    I am waiting for you feedback, good luck 🙋‍♂️🙋‍♂️.....

    @ameyadeokule

    Posted

    The font styling is not as per design. There is a gradient background that is absent. The hover over the button is not proper. There should be more spacing and padding throughout the webpage. In mobile view, the background does not cover the entire page. The email validation is also missing. Hope you work on the feedback!!

    0
  • Alizzie 140

    @Alizzie

    Submitted

    Hi. It is my first time using grid and I learned a lot. I worked on it for five days in a row. Sometimes 2-4 hours, sometimes all day. I can't judge whether the duration is good or not, so I wanted to ask how long you usually are working for a challenge/ project.

    Furthermore, do you know any good tools where you can measure the pixels of an image? I am currently guessing the width of the elements.

    I will also be happy about some feedbacks. Thanks :D

    @ameyadeokule

    Posted

    Your work is really solid!! The only difference I could spot between the design and execution is that your header is a bit larger than the design other than that it is flawless IMO. Adobe Photoshop and GIMP provide a measuring tool that you can use, if you are using an Apple product their in-built photo viewer has this tool as well.

    0
  • Albertoflj 170

    @Albertoflj

    Submitted

    Hi! Do you have any tips for the JS side of the project? I mean, it's working but I'm sure it could be done better. I'm not very familiar with JS, I used to code a bit in python and C++, but I'd love some tips to improve.

    @ameyadeokule

    Posted

    This JS works very well. If you want to learn more use the Resources section on the Topbar you'll find loads of good resources there. You can practice JS by completing intermediate-level challenges, those really give you a chance to improve on your JS skills.

    0
  • Nofar Aviv 120

    @nofaraviv

    Submitted

    I'm a newbie in frontend development so it is only the desktop view. I still need to lead how to make responsive pages. Any comments or suggestions that help me improve are greatly appreciated.

    @ameyadeokule

    Posted

    For a newbie, this is a very good project!! One feedback is you could have used a min-width of 800px or somewhere in that range since your lettering seems very condensed. It would add some much-needed volume and spacing which your design needs.

    0
  • @ameyadeokule

    Posted

    The timer looks excellent. You can add margin/padding to the top and also increase the size of the heading font so it would look more like the design.

    0
  • @ameyadeokule

    Posted

    You can remove your name from below since it is overlapping the author name in your design in mobile view. If possible make the arrow markers static near the picture in the mobile view. The animation was a nice touch and was refreshing to see. Keep up the good work!!

    1