로그인 화면 디자인 - react , postCSS

오늘 한 내용

로그인 페이지 css 스타일링

node 강의 듣고 환경 설정

리액트 jsx 작성

color common 파일 정리

mongoDB사용

 

오늘 배운 내용

input의 타입을 password로 설정하면 *** 형태로 출력됨

 

캡쳐

 

소감

본격적으로 시작한 프로젝트. 구글링을 통해 로그인 하는 법을 열심히 검색했지만 완성된 코드만 덜렁 올라가있는 경우가 많아 하나도 알아 들을 수 없었다. node로 로그인 부분만 back 구현을 해볼까 했지만 포기하고 말았는데 그때 빛처럼 나타난 인프런 무료 강의! 예전에 팀원분께 추천받았던 강의였다. 프론트만 따라하다가 back 부분 없이 다음 챕터로 넘어갈 수 없어 디자인만 완성해두고 back으로 돌아갔다. 오랜만에 한 css는... 왜 다들 css를 기피하는지 살짝 이해할 수 있었다. 물론 나는 쉬는 용으로 하는거지만, 너무 오랜만에 해서 그런지 내 마음대로 되지 않아 짜증이 났다. 예전 강의의 힘을 빌려 완성은 했는데 너무 덕지덕지 붙인 느낌이라 마음에 들진 않는다. 일단 지금 내가 할 수 있는 최선을 다한 것에 만족하자! 오늘 하루종일 프로젝트를 하는 바람에 늘어진감이 없지 않아 있다. 지금 공부해야할 것이 산더미인데 하나만 하니까 시간 많이 남았다며 빈둥거렸다. 결국 로그인은 끝내지도 못하고... 앞으로 시간 분배를 잘해서 알차게 해나가야겠다. (p.s. 내가 지은 className이 너무 거지같아서 스트레스 받는다...)

 

오류 일지

1. placeholder가 작동하지 않음. 비밀번호 input에도 "비밀번호를 입력해주세요"가 보여야하는데 ***로 출력됨. type과 value를 이용해 바꿨지만 비밀번호 입력 시 일반 텍스트가 보임. (or 글자가 사라지지 않음) 그러다가 다시 한번 placeholder를 사용했는데 갑자기 됨... 뭐하자는거지...?
2. 오류는 아니지만 keycolor 적용 시 글자가 너무 안보여서 키 컬러 임시 수정 중. 나름대로 마음에 들어서 이대로 갈 지 아님 또 다른 색으로 변경할 지 고민 중오늘 한 내용node 강의 듣고 환경 설정color common 파일 정리오늘 배운 내용캡쳐오류 일지
   1. placeholder가 작동하지 않음. 비밀번호 input에도 "비밀번호를 입력해주세요"가 보여야하는데 ***로 출력됨. type과 value를 이용해 바꿨지만 비밀번호 입력 시 일반 텍스트가 보임. (or 글자가 사라지지 않음) 그러다가 다시 한번 placeholder를 사용했는데 갑자기 됨... 뭐하자는거지...?
   2. 오류는 아니지만 keycolor 적용 시 글자가 너무 안보여서 키 컬러 임시 수정 중. 나름대로 마음에 들어서 이대로 갈 지 아님 또 다른 색으로 변경할 지 고민 중