[JS] 라이브러리와 프레임워크

다른사람이 만들어놓은 소프트웨어를 부품을 소비해서

내가 만들고 있는 소프트웨어에 생산자가 되는 방법을 알아볼 것이다.


키워드:
library VS framework

-  library  :  내가 만들고자하는 프로그램에 필요한 부품들이 되는 소프트웨어를

재사용하기쉽도록 돼 있는 소프트웨어. (내가 만들고잇는 프로그램의 부품을 가져오는 느낌)
-framework  :  만들고자 하는게 잇을때 (게임,웹,채팅 등) 만들고자 하는게 무엇인지에 따라서

그것을 만들려고 할때 공통적인것, 달라지는 것이 존재할 것인데, 이 부분을 살짝살짝 수정하는 것. (framework안에 들어가서 우리가 작업하는 것)


<Library>

▶jQuery : 안정적, 생산성↑

-  jQuery 이용하면 반복문 안써도 된다. 우리 대신에 jQuery가 알아서 처리해줌.
-  https://jquery.com/ (다운받을 수 있음)
-  CDN(Content Delivery Network)
    :  많은 libaray들이 CDN을 통해서 자기들의 서버에 파일 보관 후 script src를 통해 가져갈 수 있도록 하는 방식을 취하고있다. (사용료도 자기들이 다 낸다고함)

 

 

경로  :  jQuery홈페이지 - 다운로드 - 아래로 스크롤 - Google CDN

 

 

구글에서 제공하는 jQuery의 최신버전을 내가 만든 시트에 복붙했다. (HTML3)

 

 

📍jQuery 응용하기

 

color.js 파일들어가서

// 슬래쉬를 사용해 초록색 부분을 주석으로 만들어줬다.

 

 

$('a');

-  jQuery는 $로 시작한다.
- 이 웹페이지에 있는 모든 a태그를 제이쿼리로 제어하겠다라는 의미.

제이쿼리에서css를 바꾸고 싶다면
*검색:  jQuery css

 

이런 css함수가 나오고

 

 

사용법은 이러하다.

 

 

 

📍jQuery를 이용해서 css를 바꾸는 방법

$('a').css('color',color)

- 매개변수로 들어온 color값을 두 번째로. 

 

- 출력된 결과를 보면 링크된 텍스트도 흰색으로 변한다. 이것은 jQuery가 잘 작동하고 있다는 것을 의미한다.
-  jQuery는 새로운 언어가 아니다. 자바스크립트이용해서 우리대신 css라는 함수를 jQuery가 대신 처리해준다.



jQuery로 변환하기

document.querySelector('body').style.color=color; ▶$('body').css('color',color);

:  모든 body의 값에 대해서 css 컬러값을 컬러로 한다.