-
항해 99 5기 TIL_20항해 99 2022. 1. 30. 01:38
▶ Today I Learned
<CS 스터디>
그동안 동기와 비동기라는 개념을 반대로 이해하고 있었다..
동기가 동시에 여러가지가 일어나는 것이라 생각했는데 다시보니
한 작업의 결과가 나올 때까지 대기하는 것이 동기이며
결과가 나올 때까지 다른 일을 해주는 것이 비동기였다.
그럼 ajax는 response가 올 때까지 기다려야하니까 비동기인 것이라고 할 수도 있다.
하지만 ajax는 동기이다.
필요한 데이터를 받아올 때 페이지 전체를 업로드하고서 그다음 받아오는 것이 아닌 ajax로 요청해서 딱 그 부분만 받아올 수 있기 때문이다.
상세한 설명은 아래 링크를 참조했다.
https://private.tistory.com/24
https://sjparkk-dev1og.tistory.com/27
<홈페이지 구현 - 숙련>
[node app.js 미실행]
파일을 처음 만들고 코드를 붙여넣은 뒤 한번 실행해보았다.
하지만 서버가 실행되지 않았는데 심지어 커맨드를 입력해도 오류조차 나오지 않았다..
알고보니 이는 파일을 저장하지 않은 채 실행해서 파일의 실행자체가 안되었던 것이다..!
한동안 긴가민가했는데 이것도 사용시 파일을 command + s를 통해 저장해주어야 하나보다.
업데이트 할 때마다 꾸준히 저장해야지..!
[Ajax vs Axios vs fetch]
해당 링크를 참조해보았다.
지난번 클라이언트-서버 간의 통신은 모두 Ajax로 구현하였다.
이번에는 튜터님께서 추천해주신 fetch와 Axios중에 하나 이상을 사용해보려한다.
fetch는 내장 라이브러리이기에 별도의 다운로드가 필요없으며 불안정한 프레임워크에서도 잘 작동한다는 점,
Axios는 크로스 브라우징에 신경을 써서 브라우저 호환성이 더 좋다는 점이 장점인 듯하다.
둘다 Promise 기반이기에 다루기 쉽다는 것은 공통적인 장점이라고 한다.
▶ 느낀 점
현재 새롭게 짜보는 홈페이지는 이미 짜두었던 것에서 ajax를 axios로 바꾸는 것이기에 그리 어렵지 않았다.
중간에 문법에 대해 애매한 부분이 있었지만 팀원 분들의 도움으로 쉽게 이해할 수 있었다.
내일 마저 더 구현하고 이제 새로운 기능들을 추가해보아야겠다..!
화이팅팅!!
▶ 공부 시 참고 링크들
https://ko.javascript.info/fetch
https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
'항해 99' 카테고리의 다른 글
항해 99 5기 WIL_3 (0) 2022.01.30 항해 99 5기 TIL_21 (0) 2022.01.30 항해 99 5기 TIL_19 (0) 2022.01.29 항해 99 5기 TIL_18 (0) 2022.01.28 항해 99 5기 TIL_17 (0) 2022.01.27