전체 글 132

[Linux]자주 사용하는 터미널 명령어 모음

1. 파일 찾기, 특정 문자열 찾기 find 찾을 경로 -name '파일명' find 찾을 경로 -name '특정문자열*' find 찾을 경로 -name '*특정문자열' find 찾을 경로 -name '*정문자열*' 예) find /usr/ -name '*-bin*' 2. gz 파일 풀기 (이건 자주 사용하지는 않음) gunzip '파일명'.gz 3. chmod : 권한 변경시 유용 //1. 모든 사용자가 읽기(r)/쓰기(w)/실행하기(x) 불가 $ chmod 000 '파일명' //2. 모든 사용자가 읽기(r)/쓰기(w)/실행하기(x) 가능 $ chmod 777 '파일명' //3. 소유자(u)는 모든 권한 부여, 그룹 및 그 외 사용자는 읽기(r)/실행하기(x)만 가능 $ chmod 755 '파일명' /..

TIL 2022.09.03

인텔리제이 명령어로 실행

1. Window(윈도우) (1) 환경변수 등록 윈도우 + R - sysdm.cpl 입력 후 확인 탭 메뉴 - [고급] - [환경변수] 사용자 변수 - [편집] 환경변수 지정 - 로컬에 인텔리제이 설치 경로 확인 경로 참고) C:\Program Files\JetBrains\Intellij IDEA 버전\bin (2) 터미널에서 idea 또는 idea64(64bit인 경우) 명령어 입력하여 실행 idea . 또는 idea64 . 2. MacOS(맥) [Tools] - [Create Command-line Launcher]

TIL 2022.08.31

npm install 시 node-sass error

https://velog.io/@corner3499/Node-sass-%EC%84%A4%EC%B9%98-%EC%97%90%EB%9F%AC 1. node-sass 버전 지정 설치 npm i node-sass@4.14.1 or npm i node-sass@4.9.0 2. window build tools 사용해서 패키징 설치 npm install --global --production windows-build-tools 3. yarn upgrade로 패키지 업데이트 & yarn add node-sass yarn upgrade yarn add node-sass yarn add node-sass@4.0.0 으로 버전지정 재설치 package.json에 설정된 node-sass 버전이 로컬에 설치된 node 버전..

error일지 2022.08.31

emotion - You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).

emotion 설정이 제대로 되지 않았을 때 발생하는 오류 👉해결 방법 : babel 설정이 따로 필요하다고 한다. (왜? 🤔) 1. 일단 필요한 패키지들을 설치 해준다. npm i @emotion/core @emotion/react @emotion/styled @emotion/babel-preset-css-prop 2. 약간의 설정이 필요하다. webpack.config.ts(x) 파일 루트 경로에 생성 3.

error일지 2022.08.24

[Redux]미들웨어(middleware)

🤔 미들웨어는 무엇인가? action에서 선언된 state를 변경하는 부분이 dispatch를 통해 실행되기 전에 동작한다. 즉, action 과 dispatch 사이에서 일어나는 동작을 제어하는 도구라고 이해하면 되겠다. 비동기를 구현할 때 용이하며, 리덕스에 비동기 관리 tool로는 redux-thunk, redux-saga 정도가 있다. [기본 템플릿] const middleware = store => next => action => { (1) next(action) //기본 기능 : action이 dispatch를 통해 실행된다. (2) } 함수가 중첩된 형태이다. 파라미터가 3개 이고 return 문이 2개인 고차함수 형태이다. 이를 function 으로 다시 작성해본다면, function mi..

Frontend/React 2022.08.14

[Redux] 관심사의 분리(SoC)

👉 관심사의 분리 (Seperation of Concerns) : 특정한 관심사에 따라 기능을 구분하여, 각 기능들마다 개개의 관심사를 해결하기 위한 코드를 작성하는 패턴이다. 함수를 최대한 간결한 형태로 구현하여, 프로세스의 복잡도를 낮추고, 재사용성을 높이며, 유지보수를 원할하게 합니다. 리덕스도 이 "관심사의 분리"를 통해 폴더 구조를 나누어 볼 수 있는데, 크게 나뉠 수 있는 파트가 "리듀서(reducer)"와 "액션(action)" 이다. 예를 들어, 데이터를 기준으로 유저와 관련된 기능들은 user.js 에 다 넣어두고 사용, 마찬가지로 게시글과 관련된 기능들은 boards.js에서 관리한다. 리듀서 같은 경우는, 순수함수로 정의가 되어 있기 때문에 분리하기 굉장히 편리하다. const ini..

Frontend/React 2022.08.14

[Redux] 리덕스 원리 이해하기

🤔 리덕스란 몰까..? 그리고 왜 사용하는 걸까? https://ko.redux.js.org/ Redux - 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너. | Redux 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너. ko.redux.js.org 프로젝트의 depth 가 깊어지면서 컴포넌트간에 state를 주고 받고, 넘나드는 것이 점점 복잡해진다.. 이를 해결 하기 위해 최상위 컴포넌트에서 전역변수로 한꺼번에 선언해서 여러 곳에서 사용하기 위해 사용한다. 리덕스를 사용하게 되면, state로 일일히 선언하지 않아도 된다! 👉 리덕스의 장점 - action을 실행할 때 dispatch 의 히스토리를 확인할 수 있다.(에러 핸들링에 용이) - git reset 처럼 이전 action으로 되돌릴 ..

Frontend/React 2022.08.13

[git]이미 커밋된 작성자 변경하기 (git author change)

user.name, user.email을 여러 기기에서 변경하면서 사용하다보니 꼬이게 되었다. 내 잔디밭을 가꾸기 위해서..! 커밋 작성자를 변경해보도록 한다. 1. git config로 현재 user.name , user.email 확인하기 global로 설정했을 경우 --global 옵션을 추가하면 됨. 나의 경우는 한 pc에서 개인 계정 & 회사 계정을 동시에 사용하고 있어서 global 옵션은 사용하지 않았다. git config user.name git config user.email 2. user 변경 git config user.name "변경할 이름" git config user.email "변경할 이메일" 3. 이미 커밋된 리스트 한 줄로 확인하기 git log --oneline 여기서 ..

git 2022.08.13