본문 바로가기

Life

 (242)
20201212 T.I.L - 플레이어와 LNB를 반응형으로 만들었다. 와.... 이 정도 하는 게 이렇게나 손이 많이 가는 일인 줄 몰랐다. 게다가 도메인을 연결하면서 기본 페이지가 아닌 다른 페이지에서 왜 새로고침을 하면 404 오류가 나는 것인지 알지 못해 한참을 찾아보고 머리 싸매고 고생하다 또다시 윤석 님의 도움을 받았다. 추가로 내가 검색해 본 결과로는 깃 헙 페이지는 SPA를 지원하지 않아 404 페이지에 index를 연결해주어야 SPA처럼 진행이 된다는 점이다. 근데 또 웹팩으로 빌드업하는 과정에서 404 페이지는 빌드업이 돼지가 않아서 함 참을 고민하다가 지금은 수동으로 빌드업된 인덱스 파일을 404 파일로 복사해서 만들어서 gh-pages로 배포하고 있다. 웹팩을 더 공부해서 이점을 나중에는 자동으로 할 수 있기..
20201211 T.I.L -공식적으로 끝날 날이 이틀밖에 남지 않은 내 프로젝트를 리팩터링 하면서 lodash를 적용해보고 있다. if(xx === null)과 같은 문장보다 훨씬 명료하게 알아볼 수 있어서 작성하는 입장과 타인이 코드를 보는 입장 둘 다에 굉장히 장점으로 다가온다는 걸 느꼈다. 모나드를 너무나 써보고 싶어서 지금도 시도해보고 있지만 역시 쉽지 않다. 스터디에서 말했던 명령형 코드를 함수형 코드로 변경한다는 것은 애초에 불가능한 일이고 처음부터 함수형 코드로 작성해야 한다는 말이 와 닿는다. 이건 코드를 수정하는 것이 아니라 그냥 다시 새로 짜야하는 것 같다. 그래도 아직 포기하긴 이르고 함수 합성과 같은 해보고 싶은 것들이 더 있어서 내일 추가로 더 진행해 볼 예정이다. 그리고 큰 숙제가 남았다. 내가 짠 프로..
20201210 T.I.L - 디자인 적용을 드디어 마쳤다! 아직은 정식 디자인이 제대로 나온 상태는 아니라서 임시 디자인이지만 그래도 뭔가 나의 앱이 더 이상 초라해 보이지 않아서 그 점이 마음에 든다. 점점 완성에 가까워져 가는 느낌이다. 디자인을 하나둘씩 적용해가니 사용하면서 불편해 보이는 부분이 여기저기서 막 나왔다. 페이지를 이동할 때 음악 끊김 현상이라던지 아니면 무드를 선택하는 페이지에서 아직 선택도 안 했는데 카테고리 페이지로 이동할 수 있다는 점 같은 개선 하면 더 좋을 거 같은 부분들이 생겨났다. 이제 디자인 적용은 1차적으로 마무리되었으니 이런 오류사항들을 열심히 고치고 코드를 리팩터링 할 시간만 남았다. 진짜 함수자 적용 너무너무 해보고 싶다! ㅎㅎㅎ 프로젝트 마무리는 이번 주 일요일까지 3일이 남았지만 나는..
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 - 모달 창만 하루 종일 만들었는데 완성을 못했다. ㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎ 모달창이 이렇게 어려움 작업일 줄이야. 어렵다. 새삼 유튜브 플랫폼이 너무너무 멋있어 보이고 존경스럽다. 거의 완성은 해뒀으니 테스트를 잘 짜고 싶은데 여기서 어렵다 ㅜㅜ 참;;; 천천히 잘 완성시켜 봐야겠다. 이번 주 단계가 끝나면 리팩터링에 집중해야겠다는 생각이 든다. 열심히 정리해서 만든다고 만들었는데 그래도 아직도 많이 부족해 보인다. 열심히 완성해야지!

티스토리툴바