길벗 코딩 자율 학습단 6주차

웹에서 요청 보내는 javascript 문법

●  document.querySelector() : 웹 페이지에서 특정 요소(버튼)을 찾아 반환

자료형 변수명 = document.querySelector("#id_값");

●  addEventListener() : 특정 요소에 이벤트가 발생(버튼 클릭)했을 때 특정 동작(댓글 객체 전달)을 수행

요소명.addEventListener("이벤트_타입", 이벤트_처리_함수)

●  fetch() : 웹 페이지에서 REST API 요청을 보냄 :  HTTP 통신을 하는데 사용

fetch('API_주소', {
	method: 'POST',		//요청 메서드(POST, GET, PATCH, DELETE)
    headers: {			//헤더 경로
    	"Content-Type": "application/json"
    },
    body: JSON.stringify(객체)		//전송 데이터
  }).then(response => {			//응답을 받아 처리하는 구조
    응답_처리문;
  });

 

 

 

자바스크립트에서 객체를 만드는 방법

●  생성자 함수 방식

●  Object.create()

●  객체 리터럴 방식

    : 객체를 변수로 선언해 사용하는 방식

var object = {
	key1: value1,
    	key2: value2
}

 

 

모달 (modal)

웹 페이지에서 새 창을 띄우는 팝업 창과 달리 같은 웹 페이지 내부에서 상위 레이어를 띄우는 방식

 

데이터 속성

HTML 요소에 추가 정보를 저장하고 싶을 때 사용 / 'data-' 로 시작함 / 개수에 제한이 없음

 

 

(++)

인메모리 데이터베이스

데이터를 디스크가 아닌 메모리에 저장

→ 데이터 접근 속도가 빠름

→ 서버를 껐다 켜면 작업한 데이터가 날라감

 

외부 DB 연동

1. DB 설치

2. DB와 관련된 드라이버 스프링 부트에 추가

3. 스프링 부트에 DB 연동 설정 작성

---

자율 학습단을 하기 전에는 스프링부트의 스도 모르는 감자였는데,,

이제는 그래도 api작성까지 나름 해낼 수 있게 성장한 자신이 뿌듯하고 밀리지 않고 계획대로 6주간 완성해내서 기쁘다!

이제 여기서 더 발전할 수 있도록 노력하자:)

완성~~!

---

출처

https://www.yes24.com/Product/Goods/119952151

코딩 자율학습 스프링 부트 3 자바 백엔드 개발 입문 - 예스24