✨ 221221 Today I Learned ✨

오늘은 후기 상세 페이지를 갈아엎었다. 진짜 말 그대로 갈아엎었다. 원래도 900줄 가까이 육박하는 애였는데 싹 다 지우고 처음부터 다시 짰다. 처음부터 다시 짤 정도의 에러가 있었던 건 아니고, 정확히 말하자면 에러는 아예 없었는데 코드 순서나 불러오는 순서에 따라 안 돼보이는 게 있었고 그걸 깔짝깔짝 건드릴 바에야 처음부터 짜는 게 겸사겸사 다른 것도 손보기 좋을 거 같아서 그냥 처음부터 다시 짰다. 처음 짰을 때도 다시 엎어야된다는 생각을 하긴 했으나 당시에 너무 바빠 일단 진행시켰던 것이 문제. 결국 다 고치며 가는 게 가장 빠른 길이라는 걸 새삼 다시 꺠닫게 되었다. 기능들 다시 구현하면서 피드백에 있었던 기능도 추가했다. 아래는 다시 구현한 것들 목록이다.

1. 게시글 조하요
2. 작성자 정보 띄우기
3. 디폴트 이미지 수정 (1번 이미지만 있어도 다 뜨게 구현해 놓으셨었다)
4. 댓글 ~ 대댓글 수정 시 신고창이 닫히지 않는 문제 해결
5. 댓글 좋아요 여부에 따른 하트 모양 변경
6. 댓글 작성
7. 게시글 신고
8. 댓글 좋아요
9. 게시글 읽기
10. 댓글 신고
11. 댓글 작성 시간이 대댓글 작성 시간으로 뜨는 문제 해결
12. 댓글 부럴오기
13. 대댓글 작성
14. 대댓글 신고
15. 대댓글 삭제
16. 대댓글 불러오기
17. 대댓글 좋아요
18. 대댓글 좋아요 여부에 따른 하트 모양 변경
19. 댓글 수정
20. 댓글 삭제
21. 대댓글 수정
22. 댓글 신고 버튼 모양 통일
23. 대댓글 작성시간 말고 수정시간으로 띄우기
24. 후기 작성시간 말고 수정시간으로 띄우기
25. 대댓글도 수정 글자 말고 버튼 생성해서 기능 연결하기
26. 본인 코멘트에만 수정 삭제 버튼 보이게 하기
27. 본인 게시글에만 수정 삭제 버튼 보이게 하기
28. 본인 대댓글에만 수정 삭제 버튼 보이게 하기
29. 남의 게시글에만 신고 버튼 보이게 하기
30. 댓글 좋아요 눌러도 답글 창 안 닫히게 하기
31. 사진 슬라이드 방식 javascript로 교체 (원래 하셨던 분이 css로 했었는데, 피드백에 사진 개수랑 상관없이 슬라이드가 동작하는 게 아쉽다는 게 있어서 수정했다)

많은 페이지를 담당하지 못했는데, 이 페이지에 웬만한 기능이 다 들어가 있어서 그랬다. innerHTML 사용을 최대한 줄이고(아 원래 있던 내용 날리는 타이밍일 때 빼고 아예 안 썼다. 검색해보면 innerHTML = "" 이거 말곤 한 개도 없다) 해서 머리로 시뮬레이션 돌려가면서 기능 넣고, css 이것저것 얽혀있는데다가 동적으로 태그 추가하고... 진짜 징글징글한 페이지ㅣ… 지긋지긋하다;; 그래도 덧글 수정할 때 모달창을 띄운다거나 페이지를 바꿔서 한다거나 계속 input창으로 두되 css로 눈속임만 할 수도 있었겠지만, 멀리 돌아가더라도 input창 지우고, 수정할 때만 input창 띄우고, 다시 수정 버튼을 누르면 수정 기능이 작동되게 하는 식으로 최대한 실제 서비스와 비슷한 방식으로 하려고 했다. 신고도 사실 모달창 없이 바로 버튼에 기능을 넣어도 됐겠지만 실제 서비스처럼 모달창 띄우고, 내용이나 그런 거 작성하고 보내게 했고... 웬만한 기능은 거의 다 비동기로 구현해서 새로고침도 웬만하면 안 되게 해놨다. 덧글같은 게 많이 달리고 스크롤이 길어지면 덧글 달 때마다 매번 스크롤 내리기도 사용자 입장에선 귀찮을 거 같았다. (그리고 이 비동기 부분에서 이리저리 꼬인 게 많아서 비동기인데도 비동기가 아닌 것처럼 보이는 기능 몇 개가 생겨서 최종적으로 969줄이나 되는 애를 처음부터 다시 짜게 된 거고...)

아뉘 사실 500줄 이내에서 처리될만한 애일 걱 ㅏㅌ긴 하다. 하지만 난 아는 게 별로 없고 저게 최선이었다. 나는 언제쯤 천줄'밖에'라고 말할 수 있는 능숙한 개발자가 될 수 있을까 이번 프로젝트하면서 유독 자존감이 많이 떨어졌다. 나만 새로운 인원인 팀이라 여러모로 외롭기도 하고. 이번 프로젝트는 여러 방면으로 힘들다.