API - Ajax

서버-클라이언트 통신 개녑이 어렵다 ㅠㅠㅠㅠ
내가 이해하기로는 API로 데이터를 받아올 수 있고, 클라이언트가 서버에게 요청할 때 2가지 '타입'이 있다; get과 post.

Get는 데이터 조회(Read)를 요청할 때 쓰고 Post는 데이터 생성(Create) 변경(Update), 삭제(Delete) 요청할 때 쓴다고 했는데... 음. 모르겠다... 아직 Post를 배우지 않아서 언제 get 또는 post를 사용해야 할지 감이 안온다 ㅜㅠ

그래도 Ajax 꽤 잘하는 것 같다 다행스럽게도😌

What I learned:

1. Ajax는 JQuery가 import가 되어 있어야 동작 가능
2. Ajax 기본 골격

$.ajax({
  type: "GET", // GET 방식으로 요청한다.
  url: "여기에URL을입력",
  data: {}, // 요청하면서 함께 줄 데이터 (GET 요청시엔 비움 - only for post)
  success: function(response){
    console.log(response)
  }
})

이 기본 골격에 요청할 url를 입력하고;
function(response) 안에다가 코드를 작성하면 된다

jQuery와 Ajax를 종합할 수 있다

<script>
        function q1() {
          $('#names-q1').empty()
          $.ajax({
            type: "GET",
            url: "http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99",
            data: {},
            success: function (response) {
              let rows = response['RealtimeCityAir']['row']
              for(let i=0; i<rows.length; i++) {
                let gu_name = rows[i]['MSRSTE_NM']
                let gu_mise = rows[i]['IDEX_MVL']
                let temp_html = `<li>${gu_name} : ${gu_mise}</li>`// *중요* backslash and ${}
                $('#names-q1').append(temp_html)
              }
            }
          })
        }
    </script>