오늘 해온 것
입력값을 객체로 모아서 보내기
개인 정보를 입력받는 부분에서 한 가지 고민이 생겼다.
하나의 페이지 안에서 사용자 입력을 나눠서 받고 한번에 데이터를 모아서 챗지피티에게 물어보려고 하는데, 이 경우에는 localStroge에 저장하는 방법만 가능할까?
계속 고민만 하기엔 시간이 소중하니까 바로 강사님께 여쭤 봤더니, 전역변수로 객체하나 만들고 거기에 key:value형식으로 저장하는 방식을 활용하면 간단하게 구현할 수 있다고하셨다.
나눠서 입력을 받고있으니 각 step마다 각 데이터를 객체에 저장하면 된다는 말씀을 듣고 나서 해봤더니 고민 해결! 속 시원!!
커스텀
select 화살표
- 기본 스타일 없애주기
/* IE */
select::-ms-expand {
display: none;
}
.select {
-o-appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}- 화살표 이미지 넣어주기
background: url('../resources/img/expand_more.svg') calc(100% - 5px) center no-repeat;출처 : 티스토리 - select 태그 커스텀 하기, 혹은 직접 만들기 (feat. javascript)
라디오 버튼 커스텀
- input+label에 div로 테두리를 만들어줬다.
input[type=radio] {display: none;}으로 동그라미 표시된 부분을 없애줬다.- label을 div안에 꽉 채워 넣었다.
주의 ) label의 for와 input의 id가 연결되어야한다.
출처 : 벨로그 - 라디오버튼 커스텀
오늘의 회고
잘한점
내 인생에서 커밋을 가장 많이 했다. 내 깃허브에 진한 초록색 점이 찍혀있다니 흔치 않은 일이다. 그만큼 오늘 하루 열심히 css 작업을 했다는 거겠지?!😊
아쉬운 점
챗지피티 응답 결과 화면을 어떻게 보여줘야할지 생각을 하지 못했다.
그 부분이 구상이 되어야 얼릉 마무리 할 수 있을텐데 고민이다.
그리고 코드를 칠 수록 점점 난잡해지는 느낌을 받았다. 코드가 깔끔하지 못한것이 아쉬운 마음이 들지만, 저번에 강사님이 '코드를 깔끔하게 하는 것보단 구현이 먼저다'라고 하신 말씀을 되새기면서 빠른 구현을 목표로 하고 있다. 스터디원분들도 나와 같은 고민을 하는 것을 보면서 나만 갖고있는 고민이 아니라는 것을 확인했고, 걱정을 나눌 수 있어서 약간의 위로를 받았다.
보완할 점
- 프로젝트 기간 마감일 잘 확인하기
- 내일 안으로 완성해서 배포가 잘 되는지 확인해보기
