220808(월)

🪴 성장일지

책 행복한 이기주의자(웨인 다이어)의 내용에 자극받아 시작하는 소박한 성장기록

살아있는 꽃과 죽은 꽃은 어떻게 구별하는가?
성장하고 있는 것이 살아 있는 것이다.
생명의 유일한 증거는 성장이다!

🌳 키워드

JavaScriptjQuery

JavaScript로 HTML 요소들을 더 편리하게 조작하기 위한 라이브러리

• 어떤 특별한 소프트웨어가 아니라 미리 작성된 코드를 모아둔 것(라이브러리)
• 사용하기 전 import 해주어야함

// 특정 요소를 감추는 기능 코드 비교

// 1. 순수 자바스크립트 😅
document.querySelector('#jayden').style.display = 'none';

// 2. 제이쿼리 활용 😱
$('#jayden').hide();

제이쿼리의 단점

1. 순수 자바스크립트보다 현저히 느린 속도
2. 코드가 간결해보이지만, 되려 코드관리가 더 어려운 경우가 많음

더 자세한 내용은 jQuery 공식문서 참고!

JavaScriptAjax

Asynchronous JavaScript and XML의 약자로, JavaScrip와 SML을 이용한 비동기적 정보 교환 기법
(비동기적인 웹 어플리케이션을 제작 시 사용하는 웹 개발 기법)

• JavaScript를 이용해서 비동기로 데이터를 주고받는 기술을 총칭
• XML이라고 명시되어있지만, 사실상 요즘엔 거의 JSON을 다룸
• jQuery를 임포트하면 사용할 수 있습니다.(단, jQuery slim 버전은 Ajax가 빠져있음!)
• 정확히는 jQuery를 통해 좀더 편하게 ajax를 사용 가능

$.ajax({
  method: 'GET', // 요청 방식
  url: '요청할 url',
  data: {}, // 서버에 보낼 데이터(GET일 땐 빈 객체)
  success: (response) => {
    console.log(response);
    // 서버의 응답(주로 JSON 형태의 데이터)을 활용할 수 있음
  },
});

개인적으로 서버와 통신하는 부분이 되게 재미있어서 놀랐다… 😱