반응형

전체 글 38

k8s - 이스티오(Istio) 정리 #2

k8s 이스티오 정리 두 번째 - 이전 글 : k8s - 이스티오(Istio) 정리 #1 컨트롤 플레인 (Control plane) 사이드카와 게이트웨이는 컨트롤 플레인에 의해 설정 및 조정된다. 컨트롤 플레인은 마이크로 서비스 세트였지만, Istio는 몇 년 전에 큰 아키텍처 변경을 경험했다. Istio 블로그 게시물에서 논의되었으며, 11월에 그 일에 대해 이야기할 예정이다. 이 재설계 이후 컨트롤 플레인은 is tio-system 네임스페이스에서 실행되는 단일 파드(istiod)가 된다. 확장성 (Extensibility) 주목할 점은 데이터 플레인 동작의 일부는 Configuration으로 프록시에 제공되는 것이 아니라 Emissor의 WASM 지원을 사용하여 동적으로 주입되는 코드로 제공된다는 ..

development 2022.12.04

k8s - 이스티오(Istio) 정리 #1

이스티오(Istio)는 서비스 메시 패턴의 구현체이다. 서비스 메시가 더 복잡해지기 전에 이를 관리하는 기술이다. 연혁 (History) Istio는 구글에 의해 시작되었고 v0.1.0이 오픈 소스화 된 후 구글, IBM 및 기타 여러 회사에 의해 개발이 계속되었다. 2022년 4월 리눅스 재단의 일부인 독립된 조직인 CNCF(Cloud Native Computing Foundation)에 이스타오 라이선스권이 부여됐다. 실행 환경 (Execution Environment) 먼저 실용적인 세부사항부터 살펴보자. 구체적인 내용은 무엇이며 실행 장소는 어디일까? 서비스 메쉬는 컨트롤 플레인과 데이터 플레인으로 구성되어 있다. 컨트롤 플레인은 필요에 따라서 유저가 작성한 고도의 설정을 취해, 데이터 플레인(실..

development 2022.12.04

프론트엔드, 리액트 면접 인터뷰

프론트엔드, 리액트 개발자 면접 기본 질문들 정리 자주 물어보는 자바스크립트와 리액트 기본 질문들을 정리하였다. 이밖에도 프로젝트나 다양한 과제를 해결하기 위해 어떻게 접근했는지, 개발 과정에서 발생한 문제와 문제 해결 능력도 준비를 해야 한다. 1. array 관련 함수들 (map, forEach, filter, reduce) array 함수들과 polyfill 구현 방법 정리. 폴리필이란 네이티브로 구현되지 않은 오래된 브라우저의 최신 기능에 사용되는 코드 스니펫(JavaScript Web 아키텍처 관점)이다. 간단히 말해서, polyfill은 네이티브 자바스크립트 함수의 커스텀 구현이다. 1) map map() 메서드는 배열을 반복하고 맵 본체에 기입할 로직을 계산하여 새 배열을 반환한다. 아래는 ..

development 2022.12.03

타입스크립트(typescript) 클린코드

