전체 글
-
[Typescript] 느낌표 연산자TypeScript 2022. 1. 26. 10:10
변수 뒤에 오는 !는 non-null assertion 연산자로, 해당 expresssion이 null 또는 undefined가 될 수 없다고 단언하는 것이다. https://stackoverflow.com/questions/42273853/in-typescript-what-is-the-exclamation-mark-bang-operator-when-dereferenci In Typescript, what is the ! (exclamation mark / bang) operator when dereferencing a member? When looking at the sourcecode for a tslint rule, I came across the following statement: if (nod..
-
ReactNode.js/프론트엔드 2021. 12. 3. 10:53
1. UI를 빌드하기 위한 오픈 소스 라이브러리다. 2. 프레임워크가 아닌 라이브러리다. 3. UI에 집중한다 (HTTP request 핸들링, 라우팅은 다른 라이브러리들이 해줌.) 컴포넌트 기반 아키텍처 어플리케이션을 small encapsulated parts로 쪼갠 다음 복잡한 UI로 composed 된다. → 재사용 가능한 코드 선언적 React에 UI가 어떻게 생겼는지 알려주면 React가 그것을 실제 UI로 빌드해준다. DOM 업데이트 가장 비용이 많이 드는 연산 중 하나인데 React에서 그것을 멋지게 핸들링해준다. npx : npm package runner npx가 있으면 패키지를 전역 설치 안 하고 바로 사용할 수 있다 예) npx create-react-app JSX(JavaScrip..
-
NextJSNode.js/프론트엔드 2021. 11. 25. 12:30
1. package.json package.json의 scripts의 build 명령어 => production 배포하기 전에 nextjs 어플리케이션 빌드(컴파일) start 명령어 => 컴파일된 어플리케이션을 production 모드에서 실행. nextjs는 자체 서버를 가지고 있기 때문에 start 명령어가 필요함. 완전한 static 사이트를 개발할 때는 build만 하면 됨. build => start 순서 2. next.config.js nextjs 설정 파일 reactStrictMode : unsafe life cycle, legacy api usage 등등 3. .next 폴더 dev나 build 스크립트 실행 시 생김. nextjs 어플리케이션이 served됨. build output 저..
-
[Docker] Elasticsearch 설치카테고리 없음 2021. 7. 30. 13:53
1. 엘라스틱서치와 키바나 이미지를 가져온다. docker pull docker.elastic.co/elasticsearch/elasticsearch:7.6.2 docker pull docker.elastic.co/kibana/kibana:7.6.2 2. 네트워크 생성 docker network create somenetwork 3. 엘라스틱서치와 키바나 컨테이너를 실행한다. 엘라스틱서치 docker run -d --name elasticsearch --net somenetwork -p 9200:9200 -p 9300:9300 -e "discovery.type=single-node" elasticsearch:latest 키바나 docker run -d --name kibana --net somenetwo..
-
TS 파일 컴파일 후 실행 시 절대 경로 인식 못하는 문제 해결 (tsconfig-paths)에러 2021. 7. 1. 20:11
절대 경로를 사용하기 위해 tsconfig.json 파일을 아래와 같이 작성했다. 그 다음 rimraf ./dist && tsc && node dist/server.js 명령으로 ts 파일들을 컴파일한 후 서버를 실행시켰는데 아래와 같은 에러가 발생했다. dist/server.ts를 실행시키던 도중 src/로 시작하는 절대 경로를 인식하지 못하여 모듈을 찾을 수 없다는 에러가 발생한 것이다! node dist/server.ts 명령어를 ts-node -r tsconfig-paths/register dist/server.ts 로 수정하여 문제를 해결했다! 에러 없이 실행이 잘 된다!
-
TS + Sequelize | Error: SyntaxError: Cannot use import statement outside a module 해결 방법Node.js/백엔드 2021. 6. 3. 12:14
프로젝트 진행 중 Sequelize 설정 후 DB 생성을 위해 npx sequelize db:create 명령어를 입력했는데 다음과 같은 에러를 맞닥뜨렸다. config.ts를 읽는 도중 발생한 에러다. 이는 ts-node가 .sequelizerc 파일을 트랜스파일 대상으로 인식하지 못하여 발생한다고 한다. config.ts는 ES6 문법(import export)을 사용하고, Sequelize는 CommonJS(require, module.exports)를 사용하여 충돌이 생긴 것이다. .sequelizerc를 컴파일할 때 ts-node가 불러와지도록 require('ts-node').register({ /* options */ })를 .sequelizerc에 추가해주면 에러가 해결된다.
-
Redux의 원리와 불변성Node.js/프론트엔드 2021. 5. 14. 01:14
Redux는 JS 어플리케이션에서 state를 관리하는 라이브러리다. 다시 말해서, 어플리케이션의 데이터를 관리하는데 사용한다. 어플리케이션의 state는 store라는 객체 트리에 저장된다. state는 불변성을 지니고 있다. state 객체와 그것의 프로퍼티를 직접 바꿀 수 없다. 즉 새로운 object를 생성하고, 새로운 상태를 다시 계산한 후 그것을 새로운 object로 업데이트한다. reducer는 이전 state와 action을 갖고 있고, 새로운 state를 리턴하는 함수이다. Actions : Action은 수행해야할 action의 종류를 정의하는 type 필드와 정보나 데이터를 담고 있는 필드들을 가지고 있다. Action Creator는 action을 리턴하는 함수이다. Reducer ..
-
CookieNode.js/백엔드 2021. 5. 1. 06:40
쿠키(cookie)란 브라우저에 저장 가능한 작은 데이터 조각이다. HTML5에서 WebStorage API (LocalStorage, sessionStorage) 가 소개 되기 전까지 브라우저에 데이터를 저장할 수 있는 유일한 방법이었다. 쿠키는 4KB(=4096byte) 미만의 하나의 문자열이고, 브라우저에 저장된 후 document.cookie 로 접근할 수 있으며 세미콜론(;)으로 구분된 key-value 쌍을 포함하고 있다. document.cookie를 통한 쿠키 연산 document.cookie 는 getter와 setter를 가진 object다. document.cookie로 새로운 값을 할당하면 setter 가 동작한다. 모든 쿠키는 하나의 스트링으로 저장되기 때문에 아래와 같은 방법으로..