본문 바로가기

분류 전체보기

Programmers - 다리를 지나는 트럭 / Javascript function solution(bridge_length, weight, truck_weights) { //첫번째로 건널 트럭을 truck_weights배열에서 뽑아줌 const firstTruck = truck_weights.shift(); //다리의 길이 - 1만큼 다리 배열을 만들어 준 후, let bridge = new Array(bridge_length - 1).fill(0); //다리배열의 마지막에는 아까 뽑은 트럭을 마지막에 push해줌 bridge.push(firstTruck); //현재 다리의 무게 let bridgeWeight = firstTruck; //시간 let time = 1; //다리의 무게가 0이 되면 모든 트럭이 건넜다고 봄 while(bridgeWeight) { //다리배.. 더보기
Programmers - 베스트앨범 / Javascript const solution = (genres, plays) => { // 장르별 총합 const genresSum = genres.reduce((obj, genre, i) => { obj[genre] = obj[genre]? obj[genre] + plays[i] : plays[i] return obj; }, {}); // 장르 순서 정렬 const sortedGenres = Object.entries(genresSum).sort((a, b) => b[1] - a[1]).map((genre) => genre[0]); // 장르명, 플레이수, 고유번호, 장르순서로 새로운 배열 생성 const sortedPlays = plays.map((playNum, i) => { const genreOrder = sor.. 더보기
git push 403 error시 url 변경으로 해결하기 회사 놋북으로 잠깐 개인 프로젝트 깃헙에서 pull 받은 다음에 커밋후 push 하려고하니 해당 저장소에 접근 권한이 없어 403 forbidden 에러가 떴다. SSH로 해결하는 방법이 있지만 나는 remote url 변경으로 해결하였다. 터미널에 아래 push 하려는 repo주소를 입력해서 설정해주면된다. git remote set-url origin https://[USERNAME]@github.com/[USERNAME]/[REPOSITORY].git 변경 후 아래 명령어로 변경된 url 이 다시 잘 적용되어있는지 확인한다. git remote -v 그리고 나서 push 하면 깃헙 비밀번호를 요구하는데, 비밀번호를 맞게 입력하면 정상적으로 push가 된다. 더보기
styled-components<💅>를 써보았다. 🤔 써보고 싶었던 이유 옛날에 만든 프로젝트들을 리팩토링 할 겸 꺼내봤다가 이걸 무슨 생각으로 썼지 싶은 코드들에도 충격 받은건 둘째치고 컴포넌트 별로 따로있는 SCSS파일이 너무 보기가 싫었다. 막 개발공부 시작했을 때 만든 프로젝트라 SCSS 배워본다고 튜토리얼에서 본대로 따라 만들었었는데, 다시보니까 매우 간단한 프로젝트라서 CSS코드도 별로 없는데 굳이 별도의 파일을 만들어서 디렉토리가 지저분하게 길어지는게 보기에 좋지 않았다. 게다가 각각의 컴포넌트를 개별 폴더에 저장했었는데, import 할때 경로 길어지지말라고 index.js파일에서 컴포넌트를 다시 export해줘서 이렇게 되면 컴포넌트 하나당 총 파일이 3개(예를들면 Button.jsx, Button.scss, index.js)가됨...;.. 더보기
CRA로 만든 리액트 프로젝트에서 eject하지 않고 optional chaining 사용하기 CRA로 만든 프로젝트에서 optional chaining을 사용하려고 하니 이를 지원하지 않기 때문에 babel config에 해당 플러그인을 설치하라는 메세지가 떴다. CRA eject를 할 경우 숨겨져있는 모든 설정들과 프로젝트가 가진 디펜던시들이 밖으로 나오기 때문에 너무 복잡하기도 하고 한번 eject한 프로젝트는 다시 되돌릴 수 없기 때문에 굳이 optional chaining 하나를 쓰자고 eject를 하는 것은 불필요해 보였다. 따라서 라이브러리들을 설치해서 비교적 간단한 방법으로 커스터마이즈 해주는 방법을 선택했다. npm i -D @babel/plugin-proposal-optional-chaining customize-cra react-app-rewired @babel/plugin-p.. 더보기
이미 깃헙 repo에 올라간 파일에 .gitignore 적용이 안되는 경우 이미 깃헙 repo에 commit후 push해버린 파일들을 추후에 .gitignore에 추가할 때가 있다. 예를 들면 node_modules 폴더를 초기에 .gitignore에 설정해놓지 않고 그냥 repo에 올려버렸는데, 나중에 .gitignore에 node_modules/ 를 추가하더라도 이미 git은 node_modules안의 파일들을 tracking 하고있기 때문에 이미 트랙킹 중인 파일들을 무시되지 않는다. 먼저 아래 명령어들에 대해 살펴보자. rm git을 사용하지 않는 rm은 작업 디렉토리에서 파일을 삭제하는 명령어이다. git rm git을 사용한 rm은 작업 디렉토리와 스테이징 영역에서 파일을 삭제 시킨다. git rm --cached --cached를 뒤에 붙이면, 스테이징 영역에서만 .. 더보기
Webpack 간단 정리하기 웹팩...봐도봐도 넘나 어려운 그것...웹팩에 대해 오늘 공부해 본 내용을 간단하게 정리해보고자 한다. 웹팩 핸드북은 내가 본 웹팩관련 사이트나 블로그 글중에 가장 설명히 간결하고 이해하기 쉽게 되어있어서 웹팩에 대한 개념을 정리하기에 정말 좋았다. 그리고 Jaehee'sWebClub 이 분 블로그에는 웹팩 핸드북의 더 디테일한 버전의 글이 올라와있는데, 핸드북으로 훑은 내용을 더 자세하게 읽어볼 수 있다. 추가적인 플러그인이나 더 자세한 내용에 대해서는 공식 문서에도 꽤 잘 나와있는 편이기 때문에 공식 documentation을 읽어 보는 것도 좋은 방법이다. 링크는 맨 아래 참고자료에 적어두겠다. 웹팩은 무엇인가? 작은 코드조각인 모듈들을 병합, 압축해서 하나로 만들어준다. 이러한 작업을 빌드, 번들.. 더보기
잘못된 계정으로 push한 경우 commit의 author 변경하기 새 프로젝트 세팅하다가 커밋을 했는데 잔디가 심어지지 않아서 보니까 잘못된 계정으로 커밋이 되었다. 이런적이 두어번 있기도 했었고 잔디는 중요하기 때문에(?) 이럴 경우 어떻게 해결하면 되는지 블로그 글로 남겨놓고자 한다. 참고로 나는 vscode를 사용중이므로 vscode terminal에서 진행했다. 1. 위의 이미지에서 수정이 필요한 커밋의 해쉬코드는 b800df08인데, 아래의 rebase 명령어를 사용할 때는 수정하고자 하는 커밋의 ⭐직전커밋⭐의 해쉬를 넣어준다. 나 같은 경우에는 34eabfaa를 넣어주면 된다. git rebase -i -p 34eabfaa 2. 명령어를 치면 아래와 같은 vim editor가 뜨는데, 수정하고자 하는 커밋 앞의 단어 pick을 edit으로 바꿔준다. *vim.. 더보기
Next.js 프로젝트에서 .env 변수 사용하기 dotenv-webpack라이브러리를 설치한다. npm install dotenv-webpack 다음은 next.config.js파일에서 Dotenv 플러그인을 webpack과 연결 시켜준다. const Dotenv = require("dotenv-webpack"); module.exports = { webpack: (config) => { // 기존의 웹팩 플러그인에 새로운 Dotenv플러그인을 연결시켜준다. // silent는 옵션은 .env파일을 찾지 못했을 때 에러를 일으키지 않도록 설정해주는 옵션이다. config.plugins.push(new Dotenv({ silent: true })); return config; } }; 이렇게 하고나면 process.env.변수명으로 .env파일에 설정한.. 더보기
레포지토리의 하위폴더를 분리해서 새로운 레포지토리로 만들기 포폴 정리를 하다가 관리도 편하고 자동 배포도 편할 것 같아서 백엔드와 프론트엔드를 같은 레포에서 관리하고 있는 프로젝트를 따로 나누기로 했다. 기존 디렉토리는 아래와 같이 project라는 폴더 안에 frontend와 backend가 나뉘어져 있는 상태이고, project라는 폴더에서 backend 서브 디렉토리를 별도의 깃 레포로 분리하고자 한다. project/ frontend/ backend/ 1. 깃헙에 새롭게 만들 repo를 만들어준다. 나 같은 경우는 백엔드를 분리하는 거라 project-backend로 명명함. 2. 터미널에서 분리하고자 하는 프로젝트의 폴더로 이동 후 아래의 명령어를 입력한다. 분리하려는 서브 디렉토리의 '이름'을 입력하는 것이지 경로를 입력하는 것이 아님에 주의한다. $.. 더보기

티스토리툴바