정의 웹 페이지 화면을 개발하기 위한 프런트엔드 프레임워크 single page application 개발 시 사용된다. * single page application : header, footer 등 동일한 화면 제외하고 변경되는 부분만 로드할 때, 빠른 속도와 트래픽 감소 효과. 즉, html, css, script를 한 파일로 관리한다. 장점 낮은 학습 곡선 : 실무자는 3시간, 입문자는 2~3일 내에 학습이 가능 우수한 성능 : React와 Angular에 비해 성능이 우수하고 빠름 라이벌 프레임워크의 장점을 흡수 : React와 Angular의 장점을 결합 낮은 진입 장벽 : ES6, 웹팩 등의 새로운 기술을 몰라도 학습 가능 Vue instance 생성 new Vue({ }) Vue insta..

자바스크립트의 동작 순서 입력 ➡가공➡출력 자바스크립트 기본 문법 객체, 메서드, 매개변수 '🟠🟠가 🔺🔺을 🟧🟧해라' 🟠🟠: (영어의 주어) 객체 Object 🔺🔺: (영어의 목적어) 매개변수 Parameter 🟧🟧: (영어의 술어) 메서드 Method console.log('test'); console은 log 해라 test를 console : 객체 log : 메서드 'test' : 매개변수 * 메서드는 ()가 꼭 필요하다. 매개변수는 메서드 지시에 필요한 추가정보. 프로퍼티 🟠🟠객체의 ❇❇은 🧡🧡이다 🟠🟠객체의 ❇❇을 🧡🧡로 한다. ❇❇: 프로퍼티, 객체의 상태를 나타낸다 🧡🧡:프로퍼티 값 document.getElimentById('choice').textContent = new Date(); co..

기본 $.ajax(option) $.ajax(url, option) $.ajax({ url: "", type: "", dataType: "", data: "", success: function(data) { } }) * option 1. url : 불러올 파일명 2. type : get, post 방식 3. dataType : 불러올 파일의 종류(txt,html,xml,json,script) 4. data : 데이터 5. success : 데어터가 성공적으로 불려왔을때 실행할 메서드 6. async : 동기, 비동식 방식 지정( * Ajax를 사용하는 이유 ) $(function(){ $(".btn").on("click",function(){ $.ajax("02-load-html.html") .done(..

AJAX (Asynchronous Javascript And Xml) 비동기식 자바스크립트와 xml. xml 객체를 이용하여 페이지의 일부만 수정하여 전체를 새로 고치지 않아도 일부만 로드할 수 있다. * 비동기 방식 : 웹페이지를 전체 리로드하지 않고 데이터를 불러오는 방식 데이터 형태 1. TEXT.txt 2. HTML.html 3. XML.xml 4. JSON.json 5. script.js 6. php, asp, java 장,단점 장점 1. 웹페이지의 속도향상 2. 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다. 3. 서버에서 Data만 전송하면 되므로 전체적인 코딩의 양이 줄어든다. 4. 기존 웹에서는 불가능했던 다양한 UI를 가능하게 해준다. ( Flickr의 경우, 사진의 제목이..

XML Extensible Markup language html와 매우 흡사한 마크업 언어, 데이터를 저장하고 전달할 목적. 예제 과일 귤 100000 야채 배추 3000 JSON 자바스크립트에서 파생. 유연하게 정보를 저장, 구조화 할 수 있다. 자바스크립트 구문 형식을 따른다. 역시 변수 이름은 한글이 아닌 영문자로 사용할 것. { "변수명":"데이터", "변수명":[ "값1", "값2", "값3" ], "변수명":{ "변수":데이터1, "변수":데이터2, "변수":데이터3 } } { "변수명":"데이터", "배열명":[ "값1", "값2", "값3" ], "다중배열":{ "변수":"데이터", "변수":"데이터", "변수":"데이터" } } 예제 { "name":"홍길동", "age":18, "gen..

정규표현식 Regular Expression Regex, Regexp 등으로 불림. 문자열을 검색하고 대체하는 형식 패턴. 역할 search replace extract 생성하기 1. 리터럴 방식 var 패턴이름 = /표현식/플래그/; 2. 객체 생성 방식 var 패턴이름 = new RegExp("표현식","플래그"); Method 주로 exec와 test를 많이 사용. exec 문자열 찾기, 정보를 가진 배열 반환 test 문자열 검사, true or false 반환 //1. 리터럴 방식 var pattern1=/a/; //2. 객체 생성 방식 var pattern2=new RegExp("a"); var pattern3=/k/i; //i: 플래그, 대소문자 구분 없음 //3. 문자열 변수 var str..