본문 바로가기

TIL

TIL) Ajax 활용, JSON 파일, jQuery 몇 몇 구문

1. Ajax란

클라이언트는 서비스를 이용하기 위해 서버로부터 데이터를 받아와야 한다.

Ajax는 이를 위한 JavaScript의 라이브러리 중 하나이며, 비동기 서버 통신방식이다.

즉, JavaScript를 통해 서버에 데이터를 요청하고 받는 기술이다.

 

2. Ajax를 사용하는 이유

Ajax는 비동기 서버통신 기술이라고 했다. 비동기란, 페이지 전체를 새로고침 하지 않아도 작업을 수행할 수 있는 것을 말한다. 따라서 전체 페이지가 아닌 일부만 업데이트 할 수 있다. 이는 곧 자원과 시간의 절약으로 이어지게 되고 결국 웹페이지의 속도와 반응성이 빨라지게 된다. 

 

3. Ajax 활용 예시

jQuery를 활용해 ajax를 사용해보자. 

 

4. JSON 파일이란

웹 페이지 상의 데이터를 가져올때 JSON 형태로 가져오는 경우가 많다.

JSON이란 무엇일까?

JSON은 경량화 되어있는 하나의 데이터 교환 형식이다. XML보다 더 가볍게 만들어졌다. 

기본적으로 name/value 형태의 구조를 갖고 있다.

 

5. jQuery document ready (참고: twinsoul.tistory.com/74)

jquery를 쓸 때 제일 처음에 쓰는 $(document).ready(function(){}) (참고로 $(function(){}) 으로 줄여 사용할 수도 있다)

이건 무슨 뜻일까? 우선 아래 그림을 살펴보자.

웹 페이지 동작을 나타낸 그림 (출처: https://docu94.tistory.com/37)

$().ready(function(){})구문은 개발자로 하여금 어떤 함수 또는 코드가 호출, 실행되는 시점을 스케줄링 할 수 있게 해준다. $(document).ready(function(){}) 구문은 그 시점이 바로 문서객체모델(DOM)이 모두 로딩되었을 때를 의미하며 그 이후 괄호() 안의 코드를 모두 실행되게 만드는 것이다.