DEVELOP
article thumbnail
[ JavaScript (Node.js) ] 백준 실버1 1303번 전쟁-전투
CODING TEST/Baek-joon 2024. 2. 27. 17:49

전쟁-전투 #1303 더보기 전쟁 - 전투 문제 전쟁은 어느덧 전면전이 시작되었다. 결국 전투는 난전이 되었고, 우리 병사와 적국 병사가 섞여 싸우게 되었다. 그러나 당신의 병사들은 흰색 옷을 입고, 적국의 병사들은 파란색 옷을 입었기 때문에 서로가 적인지 아군인지는 구분할 수 있다. 문제는 같은 팀의 병사들은 모이면 모일수록 강해진다는 사실이다. N명이 뭉쳐있을 때는 N2의 위력을 낼 수 있다. 과연 지금 난전의 상황에서는 누가 승리할 것인가? 단, 같은 팀의 병사들이 대각선으로만 인접한 경우는 뭉쳐 있다고 보지 않는다. 입력 첫째 줄에는 전쟁터의 가로 크기 N, 세로 크기 M(1 ≤ N, M ≤ 100)이 주어진다. 그 다음 두 번째 줄에서 M+1번째 줄에는 각각 (X, Y)에 있는 병사들의 옷색이 ..

article thumbnail
[ JavaScript ] 프로그래머스 level2 42746번 가장 큰 수
CODING TEST/Programmers 2024. 1. 28. 04:16

가장 큰 수 #42746 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 더보기 문제 설명 0 또는 양의 정수가 주어졌을 때, 정수를 이어 붙여 만들 수 있는 가장 큰 수를 알아내 주세요. 예를 들어, 주어진 정수가 [6, 10, 2]라면 [6102, 6210, 1062, 1026, 2610, 2106]를 만들 수 있고, 이중 가장 큰 수는 6210입니다. 0 또는 양의 정수가 담긴 배열 numbers가 매개변수로 주어질 때, 순서를 재배치하여 만들 수 있는 가장 큰 수를 문자열로 바꾸어 return 하도록 solution 함수를 작성해주세요. 제한 사항 ..

article thumbnail
[ JavaScript ] 프로그래머스 level2 42583번 다리를 지나는 트럭
CODING TEST/Programmers 2024. 1. 23. 16:13

다리를 지나는 트럭 #42583 프로그래머스 알고리즘 고득점 Kit > 스택/큐 > level2 다리를 지나는 트럭 더보기 문제 설명 트럭 여러 대가 강을 가로지르는 일차선 다리를 정해진 순으로 건너려 합니다. 모든 트럭이 다리를 건너려면 최소 몇 초가 걸리는지 알아내야 합니다. 다리에는 트럭이 최대 bridge_length대 올라갈 수 있으며, 다리는 weight 이하까지의 무게를 견딜 수 있습니다. 단, 다리에 완전히 오르지 않은 트럭의 무게는 무시합니다. 예를 들어, 트럭 2대가 올라갈 수 있고 무게를 10kg까지 견디는 다리가 있습니다. 무게가 [7, 4, 5, 6]kg인 트럭이 순서대로 최단 시간 안에 다리를 건너려면 다음과 같이 건너야 합니다. 경과 시간다리를 지난 트럭다리를 건너는 트럭대기 ..

article thumbnail
[ 모던 자바스크립트 Deep Dive ] 40.8장 DOM 요소의 기본 동작 조작(e.preventDefault 와 e.stopPropagaion)

프로젝트를 진행하면서 문제 해결을 하기 위해 찾아보다가 stopPropagation() 개념을 처음 접했다. e.preventDefault() 는 몇번 써봤는데 비슷한 결(?)인 것 같고, 차이점을 확실히 알고 싶어서 모던 JS 책에서 찾아보게 되었다. 해당 개념을 찾아보게 된 상황 부모 컴포넌트는 기록된 식단 아이템 컴포넌트로서, 클릭하면 해당 식단 아이템의 상세페이지로 이동하는 onClick 이벤트 핸들러 함수가 지정되어 있음 자식 컴포넌트는 휴지통 그림 버튼이고, 해당 버튼을 눌렀을 때 팝업을 띄우는 컴포넌트임 문제는 휴지통을 클릭했을 때 팝업창이 뜨지 않고 상세페이지로 이동해버리는 것 현재 상황에서는 휴지통 버튼 역시 컨테이너에 속하므로 클릭했을 때 상세페이지로 이동하게 되는 것이다. 해결방법 ⇒..

