Skip to content
OverviewSolutions
18
Comments
24
Nick C.
@niemal

All comments

  • Nick C.•690
    @niemalSubmitted over 1 year ago

    I implemented downshift for the first time and it was a lot of fun. I learned how to implement a very powerful search combobox that is flavored with a cool animation thanks to framer-motion. I had to implement react-window along with it to avoid the tremendous cluttering that so many items can cause, which leverages a powerful performance (react-window is in the search combobox and the mobile version of the home layout only). I could leverage the countries API to decrease the overall bundle size but I just didn't. Perhaps I should and will in the future. All in all, I enjoyed this challenge! Feel free to give any kind of feedback.

    Responsive implementation using downshift, react-window, framer-motion

    1
    Nick C.•690
    @niemalPosted over 1 year ago

    Updated with github-pages client-side routing, react-window working on all devices for all content!

    0
  • Nick C.•690
    @niemalSubmitted over 1 year ago

    I learned how to implement special SVG offset hovers. I honed my button-creativity by implementing a proper radial gradient rotation with a maybe weird way of triggering the transition effect with ::after and ::before pseudo-elements. Furthermore I implemented a flashy icon-spreading animation with framer-motion! Feel free to give any feedback, thank you.

    Responsive solution with shiny button and some animations! 😎

    1
    Nick C.•690
    @niemalPosted over 1 year ago

    Updated with greater main animation depth, fixed animation cluttering.

    0
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    First off congratulations 🎉, I believe you put in some good effort in getting this done. I will be pointing out something on the mobile version:

    The second tab has the footer bar floating in the middle, you might want to take a look at that!

    Wish you fun and joy going forwards!

    0
  • Justin Green•2,770
    @jgreen721Submitted over 1 year ago

    React Comments

    Featuring

    • JS confetti library to celebrate a LIKE 👍 🙌

    • Ability to update a comment 💬

    • Parsing function to detect some tech language terms and generate a link. Use a hash to make sure there's no duplicates.

    -Input Character counter to (try!) to limit your banter!

    Feedback and suggestions welcomed! 🙂

    Comments Challenge completed via React

    2
    Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    This looks pretty solid congratulations! I have a suggestion to make, at least on the mobile version:

    When you click on an upvote button, the button hover-states and remains hovered. You might want to do something about that and remove the hover on mobile or just make it a keyframes animation on mobile.

    Last but not least fixing the accessibility report on this page should also be a fine task to take on.

    Overall solid, love it, keep it up!!!

    Marked as helpful
    1
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    Just want to note that in the mobile version the cross icon does nothing (is supposed to remove the entry).

    Looks decent btw!

    1
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hello!

    The planet animations are just amazing 😍, very nicely done! I do not have access to a desktop right now so I will be commenting on the mobile version.

    I have a suggestion: you can preload some images in the header so as soon as the crew page is visited for the first time, the experience looks as sharp as possible!

    Besides that, this looks really solid, well done. Will get back for the desktop version if I find something that can be improved on there.

    Marked as helpful
    1
  • Praneet Dixit•120
    @PraneetDixitSubmitted over 1 year ago

    This was a fun project. It was the first time I got my hands dirty with angular! Working on color scheme and state management was also fun. I decided to add pagination support with an external library but ended up in making one myself. I am working on adding pwa support and fixing accessibility issues. Currently the design is not mobile responsive. I am working on it. Although the application structure and code is quite dirty, but a quick glance and review of the code will be helpful.

    Countries detail app using angular

    1
    Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    First off, this looks quite decent, congratulations. However I think you forgot to implement the responsiveness for the mobile version, you might want to take up on that one!

    Cheers.

    1
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    I must commend your effort in creating such an engaging and user-friendly experience. I will be doing this review for the mobile version of the website.

    I would like to bring to your attention a few areas that could benefit from further refinement. Firstly, I encountered a "scroll burglar" issue that hindered the smooth navigation of the web page. Addressing this problem would enhance the overall user experience and make browsing more enjoyable.

    Secondly, I noticed that the "filter by region" button was not functioning as intended. Ensuring that this feature works seamlessly would significantly improve the usability.

    Lastly, within each country's dedicated page, I found that the border buttons were not linking to the actual country page so perhaps that's a feature to implement.

    Kind regards and best wishes!

    0
  • Bilal Türkmen•340
    @bilalturkmenSubmitted over 1 year ago

    it was a good challenge for css grid. i think it was better with a little color adjustment 😉

    • Custom components and Responsive navbar created.
    • i tried to get all the data from a single json file.
    • and worked for the good user experience.

    i hope you will like it ✌

    News homepage - with React + Ts

    1
    Nick C.•690
    @niemalPosted over 1 year ago

    Hello there!

    First of all, I want to commend you for the effort you've put into completing this challenge. I can see that you've paid attention to various details, and the overall design is quite impressive.

    While reviewing your project, I noticed a small oversight regarding the focus-ability of <a> elements. It appears that the :focus state styling is not applied to these elements, which could impact the accessibility and user experience for some users, especially those relying on keyboard navigation.

    I hope this helps!

    Marked as helpful
    0
  • Nick C.•690
    @niemalPosted over 1 year ago

    Amazing job man, very nicely done 👍!

    I would like to recommend preloading all the images to improve the experience on the first loads with those beautiful animations. And also I would like to point out there's a small gap on the mobile home page at the bottom, probably need to do something about that!

    Besides that, one of the best implementations in my humble opinion. Keep it up!

    Marked as helpful
    1
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hey there,

    The accessibility report is a good place to start getting feedback from, perhaps you would like to start from there. I have no access to a desktop right now so I will be reviewing the mobile version only.

    The implementation looks lovely overall but there is something that should be noted and fixed: when I click on the small dots below the feedback cards nothing happens. I expect the horizontal scroll view to scroll on a specific card when that happens.

    That's about it for all I can look at right now, wish you fun going forwards!

    Marked as helpful
    0
  • Nick C.•690
    @niemalPosted over 1 year ago

    Hello there,

    I just want to mention that you perhaps forgot to review the mobile menu. Aside from that it looks pretty good to me!

    Regards.

    1