Youtube Clone/MongoDB (6) 썸네일형 리스트형 ESLint, Regular Expression ESLint는 코드에서 문제가 생길만한 부분을 찾아준다. s를 잘못 붙였다든가... npm install eslint -D eslint --init 해서 대충 설정 .eslintrc.js의 extends부분에 extends: ["eslint:recommended", "plugin:prettier/recommended"] 이렇게 추가 npm install prettier -D prettier랑 eslint랑 겹친다. prettier가 만들어준 코딩스타일은 eslint가 무시해줬으면 좋겠다. npm install eslint-config-prettier npm install eslint-plugin-prettier Regular Expression은 검색을 도와준다. regex101.com 참고 Detail, Edit, Delete, Search detail: 홈에 표시된 DB의 책 중 한권을 고른다. 고르면 그 책의 id를 이용해 book/:id로 이동한다. id를 이용해 DB에서 그 책의 정보를 찾는다. findById와 같이 DB를 건드리는건 mongoose의 documentation(주로 query)을 찾아본다. bookDetail.pug에 comment 개수 표시 추가 bookDetail 페이지에서 Edit Book을 누르면 books/:id/edit으로 이동한다. 제목과 설명을 바꾸면 정보가 업데이트된다. 이때 이미 title과 description는 존재하고 있는 상태. 수정하지 않으면 원래 값을 유지하도록 한다. 아래 코드에서 value = book.title 과 =book.description은 기본 값을 설정해주는 것이다. te.. Upload 웹에 upload 할 때 중요한 개념은, 파일 그 자체를 불러오는 게 아니라, 그 파일의 위치를 가져오는 것. 모든 파일을 웹에 저장한다면 웹이 너무 무거워진다. 파일은 서버의 DB에 저장하고, 그 위치를 웹이 기억한다. 파일을 업로드하면 그 파일의 URL을 추출해서 저장할 수 있는 middleware 필요 npm install multar /upload 화면에서 책을 선택하고, 제목과 설명을 적은 뒤 업로드 버튼을 누르면 책의 정보가 전송된다.(POST) bookRouter에서 이 신호를 포착하고 addBook과 postUploadBook을 차례대로 실행한다. addBook은 /uploads/books 폴더에 책의 url을 저장한다. postUploadBook은 models/Book.js에서 정의한 B.. async-await, try-catch Book.find({})는 DB에 있는 모든 Book을 가져온다. 작업이 끝날때까지 대기하도록 async를 사용한다. await부분이 끝나기 전에는 res.render를 실행하지 않는다. 이때 error가 생기는 것을 잡아내기 위해 try-catch를 사용한다. Model and Schema MongoDB의 장점은 document를 줄여준다는 것. 우리는 MongonDB에게 우리의 데이터들이 어떻게 생겼는지 알려줘야 함 Model은 데이터를 의미, 데이터가 어떤 정보를 포함하는지가 Schema. 아래와 같이 Book.js를 만들어 model이 포함해야할 정보의 구조를 작성. 그리고 init.js 에서 ./models/Book을 불러온다. comment 기능을 추가하자. Comment.js 파일을 만들어 comment의 Schema를 작성 init.js에서 import하고, BookSchema의 마지막에 Comment key 추가. Comments key에 ObjectId value는 comment 마다 Id를 할당해서 해당하는 Book model에 매칭시킨다. MongoDB와 Mongoose, 그리고 dotenv https://www.mongodb.com/download-center/community MongoDB는 간단한 규칙으로 작업할 수 있는 데이터 베이스. 사용하기 쉽고 직관적으로 작동한다. 일단 MongoDB Campus Community도 함께 설치했다.(뭔지 잘 모름) 설치경로(C:\Program Files\MongoDB\Server\4.2\bin)에 가보면 mongod와 mongo가 있다. 이 둘을 실행시켜야 하나 봄. 연결에 문제가 생기면 이 둘이 돌아가고 있나 체크. 이제 Mongo를 JavaScript와 연결해야 하는데, 둘 사이에 Adapter가 필요하다. npm install mongoose db.js의 Fake DB를 지우고 아래와 같이 수정한다. 이제 controller에서 db를 불러.. 이전 1 다음