20210708 [항해 32일 차]

목표를 세울 때에는 목표만 정해야 한다.
어떻게 목표를 달성할 것인지 또는 잘못되면 어떻게 할 것인지에 대해 생각하지 마라.
- 레이 달리오 -

오늘 심화반 과제 요구사항을 모두 넣어서 과제를 완성하고 싶었는데 부족한 실력으로 인해 완성 못했다. ㅠㅠ 기초반 때 했던 내용에 대한 것을 숙지한다면 기본적인 로직을 짜는 것도 크게 어렵지 않고, 힌트도 많이 받을 수 있어 체감 난이도는 기초반보다 쉬워 시간만 충분했다면 해결하기 어렵지 않았을 것 같다. 하지만 복잡하게 얽혀버린 코드와 문법적인 오류들 때문에 시간을 너무 많이 소모했다. 저번 주 강의 듣는 날부터 과제를 시작하든지, 일요일에 더 열심히 하든지 막히는 문제가 있을 때 바로 해결하기 위해 모든 수단을 다 동원했다면 완성할 수 있었을 것 같은데 아쉽다... 

 

ajax를 통해 json형식의 데이터를 받아와 파싱 하는 과정에서 undefined가 계속 뜨며 문제를 전혀 해결하지 못했다. 

comment 내부의 _id값을 얻기 위해

c = req.body.comment 라고 선언하고 여러 가지 테스트를 해봤다. 아래 테스트했던 것들 전부 실패했다.

x = c._id 

x = c.id

{id} = c

{_id} = c

{"id"} = c

{"_id"} = c

 

총 세분께 질문을 했는데 한 분이 split을 이용해 해당 데이터의 내용을 쪼개면서 배열의 인덱스로 접근해보라는 말씀을 해주셨다. 결정적인 힌트를 받아 시도했더니 원하는 _id값을 받아와 댓글 수정하는 기능을 완성할 수 있었다. 왜 나는 꼭 특정한 형태나 함수를 통해서만 값을 받아올 생각을 했을까? 알고리즘 풀 때 나온 split을 사용할 생각을 못했는데 크게 배운 느낌이다. 이가 없으면 우선 잇몸으로 라도 음식물을 씹어 넘겨야 되는데 나는 임플란트를 할 생각부터 했다.

 

프론트엔드에서 페이지 이동할 때 사용하기 좋은 명령어? 함수를 찾아봤다. 원래 href나 replace만 이용했는데 훨씬 간편한 게 있었다. 나중에는 페이지 응답속도 같은 요소도 고려해야겠지만 우선은 짜기 쉬운 코드를 쓰는 방향으로 가려고 한다.

 

location.href = document.referrer  뒤로 가기 후 새로고침 이거 코드 짤 때 너무 좋다. 이전 페이지에 쿼리 파람 값이 이미 저장되어있는 형태가 많은데 이 경우 또다시 id 값을 찾아 넣어주는 수고를 덜 수 있다.

history.go()  기본값은 현재 페이지 새로고침, () 내부에 숫자를 넣으면 history.go(-1)의 경우 바로 전 뒤로 가기 history.go(1)의 경우 한 칸 앞으로 가기다. 1 대신 다른 숫자를 넣으면 넣은 값만큼 이동한다.(음수는 뒤로 양수는 앞으로) 

원하는 페이지만큼 이동 후 새로고침을 하고 싶은데 이건 어떻게 하면 좋을지 모르겠다. 여러 가지로 명령어를 짬뽕해서 해봤는데 다 실패했다.

 

내일부터 미니 프로젝트가 시작된다. 나는 진도 따라가기가 너무 힘들어서 재정비반으로 가서 내실을 좀 더 키울 생각이다. 다른 사람과 협업하며 실력을 키우는 것도 중요하지만 지금 내가 부족한 부분과, 해결하기 위해 어떤 노력을 할지 어느 정도 감이 잡혀서 혼자서 반복 숙달하며 실력을 키우는 게 차 후 실전 프로젝트 때 더 좋은 성과를 내리라 확신한다.

 

 

 

1. 회원 가입 페이지
   • [x] 회원가입 버튼을 클릭하기
   • [x] 닉네임, 비밀번호, 비밀번호 확인을 입력하기
   • [ ] 닉네임은 최소 3자 이상, 알파벳 대소문자(a~z, A~Z), 숫자(0~9)로 구성하기
   • [ ] 비밀번호는 최소 4자 이상이며, 닉네임과 같은 값이 포함된 경우 회원가입에 실패로 만들기
   • [x] 비밀번호 확인은 비밀번호와 정확하게 일치하기
   • [x] 데이터베이스에 존재하는 닉네임을 입력한 채 회원가입 버튼을 누른 경우 "중복된 닉네임입니다."라는 에러 메시지를 프론트엔드에서 보여주기
   • [x] 회원가입 버튼을 누르고 에러메세지가 발생하지 않는다면 로그인 페이지로 이동시키기
