SA
Skip to main content

Market 6

Gave me chills since the first day of looking at this. I still think this is the GOAT of user field interactions UI

I dissected it with jhaemin (Jang Haemin) and figured it's dynamically adding JS classes with height transition animations. The "error messages" are clipped and hidden underneath. When there is an error, JS adds a class that makes the element higher, thus revealing the message. Paired with bunch of CSS transform animations.

woowa-techcamp-2020/market-6: A monorepo for sign up and sign in of https://ceo.baemin.com implemented with TypeScript on both server side(Node.js) and client side(vanilla). It is packed with all the features required by the guideline including some other optional features as well as beautifully hand-crafted and improved custom UI and UX.

6443AE.gif

Links to This Note