본문 바로가기
반응형

전체 글101

< Vuex > Vue는 Data 관리가 중요하다 부모 자신 간에 이벤트를 전달할 때 emit과 prop의 발생이 복잡하게 일어나기 때문!Vuex에서 저장소(임시저장공간)를 운영! VuexVue.js application에 대한 상태관리패턴 + 라이브러리application의 모든 Component들의 중앙 저장소 역할(데이터관리)상위(부모) 하위(자식)의 단계가 많이 복잡해 진다면 데이터의 전달하는 부분이 매우 매우 복잡해진다.application이 여러 구성 요소로 구성되고 더 커지는 경우 데이터 공유 문제도 발생 Vue의 이벤트 구조 Vuex의 저장소를 이용한 구조 상태 관리 패턴상태 (state - data) : 앱을 작동하는 원본 소스뷰 (DOM) : 상태의 선언적 매핑액션 (methods) : 뷰에서 사용자 .. 2021. 1. 6.
< Vue / Cli > CLI Command Line InterfaceVue.js 개발을 위한 시스템. Vue.js에서 공식으로 제공하는 CLI개발의 필수는 아니지만 거의 필수처럼 사용Vue 프로젝트를 빠르게 구성할 수 있는 스캐폴딩 제공Vue와 관련된 오픈 소스 대부분이 CLI를 통해 구성@vue/cli 설치codenpm install -g @vue/cli vue create my-project참고 : https://cli.vuejs.org/ NPMNPM ( Node Package Manager ) - Maven과 유사하다NodeJS - LTS 버전이용 (다운로드 : https://nodejs.org/ko/)NPM 검색 사이트 : https://www.npmjs.com/npm init : 새로운 프로젝트나 패키지를 만들 때 .. 2021. 1. 6.
< ES6 - Destructuring / LocalStorage > 비구조 할당 (구조 분해 할당)예시 Code1 예시 Code2 예시 Code3/** es5까지 주로 사용된 문법 구조 */ function showMember(member) { console.log('아이디: ', member.id); console.log('이름: ', member.name); console.log('나이: ', member.age); } let member = { id: 'aaa', name: 'bbb', age: '22', }; /** es6부터 주로 사용하는 문법 - 비구조 할당 (구조 분해 할당) */ function showMember2({ id, name, age }) { console.log('아이디: ', id); console.log('이름: ', name); conso.. 2021. 1. 6.
< Vue 정리 2 > Module 프로그램을 기능별 로 여러개의 파일로 나누는 형태 Module System CommonJS(NodeJS) - 웹 브라우저 밖에서도 동작될 수 있는 모듈 규칙 설립 AMD(Asynchronous Module Definition) - 비동기적 모듈 로딩 ESM(ECMAScript Module, ECMA215, ES6) - 자바스크립트 자체 모듈 Module 정의 및 사용 가져오기 : import import Module_Name from Module_place 내보내기 : export export → export default 예시 Code 파일명 - calc.js export const title = '계산기 모듈' export function add(i,j){ return i+j; } exp.. 2021. 1. 6.
< Vue 정리 > Vue.jsEvan You에 의해서 만들어짐Vue 탄생은 Google에서 Angular로 개발하다가 가벼운 것을 만들어보고 싶어 시작사용자 인터페이스를 만들기 위해 사용하는 오픈소스 Progressive Framework Vuejs특징접근성 유연성 고성능 MVVM 패턴Model + View + ViewModelModel : 순수 자바스크립트 객체View : 웹페이지의 DOMViewModel : Vue의 역할기존에는 자바스크립트로 vuew에 해당하는 DOM에 접근/수정 하기 위해 JQuery와 같은 Library를 사용.Vue는 View와 Model을 연결. 자동으로 바인딩. 양방향 통신이 가능 MVCController - View - 화면 업데이트 - Model - Data갱신 MVVCView → Vie.. 2021. 1. 6.
[ 알고리즘 ] 코딩 - Programmers - 기능개발.java 문제 링크 programmers.co.kr/learn/courses/30/lessons/42586 코딩테스트 연습 - 기능개발 프로그래머스 팀에서는 기능 개선 작업을 수행 중입니다. 각 기능은 진도가 100%일 때 서비스에 반영할 수 있습니다. 또, 각 기능의 개발속도는 모두 다르기 때문에 뒤에 있는 기능이 앞에 있는 programmers.co.kr * 프로그래머스 - Level2 - (자바) 기능개발 - 큐 레벨별 순회 * Queue에 progress와 speed를 저장 * Queue를 Level별로 순회하며 가장 앞의 큐가 100을 넘어가는지 체크 * 가장 앞의 큐 체크는 idx를 주어 해결 * 100이 넘어가지 않는다면 다시 큐에 저장 * 위 과정 반복 import java.util.A.. 2021. 1. 6.
[ 알고리즘 ] 코딩 - Programmers - 프린터.java 문제 링크 programmers.co.kr/learn/courses/30/lessons/42587 코딩테스트 연습 - 프린터 일반적인 프린터는 인쇄 요청이 들어온 순서대로 인쇄합니다. 그렇기 때문에 중요한 문서가 나중에 인쇄될 수 있습니다. 이런 문제를 보완하기 위해 중요도가 높은 문서를 먼저 인쇄하는 프린 programmers.co.kr * 프로그래머스 - Level 2 - (자바)프린터 - Queue를 이용한 우선순위 결정 * 배열로 들어오는 모든 우선순위를 priQueue에 옮겨 담음 * 가장 앞의 숫자를 기준으로 더 큰 숫자가 있을 때 까지 임시 Queue에 저장하며 priQueue 순회하며 tmpQueue에 넣음 * 더 큰 숫자를 만나게 되면 priQueue의 뒤에 tmpQueue의.. 2020. 12. 26.
[ 알고리즘 ] 코딩 - Programmers - 불량 사용자.java 문제 링크 programmers.co.kr/learn/courses/30/lessons/64064 코딩테스트 연습 - 불량 사용자 개발팀 내에서 이벤트 개발을 담당하고 있는 무지는 최근 진행된 카카오이모티콘 이벤트에 비정상적인 방법으로 당첨을 시도한 응모자들을 발견하였습니다. 이런 응모자들을 따로 모아 불량 programmers.co.kr * Programmers - 2019 카카오 개발자 겨울 인턴십 * - Level 3 - (자바) 불량 사용자 - DFS / HashSet을 이용한 중복제거 1. DFS를 수행하며 일반과 불량 사이의 모든 경우의 수를 찾는다 2. 선택 중 중복을 제거하기 위해 HashSet을 이용한다 2 - 1. DFS와 visited배열로 방문 체크를 하며 반복 순회하는.. 2020. 12. 22.
[ 알고리즘 ] 코딩 - Programmers - 예상대진표.java 문제 링크 programmers.co.kr/learn/courses/30/lessons/12985 코딩테스트 연습 - 예상 대진표 △△ 게임대회가 개최되었습니다. 이 대회는 N명이 참가하고, 토너먼트 형식으로 진행됩니다. N명의 참가자는 각각 1부터 N번을 차례대로 배정받습니다. 그리고, 1번↔2번, 3번↔4번, ... , N-1번↔N programmers.co.kr * Programmers - Level 2 - (자바)예상대진표 - 비트연산(?) * 동그라미 안에 숫자가 다음 대진으로 갔을 때의 인덱스 * 각 숫자 x에 +1 하고 /2 한 결과이다. * 즉 (A +1)/2 == (B+1)/2 인 결과를 찾으면 정답! class Solution { public int solution(int .. 2020. 12. 18.
반응형

티스토리툴바