article thumbnail
[ 모던 자바스크립트 Deep Dive ] 23장 실행 컨텍스트

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 실행 컨텍스트는 자바스크립트의 동작 원리를 담고 있는 핵심 개념이다. 실행 컨텍스트를 바르게 이해하면 자바스크립트가 스코프를 기반으로 식별자와 식별자에 바인딩된 값(식별자 바인딩)을 관리하는 방식과 호이스팅이 발생하는 이유, 클로저의 동작 방식, 그리고 태스크 큐와 함께 동작하는 이벤트 핸들러와 비동기 처리의 동작 방식을 이해할 수 있다. 소스코드의 ..

article thumbnail
[ 모던 자바스크립트 Deep Dive ] 13장 스코프(Scope, 유효범위)

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 스코프란? 스코프(유효범위)는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념이다. 더욱이 자바스크립트의 스코프는 다른 언어의 스코프와 구별되는 특징이 있으므로 주의가 필요하다. 그리고 var 키워드로 선언한 변수와 let 또는 const키워드로 선언한 변수의 스코프도 다르게 동작한다. 스코프는 변수 그리고 함수와 깊은 관련이 있다..

article thumbnail
[ JavaScript ] 프로그래머스 level1 문제 풀이 (5)
CODING TEST/Programmers 2023. 8. 4. 03:19

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr GitHub - cjy00n/coding-test Contribute to cjy00n/coding-test development by creating an account on GitHub. github.com 가장 가까운 같은 글자 #142086 문제 설명 문자열 s가 주어졌을 때, s의 각 위치마다 자신보다 앞에 나왔으면서, 자신과 가장 가까운 곳에 있는 같은 글자가 어디 있는지 알고 싶습니다. 예를 들어, s="banana"라고 할 때, 각 글자들을 왼쪽부터 오른쪽으로 읽어 나가면서 다음과 같이 진행할 ..

article thumbnail
[ JavaScript ] 프로그래머스 level1 문제 풀이 (3)
CODING TEST/Programmers 2023. 7. 30. 02:46

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr GitHub - cjy00n/coding-test Contribute to cjy00n/coding-test development by creating an account on GitHub. github.com 약수의 개수와 덧셈 #77884 문제 설명 두 정수 left와 right가 매개변수로 주어집니다. left부터 right까지의 모든 수들 중에서, 약수의 개수가 짝수인 수는 더하고, 약수의 개수가 홀수인 수는 뺀 수를 return 하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ left ≤..

article thumbnail
[ 인프런 - 한입 크기로 잘라 먹는 React] 3. React 실전 프로젝트 - 감정 일기장 만들기(2)
FRONTEND/React 2023. 1. 9. 01:47

인프런 이정한님의 한입크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 ] 강의 수강 후 강의의 내용을 정리하며 공부한 것을 쓴 게시글입니다. 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com 페이지 구현 - 홈(/) Header 세팅하기 - Home의 헤더에는 가운데 텍스트로 현재 리스트의 년/월이 있고, 왼쪽에는 이전 월로 이동하는 버튼, 오른쪽에는 이후 월로 이동하는 버튼이 있다. - 현재 리스트의 날짜 (curDate) ..

article thumbnail
[ 인프런 - 한입 크기로 잘라 먹는 React] 3. React 실전 프로젝트 - 감정 일기장 만들기(1)
FRONTEND/React 2023. 1. 8. 00:27

인프런 이정한님의 한입크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 ] 강의 수강 후 강의의 내용을 정리하며 공부한 것을 쓴 게시글입니다. 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com 페이지 라우팅 0 - React SPA & CSR # 라우팅 : 어떤 네트워크 내에서 통신 데이터를 보낼 경로를 선택하는 일련의 과정 - 경로를 정해주는 행위 자체 # 페이지 라우팅 : 요청에 명시되어 있는 경로에 따라 알맞은 페이지를 선..