-
회원가입 팝업 완성Project/실시간 채팅 앱 2022. 9. 20. 13:05반응형
회원가입 팝업을 만들었다.
우선 팝업 내에서 상황에 따른 컴포넌트를 랜더할 수 있도록 로그인 컴포넌트와 회원가입 컴포넌트를 나누었다.
로딩방식은 Popup Content 컴포넌트에 state를 하나 부여해서 login버튼을 누르면 login에 대한 화면이 나오고,
회원가입을 누르면 login컴포넌트와 연결된 state가 false로 바뀌면서 동시에 회원가입 컴포넌트가 랜더된다.
여기서 생긴 욕심이 하나 있다.
로그인 팝업은 그냥 생겨도 아무 상관이 없는데 여기서 회원가입 버튼을 누르면 팝업 전체가 작아졌다가
다시 커지면서 회원가입창이 로딩되는 인터렉션을 구현하고 싶다. 회원가입이나 로그인이나 전체 높이가 크게
차이나지 않아서 큰 이펙트로 다가오진 않겠지만 이런 소소한 인터렉션이 내 웹에 재미를 주는 요소가 된다고 생각한다.
transition delay를 잘 이용하면 될 것 같은데 어떻게 써먹을지 고민좀 해봐야겠다.
회원가입 팝업 반응형'Project > 실시간 채팅 앱' 카테고리의 다른 글
서버랑 통신하기 RESTful API 사용 (0) 2022.09.22 Back-end 스키마(Schema) 셋업하기 (0) 2022.09.20 로그인 팝업 완성! (0) 2022.09.12 로그인을 위한 팝업 (0) 2022.09.10 My Chat리스트 완성 & 로그인 기능에 관한 고민 (0) 2022.09.05