반응형 분류 전체보기106 Level 1. Vue.js 소개 MVVM 모델에서의 Vue Vue는 무엇인가? MVVM 패턴의 뷰모델(ViewModel) 레이어에 해당하는 화면(View)단 라이브러리 View - 브라우저에서 사용자에 비추어지는 화면(html) DOM Listeners - View의 이벤트 요소들을 청취하여 자바스크립트를 Model에서 실행 Data Bindings - Model의 변동된 사항을 View에 전달 vscode에서 ! + tab - html 기본적인 폼 div#app - 생성 기존의 웹 개발 방식 (HTML, Javascript) Reactivity 구현 (Vue의 핵심) data의 변화를 라이브러리에서 감지하여서 알아서 화면을 자동으로 그려주는 것 Object.defineProperty() API 문서 링크 Reactivity 코드 라이.. 2020. 12. 28. Level 1. 인스턴스 Cracking Vue.js MDN 생성자 함수 설명 문서 MDN Prototype 설명 문서 Vue에서 제공하는 api와 속성 기본적인 생성자 함수의 정의 Vue를 생성자 관점에서 찍어내는 이유 아래와 같이 Vue의 인스턴스를 사용하여서 객체를 생성할때마다, 함수를 정의하는 것이 아니라, 생성자를 사용하여서 사용할 수 있다. 인스턴스의 속성, API들 2020. 12. 28. Level 1. 컴포넌트 통신 방법 - 기본 컴포넌트 통신 방식 뷰 컴포넌트는 각각 고유한 데이터 유효 범위를 갖습니다. 따라서, 컴포넌트 간에 데이터를 주고 받기 위해선 아래와 같은 규칙을 따라야 합니다. 상위에서 하위로는 데이터를 내려줌, 프롭스 속성 하위에서 상위로는 이벤트를 올려줌, 이벤트 발생 컴포넌트 통신 규칙 방식을 통하여서 컴포넌트 간의 데이터 흐름을 손쉽게 확인할 수 있기 때문이다. props 속성 event emit {{ num }} 뷰 인스턴스에서의 this this 관련 글 1 this 관련 글 2 2020. 12. 28. Level 1. 컴포넌트 통신 방법 - 응용 같은 컴포넌트 레벨 간의 통신 방법 AppContent에서 AppHeader로 직접 전달을 할 수 없기 때문에 AppContet에서 Root로 먼저 전달 후 Root에서 AppHeader로 전달을 한다. 2020. 12. 28. Level 1. 컴포넌트 Vue components 뷰 컴포넌트 컴포넌트는 화면의 영역을 구분하여 개발할 수 있는 뷰의 기능입니다. 컴포넌트 기반으로 화면을 개발하게 되면 코드의 재사용성이 올라가고 빠르게 화면을 제작할 수 있습니다. 인스턴스를 생성하면 기본적으로 Root 컴포넌트가 된다. 2020. 12. 28. Chapter 12. 백트래킹 백트래킹 (핵심 유형 문제풀이) 혼자 힘으로 풀어 보기 N-Queen: https://www.acmicpc.net/problem/9663 문제 제목: N-Queen 문제 난이도: 중(Medium) 문제 유형: 백트래킹 추천 풀이 시간: 40분 문제 풀이 핵심 아이디어 N x N 크기의 체스 보드 위에 퀸(Queen) N개를 서로 공격할 수 없게 배치시켜야 합니다. 대표적인 백트래킹(Backtracking) 문제입니다. N = 4일 때는, 다음과 같은 경우가 존재합니다. DFS를 이용하여 간단히 백트래킹 알고리즘을 구현할 수 있습니다. 각 행을 차례대로 확인하면서, 각 열에 퀸(Queen)을 놓는 경우를 고려합니다. 각 행을 차례대로 확인하면서, 각 열에 퀸(Queen)을 놓는 경우를 고려합니다. 이 때 .. 2020. 8. 10. Chapter 11. 탐욕 알고리즘 탐욕 알고리즘 (기초 문제풀이) 혼자 힘으로 풀어 보기 거스름돈: https://www.acmicpc.net/problem/5585 문제 제목 : 거스름돈 문제 난이도: 하(Easy) 문제 유형: 그리디 추천 풀이 시간: 10분 문제 풀이 핵심 아이디어 거스름돈의 최소 개수를 계산해야 합니다. 가장 기초적인 탐욕 알고리즘 문제 유형입니다. 단순히 '큰 화폐 단위' 순서대로 잔돈을 거슬러 주면 최적의 해를 얻을 수 있습니다. '큰 화폐 단위' 순서대로 잔돈을 거슬러 줍니다. 거슬러 줄 돈: 620 거스름 돈의 개수: 0 거슬러 줄 돈: 120 거스름 돈의 개수: 1 거슬러 줄 돈: 20 거스름 돈의 개수: 2 거슬러 줄 돈: 20 거스름 돈의 개수: 2 거슬러 줄 돈: 0 거스.. 2020. 8. 10. Chapter 10. 그래프 고급 탐색 알고리즘 그래프 고급 탐색 알고리즘 (핵심 유형 문제풀이) 혼자 힘으로 풀어 보기 해킹: https://www.acmicpc.net/problem/10282 문제 제목: 해킹 문제 난이도: 중(Medium) 문제 유형: 다익스트라 최단 경로 추천 풀이 시간: 50분 문제 풀이 핵심 아이디어 기본적인 다익스트라 최단 경로 알고리즘 문제입니다. 도달할 수 있는 정점들의 개수와 최대 거리를 출력합니다. 정점의 개수 N이 최대 10,000이고, 간선의 개수 D는 최대 100,000입니다. 우선 순위 큐를 이용하여, 시간 복잡도 O(NlogD)로 해결할 수 있습니다. 정점개수 = 3, 간선 개수 = 3, 시작 정점 번호 = 1 소스코드 import heapq import sys input = sys.stdin.readli.. 2020. 8. 10. Chapter 09. 그래프 기본 탐색 알고리즘 그래프 기본 탐색 알고리즘 (기초 문제풀이) 혼자 힘으로 풀어 보기 DFS와 BFS: https://www.acmicpc.net/problem/1260 문제 제목: DFS와 BFS 문제 난이도: 하(Easy) 문제 유형: DFS, BFS 추천 풀이 시간: 30분 문제 풀이 핵심 아이디어 기본적인 형태의 그래프를 단순히 DFS와 BFS로 탐색합니다. 이 문제에서는 "정점 번호가 작은 것"을 먼저 방문해야 합니다. 모든 노드와 간선을 차례대로 조회하여 O(N+M)의 시간 복잡도로 문제를 해결해야 합니다. 국내 코딩 테스트 합격을 위해서는 이 문제를 매우 빠르게 풀 수 있도록 숙달할 필요가 있습니다. 큐(Queue) 구현을 위해 collections 라이브러리의 deque를 사용합니다. 예시) 정점 개수 = .. 2020. 8. 10. Chapter 08. 동적 프로그래밍 동적 프로그래밍 (기초 문제 풀이) 혼자 힘으로 풀어 보기 01타일: https://www.acmicpc.net/problem/1904 문제 제목: 01타일 문제 난이도: 하(Easy) 문제 유형: 동적 프로그래밍 추천 풀이 시간: 20분 문제 풀이 핵심 아이디어 사용할 수 있는 타일의 종류는 2개입니다. 두 가지 종류의 타일을 이용하여, N 길이의 수열을 만드는 모든 경우의 수를 구해야 합니다. 가장 전형적인 동적 프로그래밍 문제입니다. N이 최대 1,000,000이므로 시간 복잡도 O(N)으로 해결해야 합니다. 타일을 왼쪽에서부터 오른쪽으로 이어서 붙인다고 가정합니다. 예를 들어 N = 3일때, 경우의 수는 3가지입니다. 예를 들어 N=4일 때, 경우의 수는 5가지 입니다. 동적 프로그래밍 문제를 풀.. 2020. 8. 10. 이전 1 2 3 4 5 6 7 ··· 11 다음 728x90 반응형
