목록분류 전체보기 (38)
개발자 꼬부기의 성장일기
Vue.js 3.0 개발가이드 정리(2)
03.LifeCycle Hooks (생명주기 훅):컴포넌트가 생성되고 소멸되기까지의 단계, 각 단계에서 실행되는 함수들을 라이프사이클 훅이라 부른다. 1) 컴포넌트 생성: vue컴포넌트 생성될때 초기화 과정을 거친다. 2) Created: 템플릿 및 Virtual DOM이 마운팅 혹은 랜더링 되기 전에 실행, 데이터와 이벤트가 활성화되어 접근할 수 있다. 3) Mounted: 컴포넌트가 초기 랜더링 및 DOM 노드 생성이 완료된 후, 코드를 실행하는데 사용할 수 있다. 4) Updated: 컴포넌트 데이터가 변경되어 DOM이 렌더링된 후 실행된다. 또한, Property가 변경된 후 DOM에 접근해야할 때 사용한다.1. Renderer에게 컴포넌트 처리해달라고 요청 2. Renderer에게 컴포넌트 처..
Vue.js 3.0 개발가이드 정리(1)
Vue : 프레임워크라이브러리 예를 들면 라이브러리가 목재 프레임워크가 가구라고 할 수 있다. Vue의 후발주자로는 스벨트가 있다. 01. Vue.js 구조1) SPA(Single Page Application) 단일 페이지 애플리케이션 (1) 여러 페이지가 존재하는데 다수의 페이지를 표시하는 데 있어서 과거 전통적인 방식으로 페이지 전환을 수행하지 않고, 마치 하나의 페이지인 것처럼 처리하는 기술 (2) 서버에서 필요한 데이터만 비동기로 받아와서 동적으로 현재 화면에 다시 렌더링 하는 방식 => 사용자가 애플리케이션과 상호작용할 때마다 서버에 요청하여 전체 HTML 화면을 받아오는 방식이 아니라, 화면 렌더링을 로컬 PC에서 즉시 생성하므로 더 빠..
도커는 데이터 또는 프로그램을 격리 시키는 기능을 제공한다. 도커는 리눅스 컴퓨터에서 사용한다. 윈도우나 Mac에 구동할 수는 있지만 이경우 내부적으로 리눅스를 설치해야한다. 격리해야하는 이유 프로그램 마다 실행환경이 다를 수 있다. 예를 들어 한 프로그램이 파이썬 3.8로 사용되었고 다른 프로그램은 3.10을 이용한 프로그램이 있다면 버전이 다른 것이 영향을 줄 수 있기 때문에 다른 환경에서 실행되어야 할 수 있다. 이 경우 도커를 사용하면 관리하기가 편하다. 물론 같은 버전일지라도 구분해도 상관 없다. 도커 컨테이너(Docker Container) 이미지를 실행한 상태로 응용프로그램의 종속성과 함께 응용프로그램자체를 패키징 또는 캡슐화하여 격리된 공간에서 프로세스를 동작시키는 기술이다. 컨테이너는 응..
REST API REST API는 웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식
25일차 - 동전 교환 알고리즘(DP)
DP(Dynamic Programing) : 한번 연산한 결과를 저장해놓고 다시 연산하지 않고 재사용하는 개념. ex) 피보나치 수열 아래는 가장 대표적인 동전 교환 알고리즘이다. 새로운 배열을 통해 결과를 저장하고 재사용하면서 구하게 된다. 최대 50원, 사용할 수 있는 화폐는 {10,20,50} 3가지 종류일때, 1. 최대 값까지의 배열을 만든다. 2. 10이 10이될때 경우의 수, 10이 20이될때 경우의 수, 10이 30이 될때 경우의 수, 10이 40이 될때 경우의 수 , 10이 50이 될 때 경우의 수 각각 구한다. 3. 20이 20이 될때 경우의 수 => 20은 10일 때 경우의 수와 10일 때 경우의 수의 합으로 구할 수 있다. 10과 20이 있을때 20이 되려면 경우의 수 (10,10),..
Stringify는 JSON 형태의 데이터로 변환하는 기능 JSON 데이터 JSON 데이터는 이름과 값의 쌍으로 구성. 이러한 JSON 데이터는 데이터 이름, 콜론(:), 값의 순서로 구성. 문법 "데이터이름": 값 데이터의 이름이 "name"이고, 값은 "식빵"이라는 문자열을 갖는 JSON 데이터 예제 "name": "식빵" 데이터의 이름도 문자열이므로, 항상 큰따옴표("")와 함께 입력해야 한다. 데이터의 값으로 문자열, 숫자, 불리언, 배열, 객체로 올 수 있다. 문자열 => "문자열" 숫자 => 숫자 불리언 => 불리언 객체 => [] 배열 => [] Map => {key:value} 1. stringify함수 구현하기 1-1. instanceof 연산자를 통해 모든 경우의 수로 분기시킨다. //..