본 글은 VELOPERT님의 블로그 글을 보고 스스로 필요할 때 보려고 써두는 글 입니다.문제 상황 : 도커를 사용한 리액트 프로젝트를 이어받아야 해서 clone받아서 열어보려고 했다. 도커도 설치하고 README.md 에 있는대로 했는데 돌아오는 에러는이런 에러였다.

디자인 패턴 중 하나이다. Model View Controller 의 약자 어플리케이션의 세 가지 역할로 구분한 개발 방법론.사용자가 controller를 조작하면 controller가 model을 통해 데이터를 가져오고 그 정보를 바탕으로 시각적인 표현을 담당하는 v

MIME 이란?Multipurpose Internet Mail Extensions의 약자로 간단히 말하면 파일 변환을 의미한다.현재는 웹을 통해 여러 형태의 파일을 전달하는데 사용하고 있지만 이 용어가 생길 땐 이메일과 함께 동봉할 파일을 텍스트 문자로 전환해서 이메일

백엔드 분들을 위한 엑셀 라이브러리(?) 백엔드에서 exel다운 받을 수 있게 api를 만들어주셨다. 클릭할 때 api호출해서 다운만 받으면 되는데 api 호출의 응답이 이렇게 왔다. ( 지극히 정상이다.) 어떻게 하면 이 응답을 이용해서 유저가 클릭하자마자 엑셀

모달 참고 블로그htmlcssjs

우리가 협업과 버전관리를 하여 개발하는데 아주 유용한 도움을 주고 있는 도구 git과 github같은 git 호스팅 사이트. 여태까지는 순수 개발하는 용도로만 사용하고 있었는데 최근에 github도 잘 쓰면 trello같은 기능도 있고 버그 뿐만아니라 개발용으로 iss

Create a Next.js App리액트로 웹 애플리케이션을 빌드하기 위해서 고려해야 할 중요한 점들 code는 webpack과 같은 번들러를 사용함으로서 번들되어야 하고 babel같은 컴파일러를 쓰면서 변환되어야 한다.code spliting같은 제품 최적화가 필요

한 달전 즈음에... lightweight chart를 쓴다고 블로그에 올린적이 있었다. 그때는 이렇게 데이터를 axios get을 통해서 받아서 실시간으로 보여주는게 아니라 가짜 데이터 생성해서 띄워만 놓은 내용이었다.그 이후 데이터 불러와서 변환하고 보내고 다 했는

aws서버 띄워서 봤더니 내가 만든 화면에서 css를 불러오지 못하는걸 보고 약간 충격스..급하게 해결해보려고 했는데 가장 큰 원인은 index.html을 건드렸었던 것이다. 두 번째는 절대경로로 만들어놨었는데 백엔드에서 상대경로로 잡아야 한다고 해서 이 문제 해결하면

총 세가지 카테고리 => 마운트, 업데이트, 언마운트마운트: 페이지에 컴포넌트가 나타남언마운트: 페이지에서 컴포넌트가 사라짐카테고리 별로 살펴보기1.마운트DOM이 생성되고 웹 브라우저 상에 나타나는 것은 마운트라고 한다.마운트 할 때 호출되는 메소드는컴포넌트 만들기 -

최근 작업하고 있는 페이지에서 light-weight chart라는 라이브러리를 사용했다. 매우 가볍고 간결하며 사용법도 어렵지 않다.google에 lightweight-chart를 검색하면 TradingView페이지에서 이 라이브러리에 대해서 살펴볼 수 있다.원하는

npm install styled-components @types/styled-componentsnpm install styled-resetsrc/styles/GlobalStyles.ts써주기.src/styles/theme.ts또,src/styles/theme-comp

npm install --save styled-componentsnpm install --save styled-reset

(이 글은 위코드 6기 프론트엔드의 후기로, 위코드 과정에 대해서 프론트엔드 설명이 대부분 입니다.)when & where?2020.01.28 ~ 2020.04.17 약 12주 동안 진행되었던 위코드 6기. 장소는 선릉역 10번 출구에서 7분정도 걸으면 나오는 선릉역

유닛 테스팅이란? -- 기능별로 쪼개고 그 기능 내부에서 사용되는 함수도 쪼개고 쪼개어 아주 작은 단위로 테스팅 하는것을 의미한다. 우리가 만든 소프트웨어가 제대로 작동 하는지 테스팅을 하기 위해서 쓰인다. 프로젝트가 커진다면, 매번 코드를 수정/새로 작성할 때마다

위코드 1차 프로젝트 코드를 다시 보다보니 label tag에 대해 공부하고 싶어져서 끄적끄적.. 우선 label은 html 의 tag중 하나이다. 과 을 연결하면 이점이 있다. 시각적인 것 뿐만 아니라 프로그래밍적으로도 관련이 있다. 예를 들어, screen

props객체가 이미 있고 JSX로 전달하려는 경우 ... 스프레드 연산자를 사용하여 props객체를 전달할 수 있다.함수 App1과 함수 App2의 구성요소는 동일하다.

hooks api reference 공부

contextcontext를 쓰면 컴포넌트 재사용이 어려워>떄로른 컴포넌트 합성이 좋은 대안이 될 수도.요로코롬

위코드 시작 이후 2차 프로젝트 끝날 때 까지 여러 개념들에 대해 자세하게 공부하기보다 나중에 공부해야지 하고 미루는 개념들이 몇가지 있었다. 기업협업을 하다보니 결국 내가 공부하지 않았던 부분이 뭐를 하려고 할 때마다 걸려서 공부하고 이번주에는 그런 개념들을 정리하고