2차 프로젝트 로그인/회원가입

LB·2021년 4월 4일
1

로그인/회원가입 페이지 레이아웃을 하면서 각각의 컴포넌트로 나눴다.

처음 login.js 에서 form이라는 컴포넌트에 props로 각각의 signInKaKao,signIn,signUp 데이터를 넘겨준다.

form이란 컴포넌트 안에는 각각의 또 공용으로 쓰는 컴포넌트를 가져와서 쓰고 있다.
button 컴포넌트,input 컴포넌트, formlayout 컴포넌트 idpw 컴포넌트 등등

props.data.image 가 true 이면 이미지 사진이 나오는 로고박스 레이아웃이 나오고 false 이면 이미지가 없는 로고 박스가 나오는 로직이다.

이 부분은 input이라는 컴포넌트를 활용하여 input을 여러개 만드는 로직이다.

현재 button 및 input 컴포넌트들도 활용하여 페이지 구현한 모습이다.

처음에는 저 페이지를 3개로 나눠서 각각 다 작업하고 button 및 input 도 싹 다 만들어 줬었는데 컴포넌트화 해놓으니깐 훨씬 작업이 쉬워진 느낌이다.(이 방법으로 적응하는데 꽤 걸렸다..)

아직 레이아웃이 완성 된건 아니고 적용할게 더 남아서 얼른 마무리 하고 기능구현으로 넘어가야겠다.

profile
아자

1개의 댓글

comment-user-thumbnail
2021년 4월 4일

와 컴포넌트 재사용 굿굿이네요 🤗🤗 우리같이 하드코딩 탈출해요

답글 달기