자바 스크립트란 웹페이지를 움직일 수 있도록 해주는 것이다. 일일히 자바 스크립트를 입력하기엔 불편하고 어려우므로 이를 편리하게 사용할 수 있도록 미리 작성된 라이브러리를 jQuery라고 한다.
jQuery를 사용하기 위해서는 라이브러리를 사전에 임포트해야하므로 새로운 문서를 작성할때는 반드시 잊지 말고 미리 임포트해야한다.
이번에 배운 것으로는 API를 통해 받은 JSON에서 필요한 데이터만 추출하고 필요한 곳에 붙이는 방법을 학습했다. JSON에서 데이터를 받으면 리스트와 딕셔너리 방식으로 표현하고 있는데 마치 엑셀 시트(표)를 보고 있는 것 같다.
이번 학습에서 배운 것들 중 자주 사용하게 될 코드를 정리해 두었다.
//사전에 정의된 변수의 리스트를 i 에 대입하여 순서대로 명령을 처리
var.forEach((i) => {
code
})
//id의 영역에 지정한 변수의 값( html )을 삽입하는데 사용
$('#id').append(var)
//id의 영역을 지정한 변수의 값 (html)으로 치환하는데 사용
$('#id').text(var)
//API에서 데이터를 가져오기 위한 코드
fetch("URL").then(res => res.json()).then(data => {
code
})
//별도의 입력 없이 페이지가 로드되면 자동으로 실행되는 코드
$(document).ready(function () {
code
})
//id의 영역을 비워주는 코드
$('#id').empty()
사전에 정의된 jQuery를 이용해서 내가 사는 지역의 미세먼지 농도를 확인하거나, 기온을 확인하는 등 다양한 활용 방법을 배울 수 있었다.
앞으로 배워야할 것이 산더미 같지만 직접 결과물을 보면서 많이 부족하더라도 완성된 페이지를 보는 것은 상당히 즐거운 것 같다.
'일기' 카테고리의 다른 글
Github를 이용해서 블로그 만들기 <jekyll> (0) | 2023.04.09 |
---|---|
<개발일지> -5- 웹 개발 첫걸음 (AWS에 서비스 배포하기 .whit Error) (0) | 2023.02.21 |
<개발일지> -4- 웹 개발 첫걸음 (Flask로 API 만들기) (0) | 2023.02.19 |
<개발일지> -3- 웹 개발 첫걸음 (DB와 Python 기초 ) (0) | 2023.02.17 |
<개발일지> -1- 웹 개발 첫걸음 (HTML, CSS) (0) | 2023.02.16 |