Skip to content
OverviewSolutions
6
Comments
4
snhase
@snhase

All comments

  • Elias M.•420
    @EmazsSubmitted 6 months ago
    What challenges did you encounter, and how did you overcome them?

    The most notable challenges were learning to integrate the TinyURL API to shorten links and ensuring correct functionality across different devices and browsers. To overcome them, I researched and consulted the API documentation extensively, as well as conducted thorough testing in various environments to identify and address potential compatibility issues.

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

    I'd appreciate assistance with optimizing the performance of my landing page, particularly in terms of loading times and responsiveness. Additionally, guidance on improving the user experience and enhancing the visual design would be valuable.

    URL shortening API landing page

    1
    snhase•200
    @snhasePosted 6 months ago

    Hello Elias,

    Great job with the challenge! It is responsive and API integration works very well!

    I just completed this challenge too and have some minor suggestions to improve the UX/visual design even more :

    • the copy button does copy but gives an alert instead of changing the copy button text that to in spanish that not all users understand. Suggesting to change the copy button text to "copied" instead . One way is by using a state variable and using conditional rendering to update the button text.
    • the design has a blue connector going through the features cards, one way to add that is to use z-index, tailwind css has z-index utility, check it out here - https://tailwindcss.com/docs/z-index
    • storing the shorten url list in local storage so the user can have history of the urls shortened

    Hope this helps!

    snhase

    Marked as helpful
    0
  • Rick van Wijk•50
    @RickvWijk1Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    My main goal was to use a structured Way of Working so that any developer would understand the flow of my app. For this reason I'm proud of how I have handled state flow with Pinia.

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

    It took some time before I came up with a solution for filtering that wasn't gonna be overcomplicated. At first I was trying something that was really just overengineering for my use case. From there I simplified my filter system.

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

    I rushed the responsive design part of the filter container. I would like to know how others would ideally handle responsivity for that specific div/container.

    Todo app | Vue 3 + TypeScript + Pinia + API

    1
    snhase•200
    @snhasePosted 7 months ago

    Hello Rick,

    Your solution looks great! Like how you added icon in front on the items to indicate there are draggable.

    I just completed this challenge myself, how I handled the responsive filter was, to make the filter as reusable component and to show/hide component using display visibility attribute when the breakpoint changes. Hope this helps!

    0
  • snhase•200
    @snhasePosted 11 months ago

    Hello Ahmed,

    Great job with the desktop layout!

    I recently completed this challenge and found making the site responsive a bit difficult too.

    Here are some suggestions to make it responsive.

    1. Use CSS media queries. This a very good article to understand basics of media queries - A Complete Guide to Media Queries.
    2. Use a CSS Framework like Bootstrap or Tailwind CSS

    Hope this is helpful! Happy Coding, snhase

    0
  • Gerges Badr•310
    @GergesBadrSubmitted 11 months ago

    Explore the world with my React app! in a user-friendly interface you will discover all needed information, easily.

    REST Countries API

    1
    snhase•200
    @snhasePosted 11 months ago

    Hello Gerges,

    I just finished this same challenge, your solution looks great and responsive!

    I have one suggestion, in your "Filter by region" feature. I noticed the button label doesn't update the region to the region selected onClick, remains "Filter by region" . How about passing the region item value that you get from the mapping over regions list, in the handleSelectedRegion function to set SelectedRegion value instead of the event? like so handleSelectedRegion(region)?

    Hope this helps! Happy Coding :) snhase

    0