본문 바로가기
React/Web

2. JQuery, Ajax, API

by imagineer_jinny 2021. 2. 27.

**구글링 잘하는 꿀팁**

ex. css border w3schools

     css border mdn

 

 

JQuery란?

HTML의 요소들을 조작하는, 편리한 Javascript를 미리 작성해둔 것. 라이브러리!

 

jQuery는 미리 작성된 Javascript 코드임. 짜둔 코드를 가져와서 사용하는 것이기 때문에, 쓰기 전에 "임포트"를 해야함.

 

 

-JQuery CDN

 

jQuery Get Started (w3schools.com)

 

jQuery Get Started

jQuery Get Started Adding jQuery to Your Web Pages There are several ways to start using jQuery on your web site. You can: Download the jQuery library from jQuery.com Include jQuery from a CDN, like Google Downloading jQuery There are two versions of jQuer

www.w3schools.com

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

 

이거 복사해서 <head></head>안에 넣어주고 쓰면 됨!

 

 

서버-클라이언트 통신 이해하기

데이터를 클라이언트가 서버에게 요청을 하면 서버가 클라이언트에게 데이터를 가져가라고 한다.

이걸 내려줄 때 포멧이 있는데 이 포멧을 JSON이라고 한다!

 

이 포멧을 보기 쉽게 만들어주는 것: JSONView

chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=ko

 

JSONView

Validate and view JSON documents

chrome.google.com

클라이언트-서버 : GET 요청 이해하기

 

API는 은행 창구와 같은 것!

같은 예금 창구에서도 개인 고객이냐 기업 고객이냐에 따라 가져와야 하는 것 / 처리해주는 것이 다른 것처럼, 클라이언트가 요청 할 때에도, "타입"이라는 것이 존재함!

 

* GET → 통상적으로! 데이터 조회(Read)를 요청할 때 예) 영화 목록 조회

* POST → 통상적으로! 데이터 생성(Create), 변경(Update), 삭제(Delete) 요청 할 때

예) 회원가입, 회원탈퇴, 비밀번호 수정

 

 

Ajax란?

 

Ajax는 jQuery를 임포트한 페이지에서만 동작 가능함!

 

*Ajax 기본 골격

 

 

'React > Web' 카테고리의 다른 글

FlexBox 이해하기  (0) 2021.05.08
5. API 연습하기  (0) 2021.03.02
4. Flask, API 만들기  (0) 2021.03.02
3. Python, pymongo, mongoDB  (0) 2021.02.28
1. 웹의 동작 개념 / HTML, CSS, Javascript  (0) 2021.02.25

댓글