hunter-hwang-dev / _hunterpedia-vue

React로 마이그레이션 하기 전 Vue.js 테스트 (2024-11-19 현재 사용하지 않음.)
1 stars 0 forks source link

갱신 버튼을 누르면 랜덤한 quick-tips를 하나 띄워 주기 + < > 기호 깨짐 현상 발견, 우선 스루 #5

Closed hunter-hwang-dev closed 3 weeks ago

hunter-hwang-dev commented 3 weeks ago

documents의 갯수를 알면 random을 돌리면 된다. 하지만 실시간으로 바뀌는 collection 내 documents의 갯수! 분명 MongoDB에서, (documents 갯수 호출이라는 중간과정을 우리한테 안 보내고도) 랜덤한 document를 뽑아주는 기능을 제공할 것 같다. 검색어를 잘 모르겠으니 우선 ChatGPT에게 상황 설명을 해 보자.

Image

hunter-hwang-dev commented 3 weeks ago

실제로 많이 쓰는 메서드/연산자인지 구글링을 해 보자.

Image

aggregate() 정말 많이 쓰나 본데?

hunter-hwang-dev commented 3 weeks ago

더 나아가, aggregate() 자체가 쿼리인 것 같다. SQL 퀴즈 풀때도 랜덤하게 하나 뽑는, 쿼리를 작성하기도 하잖아.

hunter-hwang-dev commented 3 weeks ago

Image https://www.mongodb.com/ko-kr/docs/manual/reference/operator/aggregation/sample/ 공식 문서에 있는 $sample. 좋아, 가짜 안내는 아니니, ChatGPT의 예시 코드를 읽어가며 내 코드를 작성해 보자.

hunter-hwang-dev commented 3 weeks ago

Image Image Image

랜덤하게 잘 출력된다.

그런데 잠깐! 특수문자가 와르르 깨져서 왔다. node parser/mongoInsert.js를 실행해 서버에 파싱된 데이터를 보내줄 때에는, 몇 개의 documents가 '성공적으로' 등록되었는지만 알려줬다.

그리고 MongoDB에서 등록된 documents를 확인할 때에는 앞 부분만 확인했다. 따로 드래그하지 않는 이상, 긴 String 뒷부분이 웹에서 잘려서 안 보이거든...

hunter-hwang-dev commented 3 weeks ago

우선 지금은, 깨진 특수문자를 그냥 내버려 두기로 했다.

Image

answer 항목이 잘 들어갔으니 충분. 나중에 출력할 때 바꿔끼든지 하면 된다. 내 생각엔 js 처음 쓰는 사람이 제일 많이 하는 실수여가지고, 해결 방법이 널려 있지만 잘못 건드리면 롤백하기 어려워 보인다.