Life/TIL (239) 썸네일형 리스트형 20201209 T.I.L - 오전에 프로젝트의 스타일을 적용하다가 드디어 도메인을 구매했다. 드디어! 근데 도메인을 적용하는 부분에서 많이 헤매다가 점심 전까지 시도해보고 오후에는 스터디를 위해 '함수형 자바스크립트' 책을 다시 읽기 시작했다. 이번에는 차근차근 코드를 적어보면서 최대한 이해하려고 노력했다. 오늘 공부한 5장, 6장에서 제일 관심 갔던 부분이 함수자, 모나드에 관한 부분이었다. 리턴 값이 null이나 undefined와 같은 예상치 못한 부분들 예상 가능하게 통제할 수 있게 하는 것이 매우 매력적으로 다가왔다. if-else로 예외처리를 해주지 않고도 값이나 에러를 통제할 수 있다. 내 프로젝트에 꼭 적용해봐야겠다. 특히 Maybe는 구현해서 사용하면 진짜 잘 사용할 수 있을 거 같다. 내 프로젝트가 null체크.. 20201208 T.I.L -카테고리 선택란을 슬라이더로 구현했다. 계속 변경되는 UI의 요소는 리덕스로 관리하고 싶지 않아서 local State로 도전을 해봤는데 역시 쉽지가 않다. 특히 테스트하는 부분에서 어떻게 해야 할지 몰라서 애를 많이 먹고 코드 숨 윤석 님께도 질문해서 실마리를 얻었다. 저번에 모달 창을 만들 때 이 테스트 부분에서 좌절하고 결국 redux에 책임을 돌렸는데 이번엔 UI라서 절대 그렇게 하면 안 된다고 생각해서 고생스러워도 밀고 나갔다. 테스트할 때 state의 변화를 테스트하는 것이 아니라 state변화에 따르는 UI의 변화를 테스트하는 방향으로 진행했다. 결국 어찌 저지 커버리지 100% 달성하고 이제 코드를 찬찬히 보면서 다시 정리할 일만 남았는데 변 수명 들이나 그런 것들이 다 너무 어렵고 부족.. 20201207 T.I.L - 디자인을 적용하기 시작했다. 이번 주엔 책을 많이 읽으면서 리팩터링에 더 많은 초점을 맞추려고 마음을 먹었다. 디자인을 적용하면서부터 갑자기 어떻게 css를 적용시키는 것이 좋은 것인가에 대한 고민을 하기 시작했기 때문이다. 디자인 시안을 받은 건 분명 1920 x 1250 버전인데 나는 1920 x 980 버전의 모니터로 작업을 하기 때문이다. 여기서 좀 멘붕이 왔는데 어차피 디바이스 크기는 무궁무진하고 거기에 다 맞춰서 반응형으로 제작해야 하니 공부가 절실히 필요해지는 느낌이 강하게 든다. 이제는 사놓고 묵혀두었던 두꺼운 css 책을 꺼내고 마틴 파울러의 리팩터링도 읽을 수 있다면 더 좋고 지금 읽고 있는 함수형 자바스크립트를 열심히 참고해야겠다. 오늘도 함수형 자바스크립트를 조금 읽어 모나드에 .. 20201205 T.I.L -오늘도 코딩하다 깜빡 잊고 이제야 작성하는 T.I.L - localStorage에 플레이리스트 제목과 곡을 저장하는 기능을 만들었다. 이 곡이 저장이 되어있는 곡이라면 처음 체크박스를 보여줄 때 이미 체크가 되어있도록 만들어서 내가 저장했던 곡인지 아닌지를 한눈에 알 수 있도록 만들었다. 그러고 나서 새로 곡을 저장하는 게 기존의 저장된 곡과 중볻을 어떻게 피할 수 있을까 고민했는데 위에 만들었던 로직 덕분에 고민 없이 중복이 없을 수 있게 된 걸 깨달았다. 아직 구현은 못했지만 체크를 해제하면 그 곡을 저장 취소하도록 만들었기 때문이다. 이게 더 발전되어 정말 삭제하시겠습니까?라는 알림 창이 하나 더 떴으면 좋겠지만 일단 지금은 추가 삭제 기능에 더 초점을 맞추고 작업해보도록 하자. 20201204 T.I.L - 모달 창만 하루 종일 만들었는데 완성을 못했다. ㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎ 모달창이 이렇게 어려움 작업일 줄이야. 어렵다. 새삼 유튜브 플랫폼이 너무너무 멋있어 보이고 존경스럽다. 거의 완성은 해뒀으니 테스트를 잘 짜고 싶은데 여기서 어렵다 ㅜㅜ 참;;; 천천히 잘 완성시켜 봐야겠다. 이번 주 단계가 끝나면 리팩터링에 집중해야겠다는 생각이 든다. 열심히 정리해서 만든다고 만들었는데 그래도 아직도 많이 부족해 보인다. 열심히 완성해야지! 20201203 T.I.L -아침에 상큼하게 웹팩으로 빌드한 이미지 파일에서 만들어진 테스트 오류를 해결하기 위해 jest의 moduleNameMapper 설정을 변경해 주었다. 그리고는 테스트가 무리 없이 통과되길래 다음 내비게이션 바를 만드는 부분으로 넘어가 내비게이션 바를 완성시켰는데 이게 웬걸... 다 완성된 후에야 그전에 작업한 게 잘못되었다는 걸 깨달았다. 재생 이미지가 화면에 안 뜨는 걸 확인했기 때문이다 ㅜㅜㅜ. 이 문제를 바로 잡는 데 엄청 오랜 시간이 걸렸다. 어휴 file-loader와 url-loader를 둘 다 이용해고 둘 다 모킹 해야 한다는 걸 알고 이렇게 간단한 문제였다니... 하는 약간의 허탈감? 이 들었지만 이렇게 한 수 배워서 이미지를 더 추가하는 것은 무리가 없겠다는 생각을 했다. -그리고 마이.. 20201202 T.I.L - 하루종일 함수형 자바스크립트 공부하다 스터디까지 완료했다. - 혼자 읽어서 알쏭달쏭한 부분들이 많았는데 스터디에서 잘 정리해서 많이 배웠다. 약간 오늘은 머리 과부화 되어서 더이상 지식이 안 들어가는 듯해서 읽어도 잘 모르는 느낌이 드니 내일 다시 시간을 쪼개서 이해 안됐던 부분들을 또 읽어봐야겠다. - 책을 미리미리 주말부터 조금씩 읽는 습관을 들여야겠다. 이틀만에 다보려니 잘 정리가 안된다. - 그래서 오늘은 프로젝트에 손을 대지 못했다. 아직 png 파일을 모킹해놔야 하는 부분을 해결하지 못해 이것부터 마무리 해야할 것 같고 오늘 책에서 나와서 처음으로 써본 lodash를 꼭 써보고 싶은 마음이 든다. - 내일도 화이팅! 20201201 T.I.L - youtube api를 외부에서 제어하는 방법을 며칠동안 찾고 찾고 또 찾다가 이제야 방법을 알고 거의 다 완성했다. 고생한만큼 뿌듯하다. - range input의 매력에 흠뿍빠졌다. 음량 조절, 진행 바 모두 range input으로 완성시켰다. div로 진행 바 만드는 것보다 이렇게 조작이 간단하다니 놀랍다. - youtube 할당량이 너무너무너무 모자르다. 근데 증설 신청방법도 뭔가 굉장히 까다롭고 자칫하다 기존의 할달량까지 뺏겨버린다는 무시무시한 이야기를 들었다 ㄷㄷㄷ. 자중하고 일단 절약하는 방향으로 만들어보자. - 내일 할 스터디를 위한 함수형 자바스크립트 이번 분량을 읽었는데 진짜 뭐가 뭔지 하나도 모르겠다. 내일은 스터디 하기 전까지 스터디 전 공부에 온 시간을 투자해야 할 것같다. .. 이전 1 ··· 14 15 16 17 18 19 20 ··· 30 다음