타입스크립트 클린코드 정리 1. 불필요한 컨텍스트 삭제 클래스/유형/객체명으로 선언한 값을 컨텍스트로 반복하지 않는다. 굳이 반복할 필요가 없다. type Car = { carMake: string; carModel: string; carColor: string; } function print(car: Car): void { console.log(`${car.carMake} ${car.carModel} (${car.carColor})`); } 아래처럼 컨텍스트를 빼고 사용 type Car = { make: string; model: string; color: string; } function print(car: Car): void { console.log(`${car.make} ${car.model} (..

development 2022.12.01

타입스크립트 인터페이스 선언 머지 (Interface Declaration Merging)

Typescript Interface Declaration Merging 정리 타입스크립트에서 기존 인터페이스를 업데이트해야 하는 경우도 있지만, 그 외의 장소에서의 사용 방법을 변경하는 경우는 할까? 인터페이스 선언 병합 Interface Declaration Merging을 사용하면 동일한 이름의 인터페이스가 두 개 있을 때마다 타입스크립트 컴파일러는 두 인터페이스의 속성을 양쪽이 공유하는 이름의 단일 인터페이스로 병합하려고 한다. 타입스크립트를 사용하면 interfaces, enums, namespaces 등 여러 유형을 병합할 수 있습니다. 한 가지 주목할 만한 예는 클래스를 통합할 수 없다는 것이다. 그러기 위해서는 Mixins을 사용해야 한다. 인터페이스 선언 병합의 예 코드 예제를 사용하여 ..

development 2022.12.01

AWS 이미지를 업로드하는 4가지 방법

AWS에 이미지를 업로드하는 방법 정리 방법 1) 서버에 이미지 저장 기본 이미지 저장 방법이다. 사용자가 이미지를 업로드하고 서버가 로컬로 디스크에 저장한다. 작은 파일 1) 장점 파일 업로드가 적으면 일반적으로 서버에 너무 부담을 주지 않으며 이미지를 저장하는 프로세스가 간단하다. 외부 서비스에 의존하지 않고 이미지 처리와 스토리지를 완전히 관리할 수 있다. 2) 단점 서버 한 대가 이미지를 저장하기 때문에 이미지 제공은 최적이 아니다. 사내 CDN을 사용하지 않은 경우 전송 속도는 서버 대역폭과 위치에 따라 달라진다. 또한 이 접근법은 시스템에 단일 장애점을 발생시키기 때문에 확장 가능한 방법이 아닐 수 있다. 그러나 이 접근법은 규모나 규모가 너무 커지지 않는 것으로 알려진 소규모 프로젝트에 있어..

development 2022.11.30

초보자를 위한 리액트(React) 개발 팁

리액트 초보자를 위한 7가지 팁 정리 1. 컴포넌트 name 설정 버그가 있는 컴포넌트를 파악하려면 항상 컴포넌트에 이름을 지정하는 것이 중요하다. React Router 또는 외부 라이브러리를 사용하기 시작하면 더욱 그렇다. // Avoid thoses notations export default () => {}; export default class extends React.Component {}; default본 export를 사용할지 named export를 사용할지에 대한 논쟁이 있다. default export는 컴포넌트명이 프로젝트에서 일관되도록 보장하지 않는다. 게다가 트리 쉐이킹에 덜 효과적이다. 2. 컴포넌트를 expose하는 방법에 관계없이 이름 설정 컴포넌트를 호스팅 하는 클래스 이..

development 2022.11.30

이란 월드컵 선수들이 위험하다

이란 월드컵 축구팀 가족들이 선수들이 위협을 받고 있다. 21일 영국과의 개막전에서 이란 선수들이 국가 제창을 거부한 데 이어 이란 혁명수비대(IRGC) 대원들과의 회의에 소집됐다고 한다. 이란 선수들이 국가를 부르지 않거나 테헤란 정권에 대한 정치적 항의에 동참하면 가족들이 폭력과 고문에 직면할 것이라는 말을 들었다 한다. 이란 선수들은 2-0으로 승리한 지난 금요일 웨일스와의 두 번째 경기 전에 국가를 불렀다. 소문에 의하면 카를로스 케이로스 이란 대표팀 코치는 이란 선수와 그 가족에 대한 협박에 따라 IRGC 임원들과 개별 면담했다고 한다. 관계자는 그 제기된 대화 내용에 대해서는 언급하지 않았다. 관계자들에 따르면 선수들은 잉글랜드 경기에 앞서 선물과 차를 약속받았으나 팀이 국가를 부르기를 거부한..

정보 2022.11.29

Gatsby 사이트에 애드센스(AdSense) 적용하기

Gatsby로 만든 사이트에 애드센스(AdSense)를 적용하는 방법 - 원글 : https://qiita.com/bob_yama/items/2b24fca112587a1bf8e8 Gatsby의 SSR에 대응하는 방법이나 표시되는 화면의 크기에 따라 광고의 표시 숨기기를 전환하는 방법 등의 내용이다. 애드센스에 자신의 사이트를 등록하는 방법등은 검색하면 여러가지 사이트에서 소개되고 있다고 생각하므로 이번은 생략한다. Google 애드센스를 사이트에 적용하려면 적절한 스크립트 태그를 헤더에 추가해야 한다. 그것을 해주는 것이 gatsby-plugin-google-adsense | GatsbyJS 라는 플러그인이다. npm 또는 yarn으로 설치하고 gatsby-config.js에 다음 설정을 추가한다. pl..

development 2022.11.29

Phaser 개발환경 세팅

Parcel을 이용하여 Phaser 개발환경 세팅하는 방법 node가 설치되어 있어야함 1) node, npm 설치 확인 node --version npm --version 2) parcel-bundler 설치 npm install -g parcel-bundler 3) 템플릿 클론 https://github.com/ourcade/phaser3-parcel-template.git 4) 설치 및 실행 npm install --save npm run start 5) http://localhost:8000으로 접속해서 확인 - 참고 : https://blog.ourcade.co/posts/2019/get-started-phaser3-fast-painless/

development 2022.10.04
반응형