Coding Feature.

JS #6 파일 쪼개서 정리, 라이브러리와 프레임워크, UI와 API, 그 외 본문

생활코딩 독학/WEB2 - JavaScript

JS #6 파일 쪼개서 정리, 라이브러리와 프레임워크, UI와 API, 그 외

codingfeature 2023. 1. 9. 18:55

<script>

(코드내용)

</script>

 

(코드내용)을 그대로 (파일명).js로 만든다.

 

코드 내용이 쓰여질 <script>에

<script src="(파일명).js"></script>를 작성하면 파일명.js에 담긴 JS 코드를 불러온다.

 

 

라이브러리, 프레임워크

JS 라이브러리:jQuery

CDN 통해서 불러오기 가능.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

를 <head>에 추가

 

'Ctrl+/'를 누르면 드래그 한 부분 주석 처리 가능.

 

jQuery 이용해서 반복문 없애기.

while(i<links.length){
        links[i].style.color = 'white';
        i++;
    }

를

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

로 변경.

$('a')는 현재 웹페이지의 모든 a 태그를 jQuery가 제어함을 의미.

 

 

 

UI와 API

유저 인터페이스

Application Programming Interface

 

<input type="button" value="click me" onclick="alert('Hello World')">

이때 나타나는 버튼은 UI

버튼을 누를 때 나타나는 경고창을 뜨게 만드는 alert은 API

 

API를 JS로 매개해서 사용하여 웹사이트를 제작한 것.

 

 

프로젝트를 할 때 객체 등 모든 개념을 총동원하려고 하지마라.

최소한의 필수적 요소를 먼저 도입하고 조금씩 조금씩 발전시켜라.

한계를 만났을 때 구글링을 통해 배우는 것.

 

웹페이지 제어는 document 객체와 DOM(Document Object Model)과 그 메소드에 대해 공부하는 것을 추천.

웹 브라우저 자체 제어(주소 등)는 window 객체에 대해 공부하는 것을 추천.

웹 페이지의 정보 변경은 ajax 객체 공부.

웹 페이지 리로드 시 정보 그대로 유지 원하면 cookie 공부.

인터넷 없이 동작하는 웹 페이지는 offline web application 공부.

화상 통신 웹 앱은 webRTC.

사용자 음성 인식은 speech.

3차원 그래픽, 게임은 webGL.

가상현실은 webVR.

'생활코딩 독학 > WEB2 - JavaScript' 카테고리의 다른 글

JS #5 객체  (0) 2023.01.09
JS #4 함수  (0) 2023.01.09
JS #3 배열, 반복문  (0) 2023.01.09
JS #2 데이터 타입, 변수, 태그 선택, 조건문, 리팩토링  (0) 2023.01.08
JS #1 HTML과 JS의 만남.  (0) 2023.01.08
'생활코딩 독학/WEB2 - JavaScript' Related Articles more