토막글

2022-01-10 TIL

케굴 2022. 1. 10. 23:36

방 알아보고, 알바하고 이래저래 바빠서 휴식후 오늘에야 복귀했다. 

다시 이번주 화이팅! 

 

노마드 코더의 zoom 클론 코딩을 듣고 있는데 , 아무래도 바닐라 자바 스크립트는 공부하지 않아서 어려운 부분이 조금 있다.  그래서 이해가 안가는 부분이 나오면 모아서 정리하고자 한다. 

 

 

1. Document.createElement() 

자바 스크립트를 이용해 동적으로 html 구문을 생성해 준다. 

 

js

var newDiv = document.createElement("div");
var newContent = document.createTextNode("환영합니다!");
newDiv.appendChild(newContent);

HTML

  <div id="div1">위의 텍스트는 동적으로 추가했습니다.</div>

 

2. li , ul

ol , ul, dl 등의 순서 목록의 리스트 아이템을 <li> </li> 태그를 이용하여 감싼다 

 

3. Frontend  console.log 

app.js 에서는 console.log를 하면 web 콘솔에 콘솔 로그가 뜬다

 

4.  Websocket 

 

지금까지 Websocket 을 이용하여 채팅을 만들어 보았다. 그런데 소켓을 통해서 text 만 보낼 수 있는 불편함이 있었다.

또한 Websocket이 최소한의 기능만을 지원하기 때문에 개발자가 많은 코드를 짜야한다. 

그래서 실제 개발에서는 Socket.io라는 프레임워크를 사용한다고 한다.

 중요한 점은 socket.io는 web socket의 부분이 아니라 , 오히려 websocket을 실시간 연결의 도구중 하나로 사용한다.

만약에 web socket 을 실행할 수 없는 환경이면 socket.io는 다른 기능을 사용하여 해당 환경에서도 socket기능을 사용할 수 있게 도와준다.