JavaScript
정의. 브라우저가 알아들을 수 있는 프로그래밍 언어
타입.
// 리스트 타입
list = [value1, value2, value3, ...]
// 딕셔너리 타입
list = {key1:value1, key2:value2, key3:value3}
// 혼합
list = {key1:[value1, value2], key2:[value3,value4]}
반복문.
list.forEach((data)=>{
// logic
}
조건문.
if(condition) {
// logic
} else {
// logic
}
JQuery
정의. HTML의 요소들을 편리하게 조작을 할 수 있도록 해주는 JavaScript 라이브러리
JQuery 기능.
// 조작 대상 지정
$('#id이름')
// 문자 대체하기
$('#id이름').text('문자')
// 문자 추가하기
$('#id이름').append('문자')
// 조작 대상 내부 내용 지우기
$('#id이름').empty();
Fetch
정의. JavaScript에서 서버로 네트워크 요청을 보내고 응답을 받을 수 있도록 해주는 매서드
GET 요청.
fetch("URL", { method: 'GET' });
POST 요청.
fetch("URL", {
method: "POST",
body: JSON.stringify({
key1: value1,
key2: value2,
...
}),
})
JSON
정의. Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷으로
서버와 클라이언트간 데이터를 주고받을 때 사용
Json 예시.
// 서울 실시간 기상 API 응답
{
RealtimeCityAir: {
row: [{
ARPLT_MAIN: "O3",
CO: 0.4,
IDEX_MVL: 31,
IDEX_NM: "좋음",
MSRDT: "201912052100",
MSRRGN_NM: "도심권",
MSRSTE_NM: "중구",
NO2: 0.015,
O3: 0.018,
PM10: 22,
PM25: 14,
SO2: 0.002
},
{
ARPLT_MAIN: "PM25",
CO: 0.4,
IDEX_MVL: 39,
IDEX_NM: "좋음",
MSRDT: "201912052100",
MSRRGN_NM: "도심권",
MSRSTE_NM: "종로구",
NO2: 0.016,
O3: 0.013,
PM10: 24,
PM25: 18,
SO2: 0.003
}
]
}
}
- Chrome Extension (Json Viewer)
좋았던 점
실제 API를 가지고 데이터를 불러와 사용해 보는 것이 도움이 되었다. Chrom에서 사용하는 Json 확장 플러그인을 소개해줘서 편하게 데이터들을 확인할 수 있었다. 마지막으로 API를 가져와 페이지에 데이터를 실시간으로 적용해 보는 숙제가 있어서 전체 강의를 복습하는 시간을 가질 수 있었다.
'개발공부 > 스파르타코딩' 카테고리의 다른 글
[ 정규 ] Java 문법 종합반 1주차 (0) | 2023.06.12 |
---|---|
[ 사전스터디 ] 웹개발 종합반 5주차 (0) | 2023.06.05 |
[ 사전스터디 ] 웹개발 종합반 4주차 (0) | 2023.06.04 |
[ 사전스터디 ] 웹개발 종합반 3주차 (0) | 2023.06.03 |
[ 사전스터디 ] 웹개발 종합반 1주차 (0) | 2023.06.01 |