비동기 처리 : "DB" V에서 사용하는데, "화면 변경이 없는 것"을 말한다.
프론트엔드 프레임워크의 핵심이다!
React -> 쫌 어려울수있지만 표준이 될 수 있는 언어가 될거라며 나온 언어이다.
프론트에서 Spring같은 존재자리를 두고 업계에서 오래 일할마음이 있다면 React를 공부해야한다.
inflearn 에
따라하며 배우는 노드, 리액트 시리즈 유튜브 사이트 만들기
https://www.inflearn.com/course/%EB%94%B0%EB%9D%BC%ED%95%98%EB%A9%B0-%EB%B0%B0%EC%9A%B0%EB%8A%94-%EB%85%B8%EB%93%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%9C%A0%ED%8A%9C%EB%B8%8C-%EB%A7%8C%EB%93%A4%EA%B8%B0
따라하며 배우는 노드, 리액트 시리즈 영화 사이트 만들기
https://www.inflearn.com/course/%EB%94%B0%EB%9D%BC%ED%95%98%EB%A9%B0-%EB%B0%B0%EC%9A%B0%EB%8A%94-%EB%85%B8%EB%93%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%98%81%ED%99%94%EC%82%AC%EC%9D%B4%ED%8A%B8-%EB%A7%8C%EB%93%A4%EA%B8%B0
Spring 백엔드에서 프레임워크 전쟁 EJB 비싼데, 어렵다.
어플에서 사용자가 ~~~ 했을때 ~~~ 기능을 수행하는 경우
-> 사용자가 "DB에 이미 존재하는 아이디를 입력" 했을때 기능을 수행하는 경우 DB를 확인해봐야 수행할 수 있음
원래는 이런 상황이지만
DB == M 정보를 요청 ---->> C 한테 DB 확인좀.... --->> "요청" == URL 변경 / 화면이 변경(화면이 깜빡거림)
V에서 C에게 요청을 하면 화면이 Reload 되는 것은 당연한 것이다.
비동기 처리를 한다면
C를 통해 DB(M)한테 SELECTONE 요청을 했는데도
Reload가 안됬다? ->> [비동기 처리] 이다 : V단에서 DB(M)의 정보를 화면 깜빡임없이
== 화면 변경없이
== reload 없이
== 요청없이
== URL 변경없이
받아오는 기술
미리 등록한 기능 == JS 일 확율이 높다.
//$ JQuery
//.ajax();가 JQuery에서 기본 제공하는 비동기 메서드 이다
//.ajax()는 인자로 {}를 받습니다.
// {}는 JSON타입의 형식이다.
//아래 있는 코드가 기본 형식이다.
/*
$.ajax({
type : 요청 방식,
url : 요청할 URL,
dataType : 서버에서 응답해오는 데이터의 형식,
success : 성공 후 function(){},
error : 실패(에러) 후 function(){}
});
*/
//{key : value, key : value}
//JSON 타입의 형식은 Map 객체와 유사하다!
비동기 처리할때 JSON 데이터 로드도 많이 한다.
-> 예전에는 .xml로 데이터를 주고 받았다(.xml == 익스텐스 마크업 랭기지)
예전에는 설정파일로도쓰고 데이터를 주고 받는 형식으로도 사용했다.
<xml>
<title> 기사제목</title>
<content>내용은 ㅁㄴㅇㄻㄴㅇㄻㄴ</content>
<writer>ooo 기자</writer>
</xml>
.xml >>>> .json
.xml을 안쓰고 .json 을 사용하는 이유는 가볍고 가독성이 좋아지기 때문이다.
React 등에서도 데이터를 주고받을때 JSON 형식을 사용한다!!
[{"key","value"},{"key","value"},{"key","value"},{"key","value"},...] 이런 형식으로 사용한다.
.ajax() 메서드의 인자로도 활용한다!
이클립스에 .json 파일은 없다
-> 일반 file 로 생성해서 .json을 추가하여 만들어야 한다.
'국비 내용 정리 > HTML' 카테고리의 다른 글
국비 43일차 내용 정리(Listener) (0) | 2024.09.02 |
---|---|
국비 39일차 내용 정리 (0) | 2024.08.28 |
국비 35일차 내용 정리(핸들러 맵핑) (0) | 2024.08.20 |
국비 34일차 내용정리(스프링 프레임워크의 구조) (0) | 2024.08.19 |
국비 33일차 내용정리(JS) (0) | 2024.08.18 |