Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
9
Comments
7

Yejin Han (한예진)

@Yejin-Han270 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • URL Shortening API Master

    #react#vite#styled-components

    Yejin Han (한예진)•270
    Submitted 10 months ago

    Anything you've found. Thank you :)


    1 comment
  • Rest countries api with color theme switcher master

    #axios#react#react-router

    Yejin Han (한예진)•270
    Submitted 10 months ago

    Anything you've found! Thank you :)


    1 comment
  • Mortgage repayment calculator

    #sass/scss#vite#vue#bem

    Yejin Han (한예진)•270
    Submitted 10 months ago

    Freely please!


    1 comment
  • Product list with cart

    #bem#vue#vuex#sass/scss

    Yejin Han (한예진)•270
    Submitted 10 months ago

    Anything you've found strange.


    1 comment
  • Results summary component

    #vue#sass/scss

    Yejin Han (한예진)•270
    Submitted 11 months ago

    Anything you've found to help with! Thanks a lot :)


    1 comment
  • Bookmark landing page


    Yejin Han (한예진)•270
    Submitted 11 months ago

    Anything you have found. How long will it take to finish normally?


    1 comment
View more solutions

Latest comments

  • Amjad Shadid•810
    @amjadsh97
    Submitted over 1 year ago

    REST Countries API with color theme switcher solution

    #react
    2
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 10 months ago

    You did a great job! I felt that the completeness was high because even the effects such as hover, which were not specified in the style guide were all implemented. As a person who is still studying, I can't answer the requirements you wrote above, but I will briefly tell you the problems I've found.

    In a responsive design, elements touch the left and right ends at certain screen widths. It would be better if you could give a little margin around the contents. Also, the detail page doesn't bind the data to the Native name, and the text layout is sometimes broken. Furthermore, I think it would be good to separate the files for the main page and the detail page. And I suggest you to use Router to designate a route.

    Thank you! :)

  • Bakhtiar•380
    @b4khtiar
    Submitted 12 months ago
    What challenges did you encounter, and how did you overcome them?

    Trying to utilize inline form validation without using javascript. There's some problems that needs fix, like: if I use :invalid to mark invalid input, the input shows invalid at initial state, I use :user-invalid to fix that, but the :user-invalid does not initialize when user submit untouched input.

    Accessible mortgage calculator

    #vue#vite
    1
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 10 months ago

    First of all, you did a great job! I learned @component and provide/inject.

    What I've thought a little awkward was that both the error message shown by the input required attribute and set by you separately appear, so it makes uncomfortable to see. I don't know because of that or not, the error messages and the error styling came up a little late. I think it's better to let only one of error messages come out.

    Thank you. Happycoding! :)

  • Vitaliy Saburdo•280
    @VitaliySaburdo
    Submitted 10 months ago
    What challenges did you encounter, and how did you overcome them?

    Most often, the problem arises of setting up a project on a page, as well as adapting images for different screens.

    Semantic HTML5, SASS(mixins), BEM, CSS variables, JS, VITE(Vanila)

    #accessibility#bem#sass/scss#vite
    1
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 10 months ago

    First of all, you really did a great job! :) To close the modal, not only clicking the 'Start New Order' button, but also clicking the outside part of the modal or pressing the ESC key. It was the part where I missed it while working on it so I really liked it. Also, it was interesting to use posthtml plugin, I've seen it for the first time. However, it doesn't seem to be compatible with the size of the tablet screen, so I think you'd better try it. Also, the rendered image looks the same across all screen widths.

    Marked as helpful
  • c4todev•20
    @c4todev
    Submitted over 1 year ago

    Mobile first responsive component (React.js and Tailwind CSS)

    #accessibility#bootstrap#react#sass/scss#vue
    1
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 11 months ago

    Interesting work! I'm almost newbie to React so your code is very fun :) And also well done for trying tailwind css to make gradient!

    But I think you missed hover effect on Continue button. Please add the effect on it!

    Happy coding!

  • tortaruga•790
    @tortaruga
    Submitted 11 months ago
    What are you most proud of, and what would you do differently next time?

    im happy with the final result, next time i'd try to make the js more DRY

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

    i had some issues with the layout and making it look good on medium-sized screens, in the end i think it looks fine enough even though it's very simple and maybe not the prettiest

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

    any feedback as to if i'm doing a good job with accessibility and how to improve

    room homepage with bem and sass

    #sass/scss#bem
    1
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 11 months ago

    First of all, thank you for your hard work. It must have taken you quite a while to re-layout the mid-size screen.

    I'll briefly tell you the problem I've checked. There is an error that the mobile version of the menu is maintained if you open the menu once in the mobile size and resize it to the desktop size. There are parts that are very slightly different in layout or size from the given design, but overall, it seems to have been completed well.

    In addition, it's amazing that you scripted the slide yourself! However, there are many parts that seem to have been scripted even if you don't have to use the script, so I'm worried that if there are more of these codes, there will be performance problems. It would be good to consider creating a class and toggle it.

    Thank you.

    Marked as helpful
  • Mikhail•460
    @mkostrikov
    Submitted 11 months ago

    Loopstudios landing page

    #bem#sass/scss#vite
    1
    Yejin Han (한예진)•270
    @Yejin-Han
    Posted 11 months ago

    Your work is truly amazing! It's amazing that novice like me has used all of the CSS codes by component along with the various SASS grammar they couldn't use, increasing reuse and ease of maintenance. If it's a simple project, I often write code on a single file with ease, so I should emulate you. Also, I've never seen a way to implement a mobile menu without using javascript using an API called popover in HTML, so I think I'll be able to use it if it becomes more compatible in the future. I didn't give you any help, but on the contrary, it was a code that helped me a lot. Thank you

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