profile
정리하는 개발자
post-thumbnail

타입스크립트

node와 npm이 설치되어 있다는 가정하에, 타입스크립트와 타입스크립트를 터미널에서 실행해줄 수 있는 ts-node를 전역에 설치합니다.npm install -g typescript ts-node

6일 전
·
1개의 댓글

프론트에 express 설치하기 by.react-bird

npm i express morgan express-session cookie-parser dot-envnpm i -D nodemon설치 후에는 루트폴더 안에 server.js를 만들어 설정을 해줍니다.package.json에서 npm run dev 부분을 nodemo

2020년 2월 10일
·
0개의 댓글

sequelize etc

1) [DB].findOne({key:value}) 디비에서 하나만 찾으세요. 2) [DB].create({key: value}) 디비에 내용을 넣으세요.

2020년 1월 20일
·
0개의 댓글

API 만들기

API란? 다른 서비스가 내 서비스의 기능을 실행할 수 있게 열어둔 창구. api 만드는 틀 index.js routes/user

2020년 1월 16일
·
1개의 댓글

mysql과 sequelize 연동하기 by. react-bird

mysql 설치 와우.. 처음 설치해보는 DB입니다.. 두근두근했는데 역시나 잘 깔리지 않았어요 ㅠ_ㅠ homebrew를 이용해 설치했지만 결국 환경변수 설정도 필요했습니다. homebrew를 설치했다는 가정하에 brew 명령어로 디비를 설치합니다. 그리고 mysql을 실행합니다. 그리고 위와 같이 작성했는데 not found같은 오류가 나온다면 환경변...

2020년 1월 16일
·
0개의 댓글

express를 이용한 기본 세팅 by. react-bird

초초간단 세팅 index.js (1) express 환경을 사용함. (2) 8080 포트를 주시하고 있다가 해당 포트로 요청이 들어오면 두번쨰 인자를 실행시킵니다. (3) 라우터 설정 (4) 미들웨어 사용하게 해주는 명령어. 첫 번째 파라미터는 경로이지만 모든 곳에서 사용할 것이라면 생략 가능하다. 이전에 react-bird 프로젝트에서 설정해놓은 것 ...

2020년 1월 12일
·
0개의 댓글

node server 환경설정 by. react-bird

Back and Front 흔히들 부르는 backend, frontend 개발.. 그게 뭐냐는 질문도 참 많이 받습니다. back - DB와 데이터의 로직을 정의 front- 화면을 만들고 화면과 데이터를 연결 node 시작 node 프로젝트를 생성하는 명령어죠. > npm init 서버로 만들기 노드는 자바스크립트 실행기지만, http 모듈을 갖고 있...

2020년 1월 12일
·
0개의 댓글

미들웨어 연결하기 redux-saga

미들웨어를 사용하는 이유 리덕스에서 리듀서는 순수함수여야 하는 규칙이 있습니다. 지키지 않는다고 오류가 나는 것은 아니지만, state가 동일한지 여부를 따져서 리덕스가 동작하기 때문에 state를 만드는 리듀서 자체에 같은 인풋에 따른 같은 아웃풋 값을 보장할 수 없다면 불필요한 연산이 실행될 수 있습니다. 따라서 리듀서를 순수함수로 남겨두기 위해 red...

2020년 1월 8일
·
0개의 댓글

애플리케이션에 리덕스 붙이기

리듀서까지 만들었다면 이제 붙여서 확인해볼 수 있는 준비는 완료된 것입니다. 하나씩 해보도록 합시다 >_< 잠깐, next.js를 사용하신다면.. 현재 next.js로 프로젝트를 만들면서 블로그 작성중이라 next.js에 대한 내용이 추가되네요. 이 시리즈에서 next.js를 사용하신다면 추가로 설치해야 할 게 있습니다. reducer 합치기. 보통 하...

2020년 1월 7일
·
0개의 댓글

next.js에 styled-components 적용 고군분투기. by. react-bird

Intro 이전부터 프로젝트에 styled-components를 편하게 잘 사용하고 있기도 했고, 강의도 마침 이 플러그인을 사용하였습니다. 다만 강의는 무지 뒤편에서 이 플러그인을 적용시키는데 저는 아직 거기까지 강의를 보지 않았기 때문에 (-.-) 적용하는데 뭔 문제있겄나.. 하고 넣었다가 엄청 헤맸네요. antd와 styled-components 적용...

2020년 1월 3일
·
0개의 댓글

node, react, next, eslint 환경구성하기. by. react-bird

