Sparta Coding Club/웹개발 종합반 [항해 99]

웹개발 종합반, 왕초보 시작반 2주차. JS, jQuery 그리고 Ajax

김쨔뿌 2021. 8. 2. 23:46

jQuery..

순수 자바스크립트의 짜증나는 그 길고 긴~ 문장을 함축시켜주는,

귀차니즘과 저하된 기억력으로 괴로운 이들에겐 정말 빛과 소금같은 존재 아닐까?

 

순수 자바스크립트로 할 때는 '도큐먼트..어쩌구..저쩌구..뭐더라..' 이러던걸

$('') 이걸로 끝내버린다니.

 

물론 나처럼 실무학원갔다가 제이쿼리 위주로 수업을 받아버린 나머지 막상 자바스크립트 실력은 저~기 아래 심해와 같을수도 있다.

하지만 제이쿼리, 너무 편리하다. 요즘 인터넷 찾아보면 제이쿼리도 이제 한물 갔다는데... 안돼!! 가지마!!!

 

아무튼, 자바스크립트와 제이쿼리는 그렇다치고..

 

2주차의 하이라이트, Ajax.

 

어디서 많이 들어본 이름이지만 이게 뭔지 하나도 몰랐다. 어쩐지 간지나니 어디가서 아는척 하고싶다고 생각했다.

Ajax란 무엇인가? 

 

"Ajax(Asynchronous JavaScript and XML, 에이잭스)는 비동기적인 웹 애플리케이션의 제작을 위해 아래와 같은 조합을 이용하는  개발 기법이다." _출처 : 위키백과

 

...뭔 소리일까. 

제공된 API 링크를 주소창에 넣어보니 요상한게 뜬다.

저 url 옆의 주소는 고양이의 이미지 주소이다.

이게 뭘까하니.. "새로고침 할때마다 실시간으로 업데이트 혹은 랜덤하게 내용을 가져와주는" 거라고 한다.

대충 그렇다. 미세먼지 농도로 실시간으로 불러와주고 자전거인 따릉이가 어디에 얼마나 배치되어있는지도 불러와주고..

 

쩐다. (저급한 언어 죄송합니다. 아무도 안보겠지만.)

 

이걸 통해 뭘 만드냐?

저 내용에서 url 만 가져와 버튼을 누르면 랜덤으로 변경되는 고양이 이미지를 가져올 수 있다. 

혹은 미세먼지 농도 API에서 각 구의 이름과 해당 구의 미세먼지 농도를 가져와 리스트업시킬 수 있다.

 

업데이트 버튼을 누르면 환율이 업데이트 된다.

https://jjubbu.github.io/ajaxHW 

깃헙에 저장용으로 올려놓았지만.. 이상하게 환율쪽이 안보인다. 노트북에서 파이참으로 작업할때는 보이는데 왜일까. 인터넷 뒤져보니 무슨 시큐리티 어쩌구 문제라고 한다. 이걸 질문하고싶은데.. 즉문즉답 워크스페이스.. 쓰는 방법을 모른다. 알게되면 아래에 수정내용을 추가해야지.

 

환율API

 

jjubbu.github.io