Skip to content
OverviewSolutions
15
Comments
14
P

Kiara

@Kiara523260 points

I'm a self-taught Fullstack Web Developer with a deep curiosity for how things work. I thrive on attention to detail, whether it's crafting pixel-perfect UIs or optimizing backend logic for efficiency.

I’m currently learning...

Tech Stack: Frontend: HTML, CSS, JavaScript, React Backend: Node.js, Express Database: PostgreSQL Tools: Git, VS Code, Figma, GitHub

Latest solutions

View more solutions

Latest comments

  • P
    Kiara•260
    @Kiara523

    It is not responsive and very small compare to the original I couldn't select the tip porcentage with my keyboard, it's not good for accessibility and people with disability. Need a review on the validation, it seems not to have one, I can insert letter and get a NaN as result. It can be improved, put some visual style to let the user know that the field is numeric for example. Check the code before upload your solution you left some console.log the code. Just a feed back I hope it can be usefull...bye

  • P
    Kiara•260
    @Kiara523

    I thought it wasn't working because it's not responding to the input,
    but then i realized that I had to guess the order of entering the input to get it to work. It only calculate the tip when you press the tip btn. It wasn't a nice user experience. It could be changed to calculate the tip as soon as the 3 fields are completed and not only after pressing the button if the three field are filled, it is not intuitive.

    Add some padding to the input so the numbers are a bit more indented then the input right-border line(looks nicer). It would be nice to see which tip porcentage I pressed(change the background color of the btn, keep the state up to date).

    For the input type you could use type="text" and then use inputmode="decimal" and add a validation for no numeric input...just saying...just a feedback... It's nice to have a bit more of info in the absolout total of the bill...🎉well done!! 🥳

    Marked as helpful
  • P
    Kiara•260
    @Kiara523

    Hey I looked at your solution and I've found it too advanced for me, I can definitely learn something from it.... It made me realized that I'm missing a part of javascript, the "this" keyword, not very familiar with that...let know if you have any good resources to share...thanks bye😊

  • razanabbas•150
    @razanabbas
    What are you most proud of, and what would you do differently next time?

    I am proud that i successfully made my code functional

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

    This was my first time working with regex to make an email validator so it took me a while to work it out

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

    Any general advice

    Newsletter signup with success message

    1
    P
    Kiara•260
    @Kiara523

    Hi! I had a look at your code and I it was very well organized easy to read. I liked the semantic and also that the form even if is not visible is still accessible to screen reader.

    Just a small thing to improve the code could have been to show the actual email of the user in the success message page, utilizing the some span elemenr that you used for styling and handle the innerText with javascript.

    I hope it was useful, have a good day!

  • Daniele Ercoli•170
    @DanieleErcoli243
    What are you most proud of, and what would you do differently next time?

    I'm proud because I found all the solutions by myself when I had a problem of layout or so and I'm proud because I've been able to apply something I read on an article. Next time I would like to be faster at finding those solutions.

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

    I had troubles handling the dimensions of the cards in the different breakpoints. I overcame them using the inpsector of the browser and all my knowledge and experience.

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

    I would really like to master Javascript, because on html and css I'm confident.

    Validation form

    2
    P
    Kiara•260
    @Kiara523

    Hey I took a look at your solution and all looks great, semantic HTML, well organized and structured.

    The improvement on the HTML could be to use a <picture> tag which allows you to use the <source> tag to switch in between the two main images. It works a bit as a media query where you can set a break point <source media"(width: 650px)" srcset="...">

    In the message page you could also show the actual email address of the user using a span in the HTML and then display it with javascript.

    I hope this was useful.

    Marked as helpful
  • P
    Jair•760
    @JairRaid
    What challenges did you encounter, and how did you overcome them?

    The challenge for me is to create this little animation for the share links.

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

    If someone has any suggestion to easily animate this "share links" please share the code.

    article preview component

    1
    P
    Kiara•260
    @Kiara523

    Hello there, I'd like to let you know that thanks to one of your comment on somebody else solution I was able to find the error in my code...

    The problem I was having it was for the overflow:hidden that wouldn't allow the popup to be on top.

    At the moment the GitHub server is having problems so I cannot look at you solution

    I'm sorry...

View more comments