컴포넌트 간 통신과 유효 범위 Vue.js에서 컴포넌트 간 통신은 주로 부모-자식 관계의 컴포넌트 사이에서 일어납니다. Vue의 반응성 시스템과 함께 작동하며, 각 컴포넌트의 유효 범위 내에서 데이터를 주고받을 수 있는 메커니즘을 제공합니다. 컴포넌트 간 통신 방법 1. Props를 통한 부모에서 자식으로의 데이터 전달 - 부모 컴포넌트는 `props`를 사용하여 자식 컴포넌트에 데이터를 전달합니다. - 자식 컴포넌트는 `props` 옵션을 통해 받은 데이터를 사용할 수 있습니다. - `props`는 단방향 데이터 바인딩을 사용하여, 자식 컴포넌트에서 부모의 데이터를 직접 수정할 수 없습니다. 실습과 예시 Vue에서 `props`를 사용한 부모-자식 컴포넌트 간 데이터 전달의 예를 들어 설명해 보겠습니다..

컴포넌트 Vue.js의 컴포넌트는 Vue 애플리케이션을 구성하는 기본적인 블록입니다. 컴포넌트는 재사용 가능하고 독립적인 Vue 인스턴스로서, HTML 요소처럼 사용될 수 있습니다. 컴포넌트 시스템은 애플리케이션을 작고 독립적인 단위로 분할하여 관리할 수 있게 해줍니다. Vue 컴포넌트의 주요 특징: 1. 재사용성: 컴포넌트는 재사용 가능하게 설계될 수 있어, 동일한 구조와 기능을 여러 곳에서 사용할 수 있습니다. 이는 코드 중복을 줄이고 유지보수를 쉽게 만듭니다. 2. 독립성: 각 컴포넌트는 독립적인 범위를 가집니다. 즉, 각 컴포넌트는 자신만의 데이터, 메소드, 계산된 속성 등을 가질 수 있습니다. 3. 캡슐화: 컴포넌트는 HTML, CSS, JavaScript를 포함할 수 있으며, 이는 해당 컴포넌..

Vue 인스턴스 Vue 인스턴스는 Vue.js를 사용하여 생성하는 애플리케이션의 기본 단위입니다. 각 Vue 애플리케이션은 `new Vue()`로 생성되는 인스턴스를 통해 시작됩니다. 이 인스턴스를 통해 데이터, 메소드, 라이프 사이클 훅 등과 같은 다양한 옵션을 포함할 수 있습니다. Vue 인스턴스를 생성할 때, 여러분은 옵션 객체를 전달할 수 있습니다. 이 객체는 다양한 프로퍼티와 메소드를 포함할 수 있는데, 이들은 인스턴스의 데이터(`data`), 계산된 속성(`computed`), 메소드(`methods`), 감시자(`watch`), 그리고 라이프 사이클 훅(`created`, `mounted`, `updated`, `destroyed` 등)을 정의하는 데 사용됩니다. 예를 들어: var vm =..

https://school.programmers.co.kr/learn/courses/30/lessons/43163 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 주어진 문자열의 문자로 변환할 수 있는지 확인하는 문제이다. 문자마다 경유하는 루트가 다르기에 cost변수를 따로 추가해서 경유한 단어의 개수를 기록해주었다. BFS 알고리즘을 이용하기에 가장 먼저 target에 도달하는 루트가 최단 루트이다. from collections import deque def solution(begin, target, words): answer = 0 queue ..

https://school.programmers.co.kr/learn/courses/30/lessons/1844 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 백준의 문제와 마찬가지로 단순하게 종점에 도달할 수 있는지와 소요되는 시간을 측정해주는 문제이기에 문제없이 풀어주면된다. from collections import deque def solution(maps): answer = 0 dxys = ((1,0),(0,1),(-1,0),(0,-1)) queue = deque([[0,0]]) n = len(maps) m = len(maps[0]) vis..

https://school.programmers.co.kr/learn/courses/30/lessons/43162 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 백준을 풀면서 자주 나오는 유형인 그래프에서 싸이클 개수를 찾는 문제이다. BFS를 이용해서 문제없이 풀어주었다. from collections import deque def bfs(computer_li, visited, s): queue = deque([s]) visited[s] = True while queue: c = queue.popleft() for i in range(len(vis..

https://school.programmers.co.kr/learn/courses/30/lessons/43165 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 주어진 숫자에 + 혹은 -를 붙여서 원하는 숫자가 되게 만들 수 있는지 확인하고 만들 수 있다면 만들 수 있는 부호들의 조힙의 개수를 구해야한다. 평소에도 BFS알고리즘을 자주 사용하는 편이기에 문제를 풀 때도 BF를 이용해주었다. 덱(Deque)에 주어진 숫자들의 첫번째 숫자를 부호를 각각 +1, -1를 곱해주어서 넣어주었다.이후에 while문을 이용해서 조합을 구해주었다. 자세한 설명은 ..

문제 https://www.acmicpc.net/problem/9084 9084번: 동전 우리나라 화폐단위, 특히 동전에는 1원, 5원, 10원, 50원, 100원, 500원이 있다. 이 동전들로는 정수의 금액을 만들 수 있으며 그 방법도 여러 가지가 있을 수 있다. 예를 들어, 30원을 만들기 위해서는 www.acmicpc.net 풀이 문제를 풀기 위해서 다음과 같은 점화식이 필요하다. 주어진 화폐 단위 별로 해당하는 금액을 완성할 수 있는 동전을 구성하는 개수를 찾아준다. 1. dp[0]을 1로 초기화합니다. 이는 금액 0을 만드는 방법이 하나밖에 없음을 의미합니다(아무 동전도 사용하지 않는 경우). 2. 모든 동전 단위 coin[i]에 대해 반복합니다. 3. 각 coin[i]에 대해 금액 coin[..