[JS]Library와 Framwork, JQuery, UI와 API

Hyodduru ·2021년 9월 24일
0

JavaScript

목록 보기
3/60
post-thumbnail

출처 : 생활코딩 JavaScript

Library 와 Framework

Library 와 Framework 모두 다른사람의 도움을 받아 software를 만든다는 공통점을 가지고 있다.

서로 다른 점은,
Library : 재사용하기 쉽도록 data 부품들이 잘 정리되어 있는 것. 소프트웨어를 만드는 내가 라이브러리를 땡겨와서 쓰는 느낌. 자재랑 가구등 집에 필요한 재료같은 느낌.

Framework : 우리가 만들고자 하는 것이 무엇이냐에 따라서 살짝씩 수정해서 우리가 직접 다 완성하지 않아도 파일을 만들 수 있는 것. '반제품' 과도 같은 것. framework 안에 들어가서 우리가 직접 작업하는 느낌. 이미 집의 수도나 뼈대같은 기본적 구조가 있어서 입맛대로 꾸미기만 하면 되는 느낌.

JQuery

JQuery : Javascript 의 Library. 안정적이고 오래되었다.

JQuery 다운 받는 법
-> JQuery site 접속 -> google CDN 들어가서 최신 code 받기 -> code를 script 태그 위에 붙여넣기

JQuery 문법

ex)colors.js 내의 코드들 더 간단하기 만들기

SetColor : function(color){
var alist = document.querySelectAll('a')
var i = 0
while ( i < alist.length){alist[i].style.color = color;
i = i+1;}}

위의 코드를 아래와 같이 대체할 수 있다.

SetColor : function(color){
$('a').css('color',color)}

$('a') : 이 웹페이지에 있는 모든 a태그들을 JQuery로 제어하겠다는 의미.
css('color',color) 내의 앞에 있는 'color'은 alist[i].style.color 의 color,
뒤에 있는 color는 매개변수를 통해 들어온 color값을 뜻함.

{document.querySelector('body').style.color = color}

또한

{$('body').css('color',color)} 으로 대체 가능.

{document.querySelecor('body').style.backgroundColor = color}

은

{$('body').css('color',color)} 으로 대체 가능하다.

UI 와 API

UI : user interface, 사용자가 system을 제어하기 위해 사용하기 위한 화면에 보이는 조작장치. 사용자와 컴퓨터와의 상호작용 방식.
API : application programming interface, application을 만들기 위해 programming을 할 때 사용하는 조작장치. 응용프로그램과 커뮤터 운영체제와의 상호작용형식 ex)alert

추가 꿀팁들

  • tag를 삭제하고 싶거나 어떤 tag의 자식tag를 추가하고 싶다면,
    document를 유사히 볼 것! 객체 내에 method가 포함되어있을 가능성이 있다.
    만약 document에서 찾을 수 없다면,
    DOM객체 이용하기. (Document Object Model)
    더 큰 window 객체도 이용 가능.
  • ajax : 웹페이지를 reload하지 않고 정보를 변경하고 싶을 때 사용가능
  • cookie : reload하더라도 현재상태 유지하고 싶을 때 사용가능
  • offline web application : 인터넷이 끊겨도 동작하는 웹사이트
  • webRTC : 화상통신 앱 웹
  • Speech 로 시작하는 API : 사용자 음성인식, 음성으로 정보를 전달하고 싶을 때
  • webGL : 3차원 그래픽으로 game과 같은 것 만ㄷ르고 싶을 때
  • webVR : 가상현실
profile
꾸준히 성장하기🦋 https://hyodduru.tistory.com/ 로 블로그 옮겼습니다

0개의 댓글