2. 로그인 페이지
   • [x] 로그인, 회원가입 버튼을 만들기
   • [x] 닉네임, 비밀번호 입력란 만들기
   • [x] 로그인 버튼을 누른 경우 닉네임과 비밀번호가 데이터베이스에 등록됐는지 확인한 뒤, 하나라도 맞지 않는 정보가 있다면 "닉네임 또는 패스워드를 확인해주세요"라는 메세지를 프론트엔드에서 보여주기
   • [x] 로그인 버튼을 눌러서 에러 메세지가 발생하지 않는다면 전체 게시글 목록 조회 페이지로 이동시키기
3. 로그인 검사
   • 아래 페이지를 제외하고 모두 로그인 한 경우만 볼 수 있도록 하기
     • [ ] 회원가입 페이지
     • [ ] 로그인 페이지
     • [ ] 게시글 목록 조회 페이지
     • [ ] 게시글 조회 페이지
   • [ ] 로그인을 하지 않거나 올바르지 않은 경로로 접속한 사용자가 로그인이 필요한 경로에 접속한 경우 "로그인이 필요합니다." 라는 메세지를 프론트엔드에서 띄워주고 로그인 페이지로 이동시키기
   • [ ] 로그인 한 사용자가 로그인 페이지 또는 회원가입 페이지에 접속한 경우 "이미 로그인이 되어있습니다."라는 메세지를 띄우고 전체 게시글 목록 조회 페이지로 이동시키기
4. 게시글 조회 페이지 > 댓글 목록 조회
   • [x] 로그인 하지 않은 사용자도 댓글 목록 조회가 가능하도록 하기
   • [ ] 현재 조회중인 게시글에 작성된 모든 댓글을 목록 형식으로 볼 수 있도록 하기
   • [x] 댓글 목록 위에 댓글 작성란 만들기
     • 댓글 작성에 관한 기능은 5번 요구사항으로 연결하기
   • [ ] 댓글 목록 중, 내가 작성한 댓글인 경우 댓글 수정, 댓글 삭제 버튼 만들기
     • 댓글 수정 버튼을 누르면 6번 요구사항으로 연결하기
     • 댓글 삭제 버튼을 누르면 7번 요구사항으로 연결하기
   • [x] 제일 최근 작성된 댓글을 맨 위에 띄우기
5. 게시글 조회 페이지 > 댓글 작성
   • [ ] 로그인 한 사용자만 댓글 작성이 가능하도록 하기
   • [x] 게시글 조회 페이지 하단에 댓글 내용을 입력할 수 있는 댓글 작성 버튼 만들기
   • [ ] 로그인 하지 않은 사용자가 댓글 작성란을 누르면 "로그인이 필요한 기능입니다." 라는 메세지를 띄우고 로그인 페이지로 이동시키기
   • [x] 댓글 내용란을 비워둔 채 댓글 작성 버튼을 누르면 "댓글 내용을 입력해주세요" 라는 메세지를 띄우기
   • [x] 댓글 내용을 입력하고 댓글 작성 버튼을 누른 경우 작성한 댓글을 추가하기
6. 게시글 조회 페이지 > 댓글 수정
   • [ ] 내가 작성한 댓글만 수정 가능하도록 하기
   • [x] 댓글 본문이 사라지고, 댓글 내용, 저장 버튼 생성하기
   • [x] 댓글 내용에는 이전에 입력했던 댓글 내용을 기본 값으로 채우기
   • [x] 수정할 댓글 내용은 비어 있지 않도록 하기
   • [x] 저장 버튼을 누른 경우 기존 댓글의 내용을 새로 입력한 댓글 내용으로 바꾸기
7. 게시글 조회 페이지 > 댓글 삭제
   • [ ] 내가 작성한 댓글만 삭제 가능하도록 하기
   • [ ] "정말로 삭제하시겠습니까?" 메세지를 띄우고, 확인/취소 버튼 중 "확인" 버튼을 누른 경우 목록에서 해당 댓글을 삭제하기
   • [ ] 취소를 누른 경우 삭제되지 않고 그대로 유지하기
8. 회원가입 테스트 코드 작성
   • 회원가입시 구현한 아래 조건을 검사하는 테스트 코드를 작성하기
   • [ ] 테스트 코드 실행 시 실제로는 데이터베이스에 연결되지 않도록 하기
   • [ ] 각 조건 별로 2개 이상의 테스트 케이스가 존재하도록 하기