JavaScript(Bootstrap&UI) Bootstrap이란? 프론트엔드의 요소를 모아놓은 라이브러리이며 우리가 좀더 쉽게 가져다가 사용할 수 있게 만들어준 라이브러리예요. 우리는 Bootstrap에서 제공해주는 소스를 복사해서 HTML을 개발하면 되요. ※ 프론트엔드 요소(component) : 메뉴, 대문, 모달창, 폼 등등 Bootstrap 사용법 구글 검색창에 Bootstrap이라고 검색을 하셔서 제일 첫번째로 보이는 링크로 들어가주시면 되요. (링크 클릭하셔도 들어가실 수 있어요. https://getbootstrap.com) 링크를 클릭해서 들어가시면 아래와 같은 페이지를 보실 수 있어요. 오른쪽 상단의 Download 버튼을 클릭해주세요. 검색을 할 수 있는 페이지로 변경이 되고 버전도..

jQuery를 쓰는 이유 1. 자바스크립트보다 코드가 짧다. // JavaScript document.getElementsByClassName('greeting').innerHTML = '안녕'; // jQuery $('.greeting').html('안녕'); 자바스크립트와 제이쿼리 코드를 비교해 보시면 제이쿼리 코드가 훨씬 짧은걸 볼 수 있어요. 2. 자바스크립트로 못하는 것을 제이쿼리로 할 수 있다. 안녕하세요 안녕하세요 안녕하세요 버튼btn 버튼btn 위와 같이 동일한 class의 요소를 자바스크립트로 바꿔야 할 때 어떻게 해야될까요? ※ class 이름은 중복이 가능 / id 이름은 중복 불가능 document.getElementsByClassName('greeting')[0].innerHTML..

JavaScript(jQuery) jQuery 란? 자바스크립트를 짧고 더 편하게 사용할 수 있게 해주는 기능이예요. jQuery를 사용하면 코드 양이 절반으로 줄어들게 되어서 빠르게 작성할 수 있어요. React(jQuery를 좀 더 사용하기 쉽게 만들어준 기능)를 많이 배우고 있지만 아직까지는 jQuery가 더 많이 사용되며 jQuery로 개발된 사이트가 엄청 많기 때문에 공부하면 도움이 될 거예요. 2006년에 자바스크립트로 웹 개발을 하던 개발자가 자바스크립트 코드가 너무 길다고 생각을 했어요. 그래서 JS를 짧고 쉽게 작성할 수 있는 코드를 만들어서 쓰기 시작했고 그 코드를 웹에 올려서 공개를 했어요. 그렇게 공개된 코드가 jQuery예요. jQuery 사용법 jQuery는 라이브러리를 설치해서..

JavaScript(document&DOM) JavaScript 문법에서 사용되는 document, 그리고 DOM에 대해서 다뤄보도록 할께요. 문서 객체 모델 DOM(Document Object Model) ▷ 문서 객체 모델 DOM(Document Object Model)이란? 문서 객체 모델 / 도큐먼트 객체 모델은 문서에 대한 모든 내용을 담고 있는 객체예요. 브라우저는 HTML 페이지를 로드하는 과정에서 HTML 태그들을 각기 하나의 객체로 만들어요. 따라서 DOM은 HTML 태그당 하나씩 있으며 이름은 태그 이름과 같아요. 예) ~ 로 구성된 요소 - p 객체 / 로 구성된 요소 - div 객체 이와 같이 HTML 문서의 각 요소를 객체화 한 것이 HTML DOM 객체예요. ▷ DOM의 목적 -..