어리둥절 분석가 그리고 개발자

import styled from '@emotion/styled'; import React from 'react'; import { VictoryChart, VictoryScatter, VictoryBar, VictoryAxis, VictoryLabel, VictoryContainer } from 'victory'; import { ReactComponent as Svg1} from "./svg/file1.svg"; import { ReactComponent as Svg2} from "./svg/file2.svg"; import { ReactComponent as Svg3} from "./svg/file3.svg"; import { ReactComponent as Svg4} from "./svg/file..

1. src 안에 custom.d.ts 혹은 아무 d.ts 파일을 만들고 아래처럼 적는다 declare module '*.svg' { import React = require('react'); export const ReactComponent: React.FC; const src: string; export default src; } 2. ReactComponent로 불러와서 사용한다 import { ReactComponent as Svg1} from "./svg/file1.svg"; // import Svg1 from './svg/file1.svg' // 이건 실패 const ScatterPoint = ({ x, y, datum, min, max } : any) => { return };

Victory Chart에서 제공하는 DataComponent 기능을 활용하면 SVG를 쉽게 차트 위에 올릴 수 있다! import styled from '@emotion/styled'; import React from 'react'; import { VictoryChart, VictoryLine, VictoryScatter } from 'victory'; import SvgFailedToLoad from "../../../public/assets/images/common/failed-to-load.svg"; const StyledPoint = styled.circle` fill: ${(props) => props.color}; `; const Container = styled.div` width: 80..

How do I force "git pull" to overwrite local files? # WARNING: this can't be undone! git reset --hard HEAD git clean -f -d git pull 현재 로컬에서 작업중인 내용을 다 지우고 다시 branch로 pull 할 수 있다

Victory 차트를 그리는데 발생한 에러 types/react 버전이 17이라면 types/react 버전을 18 버전으로 바꿔주면 된다 yarn add @types/react yarn add --dev @types/react or npm install @types/react 혹은 victory 버전을 낮춰준다 "victory": "36.5.3",

마이크로서비스의 2가지 통신 방법 - 동기와 비동기 - 비동기 방법이 마이크로서비스 통신에 적합하다 - (비동기) 메시지 브로커를 중간에서 사용한다 > 핵심적인 가치인 "독립성" - (비동기) RabbitMQ & Apache Kafka Asynchronous Messaging - 메시지 브로커가 중재자 역할을 한다. 연결이 중간에 끊어졌다면 임시 메시지 저장소를 제공한다 - 마이크로서비스 별 독립성을 확보한다 - PM이 ㅋㅋㅋㅋ 비슷한 역할을 한다. 메시지 전달 집중하는 일을 하신다. CEO와 개별 팀은 독립성을 확보한다. 마이크로서비스의 간단한 아키텍처 예시 - Order와 Boss는 독립적인 프로젝트이다. 프레임워크가 다르다. (Django, Flask) - Order와 Boss의 통신은 2가지 방식..

모놀리식 아키텍처 - 일반적으로 많이 사용하고 있는 아키텍쳐 - 토이 프로젝트는 100% 모놀리식 아키텍쳐로 만든다 - 다양한 기능을 하나의 프로젝트에 모두 구현해두겠다 - A라는 기능에다가 B, C, D 기능을 계속 추가하면서 A를 건드리지 않았는데도 에러가 난다 (동감) - D라는 기능을 추가하면 A, B, C의 QA를 다시 해야한다 (동감) - 하나의 JS 프로젝트에서 특정 부분만 다른 언어(Python)으로 구현하고 싶을 때 어렵다 마이크로서비스 아키텍처 - 각각의 도커에서 개별적으로 배포한다 (독립성) - 거대한 서비스인 경우에 더욱 적합하다 - 처음에 셋팅할 때 복잡하다. 각각의 서비스간의 개별 통신도 설정해주어야 한다 - 맨 처음에 서비스를 출시할 때는 모놀리식으로 개발한 뒤, 지속적으로 발..

CodeCommit 이란? 암호화가 GitHub과 가장 큰 차이점이다 개발 팀장은 IAM 권한을 이용해서 다 쓸 수 있는데, 팀원들에게는 다른 권한을 줄 수도 있다. (서로 다른 권한 설정) CodeCommit 실습 1. IAM 유저를 먼저 설정해야 한다. 기존 정책 CodeCommitFullAccess을 갖고 있는 2. 방금 만든 IAM에 들어가서 보안 자격 증명에 들어가서 CodeCommit에 대한 HTTPS Git 자격 증명 생성해야한다. (다운로드) 3. EC2 하나를 만든다 4. 콘솔에서 sudo apt install awscli >> aws configure 5. CodeCommit에 들어가서 리포지토리를 생성한다. 6. git clone https://git-codecommit.us-east..

Docker란? 개발서버(로컬, 맥북)에서 개발한 다음에 배포를 하는데 갑자기 잘 안될 수가 있다. 환경이나 버전이 동일하지 않아서.. 도커는 컨테이너 형태로 환경을 구분해준다. 도커는 이미지를 통해 같은 환경의 컨테이너를 무한히 생성할 수 있다 (AutoScaling) Docker Compose란? 각각 컨테이너별로 포트가 다르다 컨테이너별로 Dependency를 지정해줄 수 있다 ECR이란? Elastic Container Registry의 줄임말이 ECR이다 도커 이미지가 저장소에 저장이 되어 있으면 Registry에서 가져와서 도커를 만들수 있어서 저장소를 서버 외부에 두는 것이다 AWS가 있기 전에도 도커 자체에서 만들어둔 도커 레지스트리가 있었지만, 유사한 기능을 AWS ECR이 제공한다 < ..

쿠키란? 쿠키는 유효기간이 정해져있다 클라이언트에 저장되는 정보 = 민감하지 않은 값만 저장한다 ex. 로그인하지 않았을 때 장바구니에 저장된 아이템들 세션란? 세션은 쿠키랑 반대로 서버에 저장한다 세션 ID만 클라이언트와 서버가 전달하면서 사용한다 세션이 좀 더 느린데, Redis라는 것을 이용하면 속도도 빠르게 할 수 있다.