저장을 습관화

- .sort() 메소드 const todos = Todo.find().sort("order"); // 할 일 목록에 대한 모든 정보를 가지고 온다. // .sort("order") 메소드에 의해서 order를 기준으로 오름차순으로 정렬한다. // 만약 .sort("-order")라고 적는다면 order를 기준으로 내림차순 정렬한다. - HTTP 메소드 중 put과 patch의 차이 PUT과 PATCH 모두 리소스의 업데이트를 의미하나 PUT은 리소스의 모든 것을 업데이트 하고 PATCH는 리소스의 일부를 업데이트한다는 차이가 있다 예를들어 이름, 나이, 성별이라는 key가 있을때 PUT으로 이름만 업데이트 했을경우 나이와 성별은 null이 되나 PATCH로 이름만 업데이트 했을경우 나이와 성별은 기존값..

mongoDB, mongoose 사용 중 의아한 부분이 생겼다. schema를 적은 파일 comment.js를 작성 중 아래와 같이 ...(중략)... module.exports = mongoose.model("Commnet", commentSchema); 'Comment'가 아닌 'Commnet'으로 오타가 났는데도 다른 파일에서 가져다 사용하는데 아무런 지정이 없었다. ...(중략)... const Comment = require("../schemas/comment.js"); ...(중략)... 어떻게 이게 가능했을까 검색해보니 이유는 다음과 같았다. module.exports = mongoose.model("Commnet", commentSchema);에서 module.exports는 Node.js..

- REPL 입력받은 코드를 읽어(Read)들여 메모리에 저장하고, 평가(Evaluate)된 값을 출력(Print)한다. 특정 신호를 입력받기 전까지 위의 과정을 반복(Loop)한다. 쉽게 말해 입력한 코드의 결과값을 즉시 확인할수 있기 때문에 간단한 문법 등의 테스트에 적합한 환경이라는 의미이다. Node.js가 이 REPL환경을 제공하고 있다. 상식으로 알고 있자 - 동기(sync)와 비동기(async) '동기로 실행된다' = 먼저 실행된 코드의 결과가 나올때까지 대기한다. '비동기로 실핸된다' = 실행된 순서와 관계없이 결과가 나온다. - Blocking Model과 Non-Blocking Model Blocking Model은 코드의 실행이 끝나기 전까지 실행 제어권을 다른 곳에 넘기지 않아 다른..

parentNode 현재 노드의 부모 노드를 선택한다. 이번 프로젝트에선 아래와 같이 클릭된 노드에서 부모 노드로 올라간 뒤, 다시 quertySelector로 crtTxtArea 클래스를 찾아 내려갔고, 그 textarea에 입력된 내용을 가져왔다. exVar.addEventListener('click', event => { console.log(event.target.parentNode.querySelector('.crtTxtArea').value); }) closest()와의 차이 closest('#selector')는 자신의 부모 태그들 중에서 selector를 기준으로 찾아갈 수 있다. 하지만 parentnode는 자신의 바로 부모 노드만을 찾아간다. 이번 프로젝트에서 closest()는 아래와..

오늘 발생했던 에러 unexpected token 'c' in JSON.... 에러가 발생한 위치조차 엉뚱한 곳을 가르킴 - 에러 원인 로컬 스토리지에 저장한 댓글 수정 기능 작성 중 const obj = { id: localStorage.getItem('id'), cmt: $txt.value, movieId: idParams, cmtKey: priKey }; localStorage.setItem(priKey, JSON.stringify(obj)); // JSON.stringify(): 객체 obj 를 string 타입으로 저장함 // 로컬 스토리지에서 확인했을때는 다음과 같다. // key: 3 // value: {"id":"testID","cmt":"test3","movieId":238,"cmtKey..

- window.location.reload(); 현재 웹 페이지를 새로고침함 로컬 스토리지를 비우고, 웹에 등록하였던 댓글 등을 지울때 페이지를 새로고침하는 용도로 사용하였음 (변수).addEventListener("click", () => { localStorage.clear(); window.location.reload(); }); 이외에도 로컬 스토리지, 세션 스토리지, setTimeout(), setInterval() 등이 있으나 이건 과제가 완료된 후 적기로...

0. 지난 이야기 2023.06.05 - [TIL] - 230605 TIL - 모듈 Module // File: 1.html // ...(전략) // ...(후략) // File: 2.js const test = "testString"; // File: 3.js window.alert(test); // file: 4.js const test = "isThisWork?"; 이전 시간에 html 파일에 사용할 js 파일들을 나열해줬더니 2.js와 4.js가 서로 변수 선언이 충돌하던 일이 있었다. 이상하다 생각했는데 HTML에는 스코프라는 개념이 없기 때문에 원래 이러는게 정상이었다. 만약 억지로 두 파일의 내용을 공유하고 싶지 않다면 4.js 파일 안에 변수 선언 내용을 {중괄호}로 묶어줘야 했었다. 하지..

0. 에러인가 기능인가 자바스크립트의 module화를 공부하기 위해 기존 프로젝트가 가지고 있던 js파일을 여러개로 쪼개고 있었다. 각 기능별로 1.js, 2.js, 3.js, 4.js로 나누었고(파일 이름은 예시) html 파일에서 아래와 같이 사용할 js파일들을 지정해주었다. 라는 내용을 넣었고 a.js 안에 const test = 'test string' 이라는 변수 선언을 하였는데 b.js 안에서 test 변수를 이용한 코드를 사용할 수 있었어 서로 다른 파일에 있는 변수나 함수 등 코드를 사용하려면 import export 선언이 필요한 것으로 알고있는데 이러한 import export 선언 없이도 b.js에서 a.js가 선언한 변수를 사용할수 있었던 이유가 뭐야? ChatGPT: 일반적으로 자..

1. input 입력값 가져와서 출력하기 https://hianna.tistory.com/411 https://velog.io/@woosungkim0123/%EB%B6%84%EA%B8%B0%EC%B2%98%EB%A6%AC-%EA%B8%B0%EB%8A%A5 https://wikidocs.net/112349 2. getElementbyId https://kyounghwan01.github.io/blog/JS/JSbasic/getElementById/ id를 가지는 태그에 접근하는 함수 해당 id가 없을 경우 null 에러 발생 주어진 id와 일치하는 dom 요소를 나타내는 element를 반환하거나 주어진 id와 일치하는 dom요소가 없다면 null 반환 하지만 그대로 사용하면 원하지 않는 결과가 발생하는데..

💡 DOM 제어에 쓰이는 문법들 1. 문서 객체 생성과 선택 document.createElement(tagName) : 새로운 HTML 요소를 생성합니다. document.getElementById(id) : id 속성을 기준으로 요소를 선택합니다. document.getElementsByTagName(name) : 태그 이름을 기준으로 요소를 선택합니다. document.getElementsByClassName(name) : 클래스 이름을 기준으로 요소를 선택합니다. document.querySelector(selector) : CSS 선택자를 이용하여 요소를 선택합니다. document.querySelectorAll(selector) : CSS 선택자를 이용하여 모든 요소를 선택합니다. 2. 문서 ..