22.03.10(목) 8일차
개발 진행상황
프론트엔드
- 메인페이지에 자바스크립트 연결 작업중.
- 메인페이지에 필요한 이미지, 아이콘 등 소정님에게 받아 추가
백엔드
- 하단 플레이어에 음악 재생되도록 연결.
- youtube 링크 DB구성
개발 진행목표
- 소정님: 레이아웃 디자인 완료 및 노션 정리
- 다연님: 월요일까지 검색결과페이지 구현
- 세민님: 토요일까지 마이페이지 구현
- 나: 토요일까지 retro차트/retro 모음집 페이지 구현
- 동우님: 전체적 연결
- 광윤님: 마이페이지 db연결
페이지 레이아웃
코로나로 월~수요일간은 많이 아파서 작업을 많이 못했는데 오늘부터 좀 괜찮아졌다. 그래서 밀린 작업을 엄청나게 해볼 예정.. 힘내자 힘!!!!
22.03.11(금) 9일차
각자 목표로 한 작업들 계속 진행하고 있다.
회의시간에는 주로 팀원분들 깃 이슈들을 해결해 드렸다.
알다가도 어려운 깃의 세계...... 그래도 많이 는것 같다. ㅎ.ㅎ 남한테 설명도 해주고..
메인페이지에 뭔가 우리의 흔적을 남기면 좋지 않을까? 싶어서 에디터픽 대신에 개발자픽 추천플레이리스트를 넣기로 했다. 각자 설명란 코멘트+노래 리스트 준비해오기로!
22.03.12(토) 10일차
오늘은 6시에 팀장 중간점검이 있었다.
팀장 중간점검
레트로 : 그때 그 시절, 당신의음악
1980~2010년대 노래를 듣거나 검색할 수있는 사이트
-
팀별 진행상황
웹디자이너 (1명) : 레이아웃 90%이상 거의다 나온상황
프론트 (3명) : 레이아웃대로 작업중 (50%)
백엔드 (2명) : DB작업 완료 -
이후 남은 상황
메인페이지 제외 나머지 페이지 작업
성향테스트
editor's pick
로드맵을 만들어서 일별 목표 설정해서 작업 중
-
담당튜터님 어떠신지
가이드
취업관련, 내일배움캠프 -
요청사항
개발일지 및 후기 기간 : 18일까지
발표 어떻게 : 월요일전까지 공지
개발 진행상황
페이지별 진행상황을 노션에 표로 정리해서 명시해두었다.
나는 오늘까지 레트로차트/모음집 페이지 구현을 완료하고, 다음주 월요일까지는 성향테스트페이지 구현을 할 예정!
- 마이페이지 근황.. 회원가입/로그인 연결 후 진행중이시라는데 너무너무 귀엽다 ㅠㅠ 노트(우리 캐릭터 이름)야 너무 귀여워!!!!
- 이제 좋아요를 눌러서 음악이 db에 추가되면, 그 음악들이 표시되는 MY플레이리스트가 저 회색부분에 구현되어야한다.
- 검색결과 페이지도 얼추 완료!!!
- 메인페이지에 상단 배너 추가
- 이제까지 다른분들이 작업하셨던 branch 내용들 develop 브랜치에 머지 완료!
오늘은 여기까지!! 팀원분들이 다들 새벽까지 너무너무 열심히 해주셔서 작업량이 꽤 많은데도 잘 진행중이다ㅠ.ㅠ 이렇게 팀을 잘 만나다니,,
22.03.13(일)~22.03.14(월) 11~12일차
개발 진행상황
작업이 꽤 진행된 만큼... 자잘한 오류들도 생기기 시작했다.
노션에 기록해두고, 큼지막한 구현 완료되면 서서히 고쳐야겠다😭
- 예를들면,, 이런거 ㅎ.ㅎ
- 레트로모음집 페이지에 js코드도 연결!
- 성향테스트 기간안에 만들수 있을까 걱정했는데 구현 성공했다! 뿌듯😆😆😆😆
✅ 레트로차트 / 레트로 모음집 / 플레이리스트 / 검색 결과 페이지 구현 완료
✅ 레트로 차트 페이지에 1~100위 출력되는 것도 연결 완료
✅ 소정님이 디자인해주신 소개페이지 이미지도 페이지 새로 생성해서 넣어둔 상태!
✅ 광윤님이 db에 계속 페이지에 필요한 데이터 추가/수정해주고 계시고, 동우님도 페이지에 데이터 연동 작업 진행해주시고 계심
남은 기간동안, 구현된 페이지에 db 연결하고, js코드 작성하고 ... 자잘한 에러 수정하고. 도메인 구매해서 최종 배포까지 하면 될것 같다. 와.. 이게 진짜 되는구나. 역시 집단 지성의 힘...
22.03.15(화) 13일차
개발 진행상황
- 구현된 페이지에 js코드로 연결작업 진행중
- 검색 기능 구현 진행중
작업량이 많아지다보니 종종 깃에서 conflict 날때가 있어서 그것도 해결해주고 있다.
그리고 오늘은 미니튜터님 마지막 피드백날!
미니튜터님 피드백
- 디자이너분 함께 오셔서 디자인 피드백 위주로 해주심
- 내일(수)부터 발표준비 시작해야한다.
- aws 배포까지 꼭 하셨음 좋겠다고 하심!
메인페이지
- 콘텐츠영역이 너무 좁은 느낌이라 조금 넓히면 좋을것 같다.
- 듣기버튼이 앨범사진안이 아니라 제목 옆에 있으면 좋을듯
인물배너
- 이문세, 이선희 인물배너 컬러 레드컬러로 변경하면 좋을듯
개발자픽 플레이리스트
- 플레이 아이콘이 너무 크다(아예 없애도 좋을듯, 그냥 사진 누르면 링크로 넘어가게)
- 텍스트 크기, 자간 조절필요할듯
레트로 차트
- 플레이버튼이 너무 정적이다. 레트로 느낌에 맞춰 LP판 느낌의 플레이아이콘으로 변경하거나 인터렉션이 있으면 좋을듯
- 차트 리스트에 플레이버튼 눌렀을때 일시정지 버튼 추가하면 좋을듯
이런 피드백들을 주셨는데, 사실 주로 디자인적인 피드백 위주라 팀원분들과 이야기 하고 수정할 부분만 수정해보기로 했다!
구현 남은 부분
- 같은 곡 중복되는 것
- 페이지 소개 밑에 버튼링크
- 성향테스트 페이지 연결
- 레트로모음집 페이지, 메인에서 누른 연도로 보여주기
- 마이페이지 좋아요리스트 없을때 화면
- 회원가입시 비밀번호 안보이게
- 레트로모음집 전체곡 오류
- 성향테스트 공유하기+버튼 hover기능 추가
22.03.16(수) 14일차
- 구현된 페이지들 메인페이지에 연결
챌린지 종료 전날..
팀원들과 페이지들을 둘러보며 아쉬웠던 점은 SPA로 구현하지 않아 페이지 이동시 음악재생이 끊긴다는것. 수정해볼까? 잠깐 생각했지만... 다음날이 챌린지 종료라 자잘한 오류들, css 수정을 하는게 더 나을것 같다고 판단했다.
TODO
- 성향테스트 결과 db에 업데이트, 마이페이지에 연결
- 모음집페이지에서 년도 선택시 노래리스트 업데이트 되도록
- 메인페이지에서 년도별 모음집 선택시 각 년대 버튼 빨간색으로 색 변환되도록 js코드 수정
챌린지 전날에 구현목표로 했던 모든 기능을 완료했다...!😭😭😭
이제 웹페이지들 둘러보며 발견되는 오류들만 수정해주면 된다.
이런식으로 hover되었을때 좀더 예쁘게(?) css도 수정해주고, 피드백때 들었던 아이콘 크기나 자간 등도 수정을 열심히,,, 진행했다.
22.03.17(목) 15일차
배포 완료, 끝없는 수정
드디어.... 배포!!!!
하지만 수정할 것들이.. 꽤 많다.
- 이런 팝업창 사이즈도 너무 커서 좀더 수정해주고.
-
성향테스트 공유시 og이미지도 넣어줬다.
-
전체적으로 이미지 용량이 커서 로딩시간이 오래걸리는 문제로(?) 이미지 용량도 전부 다운해서 다시 넣어줬고, 로그인/회원가입 페이지 입력창 사이즈도 조절함...
- 메인페이지 font-weight랑 color도 수정
- 플레이 아이콘도 기존 아이콘이 잘 안보인다는 피드백이 있어서, 화이트 컬러에 그림자를 주고 hover시에 빨갛게 보이도록 변경했다.
하도 css 수정을 많이해서 컬러들을 다 외워버렸다.. ㅎ.ㅎ 참고로 우리 웹사이트 메인 red 컬러는 #eb1400.. 🔥
- 소개페이지에서 메인페이지로 돌아가는 버튼도 이렇게 귀엽게 ㅠㅠ 수정되었다 소정님 최고!!!!!!
마지막 날에 git 오류 ... ?
챌린지 마지막 날인데, 그래서 수정작업을 계속 진행하고 있었는데,
오후 11시 30분쯤 갑자기 git에 push가 안되기 시작했다. 나한테 무슨 문제가 있나..? 싶었는데 다른 분들도 다 안되시고, 심지어 게더타운에 계시는 다른 팀한테도 가서 여쭤봤는데 다 git이 안되신다고.... 😵 아니... 아니 어떻게 하필 딱 오늘 지금 이시간에....
찾아보니 git 오류가 진짜 맞아서 어쩌나.. 했는데 다행히도 1시간쯤 뒤에는 push가 정상적으로 잘 되기 시작했다. 십년감수했네...
그래서 결론은 마지막날도 새벽 3시까지... 수정함 ..^^
괜찮아 완벽한 결과물을 위해서라면 ...
메이킹챌린지 종료, 최종 결과물
그때 그 시절, 당신의 음악 | RE:TRO
https://retro-music.co.kr/
18일 최종 발표회를 기다리며, 15일간의 메이킹챌린지 진짜 마무리!
