본문 바로가기
  • 살짝 구운 김 유나

분류 전체보기146

[Next.js] 개발환경 설정 기본적으로 리액트 개발 환경과 동일하다 - 코드 에디터 - nodeJS - GIT nvm으로 node version 업데이트하기 더보기 nvm 설치 https://github.com/coreybutler/nvm-windows/releases Releases · coreybutler/nvm-windows A node.js version management utility for Windows. Ironically written in Go. - coreybutler/nvm-windows github.com node 버전 목록 확인하기 원하는 node 버전 설치하기 사용하고자 하는 node 선택하기 [공식문서] Next.js by Vercel - The React Framework for the Web Used.. 2023. 4. 25.
[Next.js] 왜 Next.js를 쓸까? Next.js? 웹 어플리케이션을 만들기 위해서 사용할 수 있는 React Framework Libraries => 특정한 문제들을 해결하기 위한 tool을 가져다 쓸 수 있음 Framework => 큰 단위의 전체적인 솔루션(골격)을 제공함 ex) Routing, UI, HTTP Clients, 상태 관리 => 리액트로 웹앱을 개발하는데 리액트 만으로는 힘든 많은 것들을 가능하게 해줌 Next.js의 6가지 원칙 - 복잡한 설정을 하지 않아도 - 자바스크립트를 사용해서 full stack 가능 - 자동으로 code split & sever rendering - 데이터를 어떻게 패칭할 것인지 설정 가능 - 결과를 미리미리 예측 - 손쉬운 배포 Web App에서 쓸 수 있는 4가지 렌더링 방식 CSR (C.. 2023. 4. 25.
[Lv.2] 과제 진행하기 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/176962 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 (programmers의 질문하기 답변 참고) 1. 과제 목록의 시간을 분단위의 숫자로 변환하여 시작시간이 빠른 순서대로 정렬한다. 2. 현재 시간을 1분씩 증가시키면서 2-1. 시작해야 할 과제가 있다면 스택에 삽입한다 2-2. 그렇지 않다면 스택의 맨 마지막 원소 과제를 1분씩 진행한다. 이때, 진행중인 과제가 완료되면(시간이 0이 된 경우) 과목명을 answer에 추가한 후 po.. 2023. 4. 22.
[LV.2] 요격시스템 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/181188 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function solution(targets) { // 요격 횟수 var answer = 0; // 구간의 시작을 중심으로 오름차순 정렬 targets.sort((a, b) => a[0] - b[0]); let point = 0; // 범위의 끝을 기억하는 변수 targets.forEach((target) => { // 일단 한발 쏘기 answer++; // 미사일 구간이 이전에 쏜.. 2023. 4. 17.
[Lv.2] 리코쳇로봇 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/169199 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 - 최단거리를 구하는 문제이므로 BFS를 이용한다. - 단순 너비우선과 달리 4방향을 탐색하면서 while문을 사용하여 미끄러져야 한다. - 다른 방향으로 미끄러질 수 있으므로 벽에 부딪히거나 장애물을 만났을때 멈춘 좌표만 방문처리를 해주자. 코드 function solution(board) { var answer = 0; const rows = board.length; const c.. 2023. 4. 17.
[Lv.2] 미로 탈출 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/159993 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 시작점에서 레버까지, 레버에서 도착점까지의 최단 거리의 합을 구한다 최단거리라 BFS 사용함 왜 이렇게 시간초과가 날까 했는데 내가 visited를 아주 비효율적으로 생성하고 있었다 어디서 본 건지는 모르겠지만,, 절대 이렇게 하면 안되고,, let visited = new Array(row) for(let i = 0; i< row;i++) { visited = new Array(co.. 2023. 4. 11.
[Lv.2] 양궁 대회 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/92342 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 재귀 DFS로 풀었고, 1. 라이언이 화살을 쏘는 경우 (라이언이 점수 획득) 2. 라이언이 화살을 쏘지 않는 경우 (어피치가 점수 획득 / 둘 다 쏘지 않음) 로 나눠서 풀었다. 과녁의 끝에 도달했을 때에는, 라이언과 어피치의 점수차가 현재의 최댓값보다 큰 경우에만 최대 점수 차이, 라이언의 과녁판을 갱신해주었다. !!! 점수가 가장 낮은 과녁판부터 살펴봐야 한다..!!! 코드 fun.. 2023. 3. 28.
[Lv.2] 호텔 대실 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/155651 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 - 문자열 시간을 숫자로 바꿔준다. - 체크인 시간, 체크아웃 시간 + 청소시간을 저장해둔다. - 입실 시간이 빠른 순서대로 정렬한다. - room 배열을 선언한 후, 순회하면서 체크인 하려는 시간이 어떤 방의 체크아웃+청소시간보다 늦은 경우 입실시키고 그렇지 않은 경우에는 새로운 방을 생성(push)한다. - 사용한 방의 개수(room.length)를 출력한다. 코드 function.. 2023. 3. 24.
XML to JSON - JavaScript, React Open API를 호출하면 데이터를 XML로 제공하기 때문에 이를 JSON으로 변환하는 과정이 필요했다. TypeScript로 하려고 했는데, 잘 모르겠어서 JS로~ XML parser 설치하기 $ npm install react-xml-parser // or $ yarn add react-xml-parser import import XMLparser from 'react-xml-parser'; 사용하기 XMLparser 생성후 parseFromString() 호출 new XMLparser().parseFromString(data) 전체코드 // bestkeyword.js // 이달의 키워드 조회 export async function getBestKeyword(year, month) { try { co.. 2023. 3. 22.
[Lv.2] 프린터 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/42587 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 - shift, push를 이용해서 큐로 해결하는 문제이다. - 각 문서의 인덱스를 저장하는 배열을 선언해서 우선순위와 함께 관리한다. - 그 이외에는 문제에서 요구하는대로 코드를 작성하면 된다. 코드 function solution(priorities, location) { var answer = 0; // 각 문서의 인덱스를 저장하는 배열 map let map = []; for (l.. 2023. 3. 21.