Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
61
Comments
21

Levis Kim

@Orekihotarou-kYaounde1,230 points

*

I’m currently learning...

ReactJS

Latest solutions

  • Responsive Url Shortening app

    #react#vue#tailwind-css

    Levis Kim•1,230
    Submitted 4 months ago

    I need help with the getting the url to actually get shortened. I keep getting NETWORK ERROR, AXIOS ERROR, and similar errors in the console. I need your help to resolve these


    0 comments
  • Responsive bento grid


    Levis Kim•1,230
    Submitted 8 months ago

    0 comments
  • Responsive multi-step form

    #accessibility#vite#react

    Levis Kim•1,230
    Submitted 11 months ago

    1 comment
  • Room homepage

    #accessibility#react#vite#tailwind-css

    Levis Kim•1,230
    Submitted 12 months ago

    0 comments
  • Countdown timer app

    #accessibility#react#vite#tailwind-css

    Levis Kim•1,230
    Submitted 12 months ago

    0 comments
  • Responsive Advice generator app

    #accessibility#react#vite#tailwind-css

    Levis Kim•1,230
    Submitted 12 months ago

    0 comments
View more solutions

Latest comments

  • Peter Godspower•710
    @TheBeyonder616
    Submitted 11 months ago
    What are you most proud of, and what would you do differently next time?

    completing the project

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

    well creating the independent function

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

    an advice would do

    a responsive Faq created using interactive JavaScript

    1
    Levis Kim•1,230
    @Orekihotarou-k
    Posted 11 months ago

    Hey @TheBeyonder616. Great job completing the challenge

    Here's a few tips to make your project better Improve Accessibility: Wrap each FAQ question in a <button> element instead of just using <h2>. This will enhance accessibility, making it easier for users to navigate with a keyboard.

    Simplify Image Handling: Instead of switching between two image sources using JavaScript, you can manage the display of the plus and minus icons with CSS classes. This will simplify your code and make it more maintainable.

    Avoid Repetitive Code: Consider combining the updateImageSrc and toggleFAQ logic into a single function. This will reduce code repetition and make your script more efficient.

    Use Event Delegation: Rather than attaching an event listener to each individual FAQ, add a single event listener to a parent element. This way, it can handle clicks on all FAQs, simplifying your code.

    Enhance Readability: Rename your variables for better clarity. For example, instead of faqAnswers, use answers. Clearer variable names make your code easier to understand and maintain.

    Marked as helpful
  • matt2282•310
    @matt2282
    Submitted 11 months ago
    What specific areas of your project would you like help with?

    When I have two different html pages how do I handle JavaScript files? I use main.js for index.html and using html script elements for the other html pages.

    Interactive rating component

    2
    Levis Kim•1,230
    @Orekihotarou-k
    Posted 11 months ago

    Hey @matt2282, great job on completing the challenge! 🎉 There are a couple of things that could make your solution even better:

    1. HTML Structure: It might be simpler to have all the HTML in one file. This way, everything is in one place, making it easier to manage and update.

    2. Modal Display: For the thank you modal, you can set its styles to display: none by default, and then use JavaScript to change it to display: block when it's time to show it. At the same time, you could hide the rating container with display: none when the thank you modal is displayed. This would make the transition smoother and more intuitive.

    3. Deployment: I recommend deploying your project using Vercel or Netlify. GitHub Pages can sometimes be unstable, and right now, I'm unable to view your solution because of it.

    What do you think? 😊

  • matt2282•310
    @matt2282
    Submitted 11 months ago
    What specific areas of your project would you like help with?

    When I have two different html pages how do I handle JavaScript files? I use main.js for index.html and using html script elements for the other html pages.

    Interactive rating component

    2
    Levis Kim•1,230
    @Orekihotarou-k
    Posted 11 months ago

    Hey @matt2282, great job on completing the challenge! 🎉 There are a couple of things that could make your solution even better:

    1. HTML Structure: It might be simpler to have all the HTML in one file. This way, everything is in one place, making it easier to manage and update.

    2. Modal Display: For the thank you modal, you can set its styles to display: none by default, and then use JavaScript to change it to display: block when it's time to show it. At the same time, you could hide the rating container with display: none when the thank you modal is displayed. This would make the transition smoother and more intuitive.

    3. Deployment: I recommend deploying your project using Vercel or Netlify. GitHub Pages can sometimes be unstable, and right now, I'm unable to view your solution because of it.

    What do you think? 😊

  • Ajztyles•10
    @Ajztyles
    Submitted 12 months ago

    The Recipe Page. For this page I made use of VS Code Editor although.

    1
    Levis Kim•1,230
    @Orekihotarou-k
    Posted 12 months ago

    Hey @Ajztyles,

    Congratulations on completing the challenge! 🎉

    I noticed that the hero image isn't displaying. After checking your code, it looks like you didn't upload the assets folder that contains the image. This could be the reason why the hero image is missing.

    If you're having trouble uploading folders, you can use either GitHub desktop, or VSCode's source control to create a repository and upload it to GitHub. This way, you can ensure that all your project files, including the assets folder, are correctly uploaded.

    Here are some video tutorials that might be helpful:

    1. Recipe page solution
    2. Creating a repo with github desktop . watch this from 2:48

    Feel free to ask any questions if you need further assistance. Good luck on your coding journey!

    Best regards,

    Marked as helpful
  • @Gogul•220
    @Gogul11
    Submitted over 1 year ago
    What challenges did you encounter, and how did you overcome them?

    This challenge is hard to complete since it involves in Java Script and positioning the elements is hard.

    Tips Calculator

    1
    Levis Kim•1,230
    @Orekihotarou-k
    Posted about 1 year ago

    Congratulations @Gogul11 on completing the challenge. You did well with your solution.

    Here's a few things you can do to make it even better

    • Center the main div vertically and horizontally. You can do so by adding these styles to the body which is the parent of the main.
    display: grid;
    align-items: center;
    min-height: 100dvh;
    
    • Use classes instead of ID's for most elements. CSS classes offer a way to efficiently manage styles and create a more modular and organized CSS code. A class can be used by many elements. Whereas an ID must be unique on a page, like a name tag.

    • For the text above the inputs, use <label></label>. This helps with accessibility. Screen readers need will announce the text inside of the label letting the user know the input content.

    Congrats again on completing the challenge. Happy coding ✨

    Marked as helpful
  • Ethan Neece•250
    @Ethanneece
    Submitted over 1 year ago

    Time Dash Board

    1
    Levis Kim•1,230
    @Orekihotarou-k
    Posted about 1 year ago

    Congratulations @Ethanneece on completing the challenge. You're solution looks good. A few adjustments would make it even better.

    I have only one suggestion. Properly center the main. You can do so by wrapping it with another div, and then declaring

    display: grid;
    place-items: center;
    min-height: 100dvh;
    

    and it should be fixed. hope this helps.

    Happy coding✨

View more comments
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub