목록HI's Dev Log (70)
현인
호이스팅(hoisting)이란? "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것" 호이스팅은 인터프리터가 변수와 함수의 메로리 공간을 선언 전에 미리 할당하는 것을 의미한다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화한다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않는다. 쉽게 말해, 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장 할 수 있다. 다만 선언과 초기화를 함께 수행하는 경우, 선언 코드까지 실행해야 변수가 초기화된 상태가 됨을 주의해야 한다. 선언만 호이스팅 대상 Javascript는 초기화를 제외한 선언만 호이스팅한다. 변수를 먼저 사용하고 그 후에 선언 및 초기화가 나타나면, 사용하는 시점의 ..
들어가며 Next.js는 프레임워크이고 React는 라이브러리이다. 노마드코더 강의에서 프레임워크와 라이브러리의 차이에 대해 간략히 설명해주었는데, 제대로 된 차이점을 이해하고 싶어서 더 알아보려한다. 프레임워크란? 프레임워크는 말 그대로 뼈대나 기반구조를 뜻하고, 제어의 역전 개념이 적용된 대표적인 기술이다. 소프트웨어에서의 프레임워크는 '소프트웨어의 특정 문제를 해결하기 위해서 상호 협력하는 클래스와 인터페이스의 집합' 이라 할 수 있다. 따라서 완성된 어플리케이션이 아닌 추상화된 어플리케이션이라고 볼 수 있다. 개발자는 이 추상화된 부분들을 완성하면 된다. 프레임워크의 특징 특정 개념들의 추상화를 제공하는 여러 클래스나 컴포넌트로 구성되어 있다 추상적인 개념들이 문제를 해결하기 위해 같이 작업하는 ..

들어가며 Next.js 학습을 하며 정리할 예정입니다. 노마드 코더 'Next.js 시작하기' 강의를 참고하며 학습 내용을 정리할 예정입니다. Next.js 13 이상 VSCode Next.js 프로젝트 생성 npx create-next-app@latest #타입스크립트를 사용할 경우 npx create-next-app@latest --typescript CNA를 활용하여 프로젝트를 생성합니다 typescript를 사용하는 경우 --typescript 옵션을 추가합니다 추가 설정 위 명령어를 실행하게 되면, 몇 가지 설정을 추가적으로 하게 됩니다. 내용은 다음과 같습니다. 1. What is your project named? 프로젝트 명을 입력한다 2. Would you like to use ESLin..

알고리즘 스프린트 13일차 - [프로그래머스] Lv 2. 행렬 테두리 회전하기 https://school.programmers.co.kr/learn/courses/30/lessons/77485 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 30분 계획 풀이 배열 회전과 최솟값 구하기를 섞은 문제 정해진 구간(x1,y1,x2,y2)의 정사각형의 테두리를 시계 방향으로 한 칸씩 회전 시키고 회전한 값 중에 최솟값을 구해라 회전 결과를 계속해서 반영해야 다음 회전 안에서 최솟값이 제대로 구해지는 것을 명심한다 회전 하는 방법은 여러가지가 있으나, 내가..

알고리즘 스프린트 12일차 - [프로그래머스] Lv 2. 튜플 ( 2019 카카오 개발자 겨울 인턴십 ) https://school.programmers.co.kr/learn/courses/30/lessons/64065 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 40분 계획 풀이 문자열 다루기 문제 일단 스플릿을 해야되는데 ‘,’ 기준으로 단순히 스플릿을 할 수 없다 직접 문자열 처음부터 반복하면서 알맞게 잘라내줬다 원본 튜플은 어떻게 찾을까? 원본 튜플의 부분집합들이 주어지니까 가장 많이 등장하는 원소가 가장 앞 원소임을 알 수 있다 등장 ..

알고리즘 스프린트 11일차 - [프로그래머스] Lv 3. 코딩테스트 연습 https://school.programmers.co.kr/learn/courses/30/lessons/118668 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 2시간.. 계획 접근법을 조금 일찍 떠올렸더라면, 더 빨리 풀 수 있었을텐데 조금 아쉽다. 히든 케이스가 있어서 거기서도 조금 애를 먹었다. 풀이 dp[i][j] 로 알고력이 i, 코딩력이 j가 되기까지 걸리는 시간을 적을 것이다. now_alp, now_cop 가 현재 알고력과 코딩력이라 생각하고 next_alp..

알고리즘 스프린트 10일차 - [프로그래머스] Lv 3. 징검다리 건너기 https://school.programmers.co.kr/learn/courses/30/lessons/64062 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 1시간 20분 고민했지만 풀이 실패.. 계획 징검 다리 문제만 보면 DP가 떠올라서 습관적으로 DP로 접근했는데, 범위가 20만 제곱인 걸 간과했다. DFS도 뭐 될리가 없지만 풀이가 떠오르지 않아서 DFS 백트래킹으로 해봤지만 어림도 없었다 풀이 나의 풀이는 아니지만 chatGPT에게 물어보니 이분 탐색을 활용하면..

알고리즘 스프린트 9일차 - [프로그래머스] Lv 2. 멀쩡한 사각형 https://school.programmers.co.kr/learn/courses/30/lessons/87946 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 15분.. 계획 풀이 DFS check 배열과 k값을 감소시키면서 탐색했다 반복문으로 모든 던전 돌면서 현재 피로도로 들어갈 수 있는지 탐색했던 곳은 아닌지 확인한다 두 조건 다 만족할 경우 다음 깊이로 들어간다 결과 코드 더보기 var answer = 0; function solution(k, dungeons) { l..

알고리즘 스프린트 8일차 - [프로그래머스] Lv 2. 멀쩡한 사각형 https://school.programmers.co.kr/learn/courses/30/lessons/62048 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 1시간 문제 접근 방식은 빨리 찾았지만 자료형 처리가 난관이었다... 계획 어떻게 풀까 고민을 하면서 수학적으로 접근하면 좋을 것 같다는 생각이 들었고, 일차 방정식을 활용한 풀이가 떠올랐다 풀이 answer에 전체 영역의 넓이를 저장한다 대각선을 1차 방정식으로 보고 기울기를 w/h로 구한다 방정식의 치역의 범위를 계..

알고리즘 스프린트 7일차 - [프로그래머스] Lv 2. 조이스틱 https://school.programmers.co.kr/learn/courses/30/lessons/42860 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 소요시간 1시간 10분 계획 풀이 이름의 각 알파벳을 A에서의 거리로 치환한다 유니코드 값을 이용한 계산을 활용한다 좌,우 양방향으로 A가 아닌 곳을 탐색한다 이름의 길이가 20을 넘지 않았기에 재귀로 탐색 가능할 것이라 판단했다. DFS를 활용하여 탐색하였다 A가 아닌 지점을 모두 탐색하였을 때를 기저조건으로 정한다 기저조건에 해당..