728x90
반응형
SMALL
마지막 주차에는 구내식당 ui 화면을 구현하였습니다. 또한, 이제까지 구현하였던 코드들을 정리하여 합치는 시간을 가졌습니다.
아래에는 구현한 구내식당 ui 화면 및 이제까지 구현한 파트와 시연 동영상입니다.
bandicam 2024-09-13 17-45-46-474.mp4
2.42MB
KakaoTalk_20240918_211411347.mp4
0.17MB
오피스너 프로젝트 제안서_청년배포용.pdf
4.32MB
- 수정된 로그인 ui 화면 구현 tailwindcss로 구현 완료
- 로그인을 할 때, 이메일 주소에 @가 들어가지 않으면 경고 메시지를 보여주면서 로그인 주의사항을 표시
- 비밀번호를 입력할 때, 비밀번호가 6자리 이상이 되지 않으면 경고 표시를 보여주면서 비밀번호는 6자리 이상으로 작성하도록 알림 설정 기능 추가
- 로그인 버튼을 사용자가 클릭하면 아래의 빨간 글씨로 이메일 주소와 비밀번호가 나타나게 되면서 사용자의 로그인 정보를 표시하도록 설정
- 회원 가입 및 아이디 / 비밀번호 찾기를 마우스로 올렸을 때, hover 효과를 주고 회원 가입을 사용자가 클릭시 alert 기능으로 “현재는 앱에서만 지원하는 기능입니다.”라고 표시
- 밑 소셜 계정으로 간편 로그인 화면 밑에 소셜 계정을 나타내는 동그란 회색 원을 4개에서 각각의 원을 마우스를 올릴 시에 hover 효과로 테두리를 회색으로 변화하도록 설정
728x90
반응형
LIST
'프로젝트(Project) > [React2기] 모바일 앱을 웹사이트화 프로젝트' 카테고리의 다른 글
리액트 프로젝트 3주차 학습회고 (1) | 2024.09.21 |
---|---|
리액트 프로젝트 2주차 학습회고 (1) | 2024.09.14 |