분류 전체보기

[LeetCode][Javascript] 189번 - Rotate Array

문제 189. Rotate Array 문제 설명 1차원 배열이 전해진 숫자만큼 오른쪽으로 회전하도록 만드는 문제. 이 문제의 풀이에는 크게 두 가지가 있는 것 같다. 오른쪽에 주어진 개수만큼 분리해서 왼쪽에 붙여 회전된 결과를 만들기 하나씩 오른쪽에서 떼고 왼쪽에 붙여서 회전하기 이 중 나는 1번으로 풀었다. (2번은 생각을 못 했다) 일단, 오른쪽으로 도는 횟수인 k는 nums의 총 길이를 넘지 않도록 제어해 주어야 한다. nums의 길이를 넘어가면 undefined로 계산하게 될 것이다. (2번 방법으로 풀더라도 반복 계산을 줄이기 위해 길이에 관한 계산을 먼저 해 주는 게 좋을 것이다.) 나머지 값을 계산해 k에 다시 저장하고, 0번부터 k를 뺀 개수만큼 splice를 해 따로 배열에 저장한다. 배..

[LeetCode][javascript] 122번 - Best Time to Buy and Sell Stock II

문제 122번 - Best Time to Buy and Sell Stock II 문제 설명 가장 이익이 크게 거래 누적값을 계산하는 문제 내가 이해한 제약조건은 크게 두 가지이다. 사기 전에는 팔 수 없고, 팔기 전에는 살 수 없다. 사는 값이 바로 이후에 팔 값보다 작으면 산다. 하지만 문제의 예시와 풀이가 살짝 맞지 않는 것 같다. 내가 푼 풀이가 나중에 보니 솔루션 중 하나였지만, Example 2번은 (2-1) + (3-2) + (4-3) + (5-4) 방식으로 계산되어 답이 나온다. 어쨌든 위의 두 조건에 맞춰 반복문을 돌며 누적값을 계산해 나가도록 풀었다. 성공 코드 const maxProfit = (prices) => { let result = 0; for (let i = 0; i < pri..

[리뷰] 리팩터링 2판 - 리팩토링을 해야 하는 이유

리팩터링 2판은 전반적으로 점진적 개선에 초점을 두고 있다. 그 중 나는 1, 2장을 자세히 읽고 나머지 부분은 키워드 위주로 빠르게 읽고 리뷰를 작성한다. 먼저 책에 대해 설명을 하자면, 이 책의 예시 코드는 모두 자바스크립트로 이루어져 있다. 하지만 자바스크립트 언어의 특성인 함수가 일급 객체인 부분이나 고차함수, ES6의 문법은 사용되고 있지 않다. 주언어가 다른 개발자여도 이 책을 보기에 거부감이 들지 않을 것이다. 자바스크립트를 배우고 있는 나로써는 오히려 자바스크립트의 언어적 특성을 살린 리팩토링 책이 있으면 더 좋았을 것 같다는 생각도 들었다. 나는 현재 짧은 프로젝트를 연속해서 하고 있다. 코드 리뷰도 받으면서 진행하고 있는데, 리팩토링을 해야 하는 코드라는 것은 알고 있지만 한 번 작성한..

[Node] npm vs npx vs yarn

npm, npx, yarn, bower 등은 모두 Node 프로젝트에서 설치되는 패키지들을 관리해 주는 툴이라고 할 수 있다. 나는 평소 npm을 사용하고, 서버에서 배포할 때는 npx 명령어를 사용했다. npm으로 설치하는 것과 같은 결과물이 나오는 다른 명령어가 있다는 것을 알게 되어 의미를 정리해 보고자 포스팅한다. NPM 자바스크립트 런타임 환경 Node.js의 기본 패키지 관리자 npm은 node package manager 라는 말 그대로 노드에서의 패키지 관리자이다. 자바스크립트 환경에서 프로젝트를 시작할 때 node와 함께 설치하라는 Getting Started가 많고, 사용빈도가 높다. NPX npx는 execute npm package binaries의 줄임말로, npm에 속해 있는 n..

[React + Emotion] 리액트에 글로벌 스타일 적용하기

Emotion 라이브러리를 사용해 reset.css를 적용할 수 있는 글로벌 스타일을 적용시키는 방법을 포스팅하려 한다. 1. [reset.jsx] html 기본 스타일을 없애주는 reset.css 스타일을 아래와 같이 넣고 저장한다. reset.css는 https://meyerweb.com/eric/tools/css/reset/ 를 참고해서 넣어주면 된다. 스크린샷에는 일부만 포함시켰다. 2. [App.js] 위의 리셋 스타일이 담긴 Reset.jsx를 import한다. emotion 에서 Global을 import한다. div 태그 안에 을 넣어 준다. Global 태그 아래로 다른 컴포넌트를 넣어주면 Global style이 적용된다.

[React] create-react-app(CRA)의 마법

리액트를 가장 빠르게 시작하는 방법 3가지 1. npx create-react-app my-app 2. npm init react-app my-app 3. yarn create react-app my-app 위의 세 가지 중 하나의 명령어를 입력하면 create-react-app이 설치가 시작돼 마법이 펼쳐진다. webpack, babel 등의 환경 설정을 따로 하지 않아도 바로 리액트로 개발을 시작할 수 있게 된다. 물론 서비스를 만드는 회사에서는 커스텀 환경을 더 많이 쓰겠지만, webpack, babel 등에 대해 완전한 이해가 없는 초보 개발자에게는 바로 개발을 시작할 수 있는 놀라운 환경을 제공해 주는 것이다. 직접 환경 설정을 하는 것도 중요하겠지만, 차근차근 해도 나쁘지 않을 것 같다. 나는..