intro 매번 회사에서만 react 프로젝트를 해보니 깃허브에 올리지도 못하고 해서, 이번엔 react 프로젝트를 시작하려고 합니다. 인프런에 있는 node-bird강의를 모티브로 하여 그 과정에서 기록해두면 좋을 만한 것들을 적어나갈 생각입니다. node 환경 구성 node.js는 꼭 서버만을 의미하는 것이 아닙니다. 자바스크립트 실행기로서 자바스크립...

2020년 1월 1일
·
0개의 댓글

브랜치 삭제

로컬 브랜치 삭제 원격 브랜치 삭제

2019년 12월 25일
·
0개의 댓글

web front-end environment settings (웹프론트엔드 환경설정)

들어가며.. 모듈 시스템을 사용하여 프론트 소스를 좀 더 체계적이고 보기 쉽게 관리하고 싶었습니다. 리액트 프로젝트를 할 때는 늘 CRA 혹은 이미 만들어져 있는 환경에서 작업을 하여 webpack에 대해 깊이 생각하지 않았습니다. 그러나 스스로 환경을 구축해 보고 싶고, 리액트까지 쓸 필요가 없는 간단한 홈페이지에도 babel, webpack만 적용하여 ...

2019년 12월 24일
·
0개의 댓글

useCallback

useCallback이란 react hooks 중의 하나. 함수로 인한 렌더링 성능을 최적화하는 용도로 사용됩니다. 자바스크립트에서 참조형은 같은 모양을 지녔다고 해서 같은 값으로 취급되지 않죠. 예를 들면 {} === {}의 결과값은 false입니다. 함수도 참조형 데이터이기 때문에 늘 새로운 값으로 취급되어 동일성을 보장받지 못하므로 리액트에서 매번 새...

2019년 12월 10일
·
0개의 댓글

네이버 홈페이지형 블로그 꾸미기

시작하기 블로그에 들어가면 프로필이 있는 곳 아래쪽에 관리|통계 버튼이 있습니다. 관리 버튼을 클릭하여 시작합니다. 1.jpg 레이아웃 잡기 [꾸미기 설정] > [레이아웃·위젯 설정]으로 들어갑니다. 홈페이지형 블로그를 하기 위해서는 우측에서 2번째 위치한 레이아웃을 선택하세요. 스크린샷 2019-12-10 오전 11.30.10.png...

2019년 12월 10일
·
0개의 댓글

자바스크립트의 비동기 처리

비동기처리란? 동기와 비동기는 서로 상반되는 말인데요. 우선, 동기는 A의 일이 끝나야만 B의 일이 끝나고 C의 일을 시작하는... 의 식으로 앞의 일이 끝나야만 뒤의 일을 진행할 수 있는 처리 방식을 말합니다. 비동기는 반대로 동시의 여러 함수를 호출하거나 하나의 일이 끝나기 전에 다른 함수를 호출할 수도 있습니다. 비동기로 처리를 하게 되면 동시에 여...

2019년 12월 6일
·
0개의 댓글

온라인 에디터, 온라인 텍스트편집기, Online editor

정말 수 많은 온라인 에디터들이 있습니다. 그 중 저는 프론트엔드 개발 측면에서 그 동안 써봤던 것과 좋다고 생각하는 것 몇 가지만 추려봤습니다. > cf) 온라인 에디터를 제법 많이 모아놓은 사이트 https://blog.gaerae.com/2015/06/website-run-execute-code-online.html codepen > https:/...

2019년 12월 4일
·
0개의 댓글

component

component란? 독립적으로 동작 가능한 UI 요소 HTML 템플릿, 스타일, 로직을 결합( 형태 표현과 기능 제어 ) DOM과 같은 트리 구조 W3C 표준 웹컴포넌트 기술 기반 https://developer.mozilla.org/ko/docs/Web/Web_Components react와 달라보이는 점 angular는 리액트와 달리 컴포넌트와 템플...

2019년 12월 3일
·
0개의 댓글

ng cli

ng ng는 앵귤러의 명령어입니다. 이것을 통해 기본적인 사용법들을 봅시다. 프로젝트를 생성했다는 가정 하에, 사용법입니다. 프로젝트 서버 실행 문법 테스트 테스트 angular.json에 있는 설정 변경 배포

2019년 11월 29일
·
0개의 댓글

Angular quick start

Before start Angular 앵귤러를 시작하기 전에 설치되어야 하는 것들은 node.js, text editor가 필요합니다. Development environment setting 앵귤러 전역 공간에 설치 프로젝트 생성. ng: 앵귤러 명령어 new: 새 프로젝트 생성 server 구동

2019년 11월 29일
·
0개의 댓글