Song Minu

v-model (양방향 데이터 바인딩) 양방향 데이터 바인딩으로 주로 폼과 입력을 다룰 때 사용한다. 모델이 업데이트되면서 뷰가 업데이트되고, 뷰가 업데이트되면서 모델이 업데이트될 때 작동한다. 이로 인해 애플리케이션 모델의 데이터가 UI와 항상 동기화 할 수 있다. {{message}} input 창에 데이터를 입력해보면 v-model로 message가 바인딩되어 있어서 바로바로 입력한 값이 나온다. 입력할 때마다 변경되는 것 말고 다 입력한 후에 변경하고 싶으면 수식어로 ".lazy"라는 걸 사용할 수 있다. {{message}} 이렇게 하면 모두 입력 후 포커스가 input 창에서 벗어나면 그때 변경된다. v-once (단방향 데이터 바인딩) 하나의 요소나 컴포넌트를 딱 한 번만 렌더링 한다. 렌더..

둘의 차이점 - computed (계산된 속성) 1. 어떤 값을 파생하려고 할 때 유용하다. 2. 기본값이 업데이트될 때마다 값이 자동으로 업데이트 된다. 3. 루프가 변경되지 않아도 다시 계산할 필요가 없는 값을 반복적으로 계산하지 않기 위해 캐싱된다. 4. 매개변수를 받을 수 없다. - methods (메서드) 1. Vue 인스턴스에 바인딩된 함수 2. 명시적으로 호출될 때만 실행된다. 3. 매개변수를 받을 수 있다. 4. 자바스크립트 함수가 필요한 동일한 상황에서 유용하다. 버튼을 눌러 count를 1씩 올리는 걸 computed와 methods를 쓰는걸 한번 해보자... computed로 count 올리기 {{ computedCount }}add computed를 쓴 소스 computed로 cou..

var cnt = 0; $scope.test1 = function () { console.log("$scope.test"); cnt++; if (cnt > 10) { $scope.stop(); } } var test2 = function () { console.log("test2"); } var itv = $interval(function() { $scope.test1(); test2(); }, 1000); $scope.stop = function () { $interval.cancel(itv); } 만약에 interval이 돌고 있는 상태에서 다른 페이지로 이동했는데 다른 페이지에서도 계속 interval이 돌고 있을 때 이걸 끄고 싶다면 $interval이 작성된 파일에다가 $scope.$on("$d..

화면에 표기한 textarea의 크기 변경을 막고 싶을 때

태그를 사용했을 때 영역에 맞게 글이 자동 줄바꿈 되지 않고 영역을 넘어가 버릴 때 사용 white-space: pre-wrap; 태그 안에 style로 하드코딩하거나 css 파일안에 위 코드처럼 작성하거나

HyperText Transfer Protocol over Secure Socket Layer 서로 다른 두 컴퓨터가 네트워크를 통해 안전하게 메시지를 주고받기 위해 만든 프로토콜 HTTPS는 TCP 대신 전송 계층 보안(TLS:Transfer Layer Security) 프로토콜을 기반으로 하는 HTTP TLS은 OSI 7 계층 중 네 번째에 해당하는 전송 계층의 TCP 프로토콜을 기반으로 동작하는 보안 프로토콜이다. HTTPS를 사용하는 이유 HTTP의 패킷을 까보면 클라이언트가 보낸 모든 내용을 볼 수 있다. 제삼자가 이 정보를 볼 수 있으며, 메시지를 원하는 형태로 변조할 수 있으므로 서버가 해킹될 위험도 있다. HTTPS는 서버와 클라이언트가 주고받는 메시지를 암호화하여 제삼자가 볼 수 없다. ..

REST : representational state transfer 분산 시스템을 위한 소프트웨어 아키텍처의 한 형태를 가리킴 서버와 클라이언트가 메시지를 주고받을 때 가장 많이 사용하는 통신 규격 RESTfull : REST의 조건을 만족한다. 요청 주소와 메서드(GET, POST 등), JSON 규격을 이용하여 API를 정의하고 사람이 읽기 쉬운 형태이기 때문에 오늘날 가장 범용적으로 사용한다. 정해진 표준이나 규격이 없어서 구현하는 사람에 따라 형태가 조금씩 달라질 수 있다. API 요청 주소에 버전을 넣는것을 고려하자 예) http://localhost:8080/v1/getList 메서드 : API 동작 POST : 새로운 객체를 생성할 때 사용 PUT/PATCH : 기존 객체를 업데이트할 때 ..

Buffer를 사용 const fs = require('fs'); let file = fs.readFileSync('./message.js', 'utf-8'); //message.js 파일 읽기 let encode = Buffer.from(file).toString('base64'); //파일 base64로 인코딩 let mk = fs.writeFileSync('./encodeFile', encode); // 인코딩된 파일 만들기 let file2 = fs.readFileSync('./encodeFile', 'utf-8'); // 인코딩된 파일 읽기 let decode = Buffer.from(file2, 'base64').toString('utf-8'); //파일 디코딩 let mk2 = fs.writ..

Buffer를 사용 const fs = require('fs'); let readFile = fs.readFileSync('./test.jpg'); //이미지 파일 읽기 let encode = Buffer.from(readFile).toString('base64'); //파일 인코딩 let makeEncodeFile = fs.writeFileSync('./encodeFile', encode) //인코딩 파일 만들기 let readFile2 = fs.readFileSync('./encodeFile', 'base64'); //인코딩된 파일 읽기 let decode = Buffer.from(encode, 'base64'); //파일 디코딩 let makeDecodeFile = fs.writeFileSync('..

임의의 길이의 데이터를 고정된 길이의 데이터로 매핑하는 함수. 소프트웨어의 성능과 보안을 책임지는 중요한 요소 중 하나이다. 해시 함수를 사용하면 데이터양이 많아져도 일괄된 성능을 보장하는 구조로 설계할 수 있고, 민감한 데이터의 변조를 막을 수 있다. - 처리 방식 변환 전 변환 변환 후 변환 하기 전 데이터 값을 입력값이라 부름 변환 하는 걸 해싱 이라 부름 (해시 함수를 사용) 변환 된 데이터 값을 해시값이라 부름 입력값으로 문자, 숫자, 바이너리 등을 사용 - 입력값을 바이너리 형태로 반환 알아두기! 1. 입력값이 동일하면 변환된 해시 값이 동일하다. 2. 입력값의 길이와 상관없이 변환된 해시 값의 길이는 항상 동일하다. 3. 서로 다른 입력값으로 동일한 해시 값을 만들 확률은 낮다. 4. 출력된..