옥수수와 식빵 그리고 코딩

35. 라이브러리와 프레임 워크 본문

2023/생활코딩

35. 라이브러리와 프레임 워크

옥식 2023. 10. 4. 22:15

오늘날 우리는 혼자서 프로그램을 만들지 않음.

다른사람이 만든 것 위에 내가 만드는 것을 조립함. 그게 오늘날 소프트웨어의 기본

 

library VS framework

유사 : 다른사람의 도움을 받아 소프트웨어를 만듦, 다른사람과 협력하는 모델

라이브러리 : 도서관, 정리정돈, 필요한 부품이 되는 소프트웨어를 잘 정리정된 해 놓은 재사용하기 쉽게 정리해 놓은 소프트웨어. 내가 만들고 있는 프로그램에 사용할 부품을 가져오는 느낌

프레임워크 : 만들고하자는 것이 무엇이냐에 따라서, 언제가 공통적으로 필요한 것이 있고 달라지는 부분이 있는데 공통적인 부분은 프레임 워크가 만들어 놓고 달라지는 부분만 살짝 살짝 바꿔가면서 사용하는 것. 거의 반제품이라고 보면 됨.

 

javaScript 라이브러리 중에 가장 유명한 건 jQuery(제이쿼리)

아주 오래됐고 아주 안정적. 이걸 사용하면 생산성이 훨씬 올라감.

 

jquery사용 방법

CDN 검색. 자기들의 서버에 파일을 보관해두우리는 그것들을 <script scr = "파일이름.js"></script> 형식을 통해 가져옴.

CDN : Content Delivery Network 약어

먼저 본문 html파일에 jQuery태그 삽입. clolor.js 앞에

<script src="clolor.js"></script>

다음 color.js 파일 수정.

 

제이쿼리 사용하면 반복문을 사용하지 않아도 됨. 제이쿼리가 우리 대신 처리해 주니까.

var Links = { //객체라서 중괄호
setColor : function(color){
var alist = document.querySelectorAll('a') ; //어두워지면 <a>태그 글자색 하늘색으로
var i = 0;
while (i<alist.length) {
alist[i].style.color = color; //그래서 여기도 원하는 인자를 매개변수로 받기때문에 매개변수랑 동일한 값으로.
//console.log(alist[i]);
i = i+1;
}
}
}

이 코드가 이렇게 됨

var Links = { //객체라서 중괄호
setColor : function(color){
 
$('a').css('color',color);//두번째 컬러는 함수의 매개변수로 있는 컬러
}
}

제이쿼리는 $로 시작하는 함수의 형태

$('a').css('color',color);//두번째 컬러는 함수의 매개변수로 있는 컬러

웹페이지의 모든 <a>태그를 제이쿼리로 제어하겠다는 뜻

 

알아둘 것.

jQuery는 새로운 언어가 아니라 우리 대신 css라는 함수를 jQuery가 만들어 둔 것.

$.css에서 css라는 함수를 사용하면 저 함수가 내부적으로 이런 작업을 대신 처리해주고 있는 것.

 

jquery는 빠르게 성장중. 세상에 어떤 라이브러리가 있는지, 어떤 라이브러리를 사용할 수 있는 지에 따라 내가 할 수 있는 일이 달라질거임..


파일로 로직을 쪼개면, 내가 프로그램을 짤 때도 도움이 되지만 다른사람이 짠 파일을 가져올 때도 도움이 됨.

jQuery 자바스크립트에서 가장 큰 라이브러리 중 하나.

'2023 > 생활코딩' 카테고리의 다른 글

36. UI vs API  (0) 2023.10.05
34. 파일로 쪼개서 정리정돈하기  (0) 2023.10.04
33. 객체 활용  (0) 2023.10.04
30. 객체  (0) 2023.10.04
30. 객체  (1) 2023.10.03
Comments