분류 전체보기505

• 

  [BOJ] 1058 친구 - JAVA 1. 문제 1058번: 친구 지민이는 세계에서 가장 유명한 사람이 누구인지 궁금해졌다. 가장 유명한 사람을 구하는 방법은 각 사람의 2-친구를 구하면 된다. 어떤 사람 A가 또다른 사람 B의 2-친구가 되기 위해선, 두 사람 www.acmicpc.net 지민이는 세계에서 가장 유명한 사람이 누구인지 궁금해졌다. 가장 유명한 사람을 구하는 방법은 각 사람의 2-친구를 구하면 된다. 어떤 사람 A가 또다른 사람 B의 2-친구가 되기 위해선, 두 사람이 친구이거나, A와 친구이고, B와 친구인 C가 존재해야 된다. 여기서 가장 유명한 사람은 2-친구의 수가 가장 많은 사람이다. 가장 유명한 사람의 2-친구의 수를 출력하는 프로그램을 작성하시오. A와 B가 친구면, B와 A도 친구이고, A와 A는 친구가 아니다.. 코딩테스트/BOJ 2022. 6. 5.

• 

  [BOJ] 1024 수열의 합 - JAVA 1. 문제 1024번: 수열의 합 첫째 줄에 N과 L이 주어진다. N은 1,000,000,000보다 작거나 같은 자연수이고, L은 2보다 크거나 같고, 100보다 작거나 같은 자연수이다. www.acmicpc.net N과 L이 주어질 때, 합이 N이면서, 길이가 적어도 L인 가장 짧은 연속된 음이 아닌 정수 리스트를 구하는 프로그램을 작성하시오. 첫째 줄에 N과 L이 주어진다. N은 1,000,000,000보다 작거나 같은 자연수이고, L은 2보다 크거나 같고, 100보다 작거나 같은 자연수이다. 만약 리스트의 길이가 100보다 작거나 같으면, 연속된 수를 첫째 줄에 공백으로 구분하여 출력한다. 만약 길이가 100보다 크거나 그러한 수열이 없을 때는 -1을 출력한다. 2. 풀이 1. 숫자와 현재 값(sp.. 코딩테스트/BOJ 2022. 6. 4.

• 

  [JO] 1339 문자삼각형2 - JAVA 1. 문제 JUNGOL www.jungol.co.kr 삼각형의 높이 N을 입력받아서 아래와 같이 문자 'A'부터 차례대로 맨 오른쪽 가운데 행부터 차례대로 아래와 같이 채워서 삼각형 모양을 출력하는 프로그램을 작성하시오. (1) 오른쪽 가운데 행에 문자 'A'를 채우고 왼쪽 열로 이동하여 위에서 아래로 채워나간다. (2) 가장 왼쪽 행까지 반복하여 모두 채워 나간다. (문자 'Z'다음에는 'A'부터 다시 시작한다.) 2. 풀이 배열에 모아서 출력했다. 절반부터 줄여가면서 문자를 저장하는데 현재 열번호가 행번호보다 작거나, 열번호가 N-1(인덱스가 0부터 시작하기 때문)에서 행번호를 뺀 것보다 큰 경우는 문자를 저장하지 않고 공백만 저장했다. 출력할 때 열번호는 최대 절반까지 출력했다. 원래는 전부 출력했.. 코딩테스트/ELSE 2022. 6. 3.

• 

  [JO] 1338 문자삼각형1 - JAVA 1. 문제 JUNGOL www.jungol.co.kr 삼각형의 높이 N을 입력받아서 아래와 같이 문자 'A'부터 차례대로 왼쪽 대각선으로 채워서 삼각형 모양을 출력하는 프로그램을 작성하시오. (1) 오른쪽 위부터 왼쪽 아래쪽으로 이동하면서 문자 'A'부터 차례대로 채워나간다. (2) N번 행까지 채워지면 다시 오른쪽 둘째 행부터 왼쪽 아래로 채워나간다. (3) 삼각형이 모두 채워질 때까지 반복하면서 채워 나간다. (문자 'Z'다음에는 'A'부터 다시 시작한다.) 2. 풀이 배열로 모아서 출력하지 않고 StringBuilder로 한 줄 한 줄 계산했다. 해당 열의 첫 번째 문자는 'A'+열의 번호와 같고, 그 다음부터는 그 전 문자+N-1, +N-2 ... 와 같기 때문에 plus 변수를 .. 코딩테스트/ELSE 2022. 6. 2.

• 

  [JO] 1291 구구단 - JAVA 1. 문제 JUNGOL www.jungol.co.kr 원하는 구구단의 범위를 입력받아 해당 구간의 구구단을 출력하는 프로그램을 작성하시오. (1) 구간의 처음과 끝을 입력받는다. (2) 입력된 구간은 반드시 처음 입력 값이 끝의 입력 값보다 작아야 하는 것은 아니다. 즉 입력된 구간의 범위는 증가하거나 감소하는 순서 그대로 출력되어야 한다.​ 구구단의 시작 범위 s,와 끝 범위 e를 입력받는다.(s와 e는 2부터 9사이의 정수) 하나의 결과가 출력되면 프로그램을 종료한다. 시작 범위와 끝 범위사이의 구구단을 출력하되 모든 값과 부호 사이는 공백으로 구분하여 아래 출력 예와 같이 줄을 맞추어 출력해야 한다. 구구단 사이는 3개의 공백으로 구분한다. 데이터의 크기가 주어진 범위를 벗어날 경우는 "INPUT .. 코딩테스트/ELSE 2022. 6. 1.

• 

  [BOJ] 1120 문자열 - JAVA 1. 문제 1120번: 문자열 길이가 N으로 같은 문자열 X와 Y가 있을 때, 두 문자열 X와 Y의 차이는 X[i] ≠ Y[i]인 i의 개수이다. 예를 들어, X=”jimin”, Y=”minji”이면, 둘의 차이는 4이다. 두 문자열 A와 B가 주어진다. 이때, A의 www.acmicpc.net 길이가 N으로 같은 문자열 X와 Y가 있을 때, 두 문자열 X와 Y의 차이는 X[i] ≠ Y[i]인 i의 개수이다. 예를 들어, X=”jimin”, Y=”minji”이면, 둘의 차이는 4이다. 두 문자열 A와 B가 주어진다. 이때, A의 길이는 B의 길이보다 작거나 같다. 이제 A의 길이가 B의 길이와 같아질 때 까지 다음과 같은 연산을 할 수 있다. A의 앞에 아무 알파벳이나 추가한다. A의 뒤에 아무 알파벳이.. 코딩테스트/BOJ 2022. 5. 31.

• 

  [VSCode] vscode에서 eslint와 prettier 충돌 문제 vscode에서 eslint + prettier 사용해서 vue 프로젝트를 하는 중에 쉼표가 사라지거나 endOfLine오류가 자꾸 발생했다. 인터넷에서 찾아보다가 eslint와 prettier 충돌문제인 건 눈치챘는데 설정을 아무리 바꿔도 해결되지 않았다. 내가 찾은 해결방법은 vscode의 Prettier ESLint 확장프로그램을 까는 것이다. 따로따로면 충돌나니까 애초부터 eslint+prettier 둘을 같이 쓰게 나온 거면 어떨까? 해서 깔아봤는데 다행히 성공적이었다. 기본 포맷터를 이 확장프로그램으로 설정하면 모든 게 다 깔끔하게 해결된다. 기록/FRONTEND 2022. 5. 30.

• 

  [Vue] bootstrap 하위 컴포넌트 모달창 상위 컴포넌트에서 열기 하위 컴포넌트 모달창을 상위 컴포넌트에서 열어야 할 상황이 생겼다. 내 뷰의 구조는 오른쪽이다. 원하는 흐름은 HouseListItem 하나를 클릭하면 해당 정보를 가진 modal창(HouseDetail)이 HouseList에서 열리는 것이다. 모달 on/off 상태를 저장할 변수를 설정하려고도 생각해봤지만 더 간단한 방법을 발견했다. 1. HouseListItem 각각을 클릭하면 HouseList로 $emit을 보낸다. 2. HouseList는 해당 이벤트가 발생하면 모달창을 여는 함수를 호출한다. HouseListItem 클릭하면 selectHouse를 호출한다. selectHouse는 상위컴포넌트(HouseList)로 이벤트를 보낸다. selectHouse(aptCode){ this.$emit("o.. 기록/FRONTEND 2022. 5. 29.

• 

  [Vue] Vuex 1. Vuex vue.js 애플리케이션에 대한 상태관리패턴 + 라이브러리다. 애플리케이션 모든 컴포넌트들의 중앙집중식저장소 역할로 데이터를 관리한다. 이 방식은 예측 가능한 방식으로 상태를 관리할 수 있다. 기존의 단방향 통신은 데이터의 흐름이 직관적이라는 장점이 있지만, 부모 자식 단계가 많이 복잡해진다면 데이터의 전달하는 부분도 매우 복잡해져서 유지보수가 힘들다는 단점이 있다. 애플리케이션이 여러 구성 요소로 구성되고 더 커지는 경우 데이터를 공유하는 문제도 발생한다. vuex는 데이터 관리하는데에는 효율적이지만, 소스가 복잡해 개념 이해와 시작에 비용이 든다. 단기간, 장기간 생산성 간 기회비용이 있다는 것도 유의해야한다. 대규모 프로젝트에는 vuex가 효율적인 선택이다. 2. Vuex 핵심컨셉 1.. 기록/FRONTEND 2022. 5. 28.

• 

  [Vue] SFC(Single File Component) SFC(Single File Component) 확장자가 ".vue"인 파일이다. vue cli에서 사용한다. .vue 파일에서는 template, script, style을 모두 합쳐서 작성할 수 있다. 구문 강조가 가능하고, 를 사용해 컴포넌트에만 css범위를 제한할 수 있다. 전처리기를 사용해 기능의 확장이 가능하다. template 기본언어는 html이다. 각 .vue 파일은 한번에 최대 하나의 블록을 포함할 수 있다. template는 무조건 하나의 루트 엘리먼트를 포함해야 한다. 내용은 문자열로 추출(``)되어 컴파일된 Vue Component의 template옵션으로 사용된다. script 기본언어는 javascript다. 각 .vue 파일은 한 번에 최대 하나의 블록을 포함할 수 있다. E.. 기록/FRONTEND 2022. 5. 27.

• 

  [Vue] Vue CLI(feat.NodeJS) 1. VUE CLI(Command Line Interface) Vue.js 개발을 위한 시스템으로 Vue.js에서 공식으로 제공하는 CLI다. Vue 프로젝트를 빠르게 구성할 수 있는 스캐폴딩을 제공한다. Vue와 관련된 오픈소스들 대부분이 CLI를 통해 구성이 가능하도록 구현되어 있다. 2. 설치 NodeJS https://nodejs.org/ko/ 에서 LTS 버전을 다운로드한다. 더보기 NPM(Node Package Manager) command에서 third-part 모듈을 설치하고 관리하는 툴이다. 모듈 검색은 https://www.npmjs.com/ 에서 할 수 있다. npm init을 하면 package.json이 생성되는데, maven의 pom.xml과 역할이 비슷하다. 모듈 설치 1. 작.. 기록/FRONTEND 2022. 5. 26.

• 

  [Vue] Router 1. Router 라우터는 컴포넌트와 매핑되어 vue를 이용한 SPA(Single Page Application)를 제작할 때 유용하다. URL에 따라 컴포넌트를 연결하고 설정된 컴포넌트를 보여준다. 2. 설치 cdn 방식이다. ​ 모듈 시스템에서 사용하면 Vue.use()를 사용해서 명시적으로 라우터를 추가해야 한다. import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(VueRouter) 3. 연결 - 선언적 네비게이션 HTML 1. router-link 네비게이션을 위해 router-link 컴포넌트를 사용한다. to를 이용해 구체적인 속성을 지정한다. 이름으로 지정할 수도 있고, 링크로 지정할 수도 있다. query나 params를 같.. 기록/FRONTEND 2022. 5. 25.