- 전체보기(84)
- JavaScript(13)
- react native(5)
- 자바스크립트알고리즘(2)
- React(2)
- typescript(2)
- data structure(2)
- 타입스크립트(2)
- docker compose(1)
- redux(1)
- CSS Layout(1)
- javascript 실행컨텍스트(1)
- 참조형(1)
- 도커(1)
- netlify(1)
- scope(1)
- git(1)
- sop(1)
- react-native-code-push(1)
- 도커 컴포즈(1)
- Expo Expo CLI vs React Native CLI(1)
- SDK location not found(1)
- 정규표현식(1)
- underscore(1)
- let var const(1)
- 쿠버네티스 아키텍처(1)
- 완주하지 못한 선수(1)
- cors(1)
- 웹팩(1)
- promise(1)
- 가상머신 vs 도커 컨테이너(1)
- credentials(1)
- codepipeline node ts(1)
- react-native 외부 앱 실행(1)
- deployment 객체(1)
- react-native-webview 외부 앱 실행(1)
- Tree vs BinarySearchTree(1)
- React 이미지 미리보기(1)
- 자바스크립트 클래스(1)
- react portal 모달(1)
- http(1)
- react-native tab-view(1)
- higher-oder component(1)
- react native font(1)
- ScrollPager(1)
- linked list(1)
- react-native domain Error(1)
- process(1)
- AWS S3(1)
- Build failed with an exception(1)
- AWS Elastic Beanstalk(1)
- 도커 컨테이너(1)
- Page Not Found on netlify with React Router(1)
- reduxjs/toolkit(1)
- async-storage(1)
- shallow copy vs deep copy(1)
- 안드로이드 이미지 깨져 보일 때(1)
- git commit 합치기(1)
- recursion(1)
- 쿠버네티스 객체(1)
- typescript + express.js + node.js 세팅(1)
- typescript-type(1)
- 실행컨텍스트(1)
- TDD(1)
- 프로토타입(1)
- code-push(1)
- javascript prototype(1)
- ingress 객체(1)
- 정규 표현식(1)
- Prototype(1)
- JavaScript Class(1)
- netlify 배포(1)
- 테스트 주도 개발(1)
- docker muti stage(1)
- node s3(1)
- docker 멀티스테이지 빌드(1)
- react redux(1)
- git commit 삭제(1)
- CRA 웹팩(1)
- Bubble Sort(1)
- Insertion Sort(1)
- Merge sort(1)
- Quick Sort(1)
- 타입스크립트 타입(1)
- node.js(1)
- minikube(1)
- git stash(1)
- 객체 지향 prototype(1)
- 바벨(1)
- react setInterval(1)
- mongoose(1)
- safe-area-inset(1)
- ESLint(1)
- Prettier(1)
- webpack(1)
- react 이미지 슬라이드 구현(1)
- 쿠버네티스(1)
- 자바스크립트 실행컨텍스트(1)
- https(1)
- redux-toolkit(1)
- 원시형(1)
- kubectl(1)
- React LifeCycle(1)
- 도커란(1)
- eb https(1)
- 브라우저 렌더링 과정(1)
- 타입스크립트 객체지향(1)
- Javascript This(1)
- 쿠버네티스 개념(1)
- context(1)
- react-query(1)
- this(1)
- DOM(1)
- 도커 컨테이너 통신(1)
- react webpack 설정(1)
- mysql(1)
- react @reduxjs/toolkit(1)
- 반복문 promise(1)
- 정규 표현식 정리(1)
- Service 객체(1)
- Image Slider 구현(1)
- Design Pattern(1)
- react 18(1)
- 다른 도메인 쿠키 전송(1)
- javascript 데이터 타입(1)
- eb 배포(1)
- 자바스크립트 프로토타입(1)
- asynchronous 비동기 프로그래밍(1)
- pod 객체(1)
- 화살표 함수(1)
- react-native run-android error(1)
- dockerfile 최적화(1)
- 도커 이미지와 컨테이너(1)
- sorting algorithm(1)
- stack or tab 스크린 이동 시 새로고침(1)
- HoC(1)
- withCredentials(1)
- 객체지향(1)
- 도커 볼륨 바인드 마운트(1)
- ViewPagerAdapter(1)
- 도커 이미지(1)
- babel(1)
- Hash Table(1)
- datastructure(1)
- Big O 시간복잡도(1)
- 커밋 메세지 수정(1)
- netlify aws(1)
- https SSL(1)
쿠버네티스 객체 이해하기
쿠버네티스에서 클러스터내의 리소스를 추상화하기 위해 객체라는 개념을 사용한다.쿠버네티스 객체는 쿠버네티스에서 실행되는 애플리케이션, 서비스, 볼륨, 네트워크 등 모든 것을 표현한다.명령적 방식과 선언적 방식으로 객체를 생성할 수 있으며 쿠버네티스 적절한 객체를 사용하여
Kubectl과 Minikube
kubectl은 kubernetes CLI(command line interface) 두구 중 하나로 쿠버네티스의 클러스터를 관리하는 명령어 도구이다클러스터에서 실행 중인 컨테이너 상태를 모니터링할 수 있다.pod나 service 등 리소스를 생성 및 삭제, 로그 확인
Dockerfile 최적화 Multi-Stage Build(멀티스테이지 빌드)
단일 도커 파일에서 여러 단계의 빌드를 수행하는 방법입니다.빌드 도구와 런타임 환경을 분리하고 실행에 필요한 최소한의 구성만 포함하여 이미지 크기를 최소화할 수 있습니다.빌드 도구와 관련된 정보들을 외부에 노출시키지 않아 보안을 강화할 수 있습니다.중복된 작업을 피하고
쿠버네티스 아키텍처와 개념
쿠버네티스는 컨테이너화된 애플리케이션을 관리하고 배포하기 위한 오픈소스 툴입니다.쿠버네티스를 사용하면 애플리케이션의 상태를 관리하고, 자동 배포, 스케일링, 로드 밸런싱, 복구, 모니터링 등 다양한 기능을 수행할 수 있습니다.확장성과 가용성이 높아 대규모 컨테이너 기반
Docker Compose
도커 컴포즈는 다중 컨테이너 설정을 쉽게 관리할 수 있습니다.모든 서비스와 모든 컨테이너를 즉시 시작하고 필요하다면 필요한 이미지를 빌드하는 것을 하나의 명령어를 사용하여 모든 것을 시작하거나 중단할 수 있습니다.(오케스트레이션)docker build와 docker r
도커 컨테이너 간 통신
도커 컨테이너 간의 통신을 하기 위해 여러 개의 컨테이너를 만들어 봅니다.기본적으로 웹 API 및 웨 피이지와 통신할 수 있습니다.(WWW)위와 같이 도커 파일을 작성해 줍니다.이미지 생성docker build -t <이미지 이름>:<버전> . (<버전
도커 볼륨과 바인드 마운트
도커 컨테이너에 데이터를 보존하기 위해 볼륨과 바인드 마운트라는 두 가지의 외부 데이터 저장 메커니즘이 있습니다.컨테이너 외부의 특정 디렉토리에 연결된 도커 컨테이너의 내부 디렉터리입니다.볼륨은 도커 내장 기능으로 도커가 관리합니다.볼륨은 컨테이너가 종료된 경우에도 지
도커 이미지와 컨테이너
도커 엔진에서 사용하는 기본 단위는 이미지와 컨테이너이며, 이 두 가지가 도커 엔진의 핵심입니다.이미지에는 코드, 설정, 여러 것들이 포함되며 컨테이너는 그 이미지의 실행 인스턴스입니다.이미지를 기반으로 컨테이너를 실행합니다.이미지는 실제로 코드와 코드를 실행하는데 필
Docker 란 ?
도커는 컨테이너를 생성하고 관리하기 위한 도구입니다.리눅스 컨테이너에 여러 기능을 추가하여 애플리케이션을 컨테이너로 조금 더 쉽게 사용할 수 있도록 만들어진 오픈소스 프로젝트로 go 언어로 작성되어 있습니다.기존에 쓰이던 가상화 방법인 가상 머신과 달리 도커 컨테이너는
Class 클래스
자바스크팁트는 프로토타입 기반의 객체지향 언어입니다.프로터타입에 할당되지 않고 생성자 함수 객체에 직접 할당되어있는 프로퍼티와 메소드를static method, static properties라고 합니다.생성자 함수를 new 연산자 없이 함수로써 호출할 때 사용됩니다.
객체 지향 Prototype
서로 관련 있는 데이터와 함수를 객체(하나의 역할을 수행하는 메소드와 변수의 묶음)로 정의해서 서로 상호작용할 수 있도록 프로그래밍해나가는 것을 의미합니다.각 객체는 메시지를 받을 수 있고, 데이터를 처리할 수도 있으며, 또 다른 객체에게 메시지를 전달할 수도 있습니다
Javascript This
자바스크립트에서 this는 실행 컨텍스트가 생성될 때 바인딩됩니다.즉, 함수가 호출될 때 this가 결정된다는 것입니다.아래 소스를 보면 어떻게 호출했느냐에 따라 this가 달라집니다.결과가 다른 이유는 myName()은 함수로 호출을 했고 student.myName(
실행 컨텍스트
자바스크립트가 실행되는 환경으로 함수를 실행할 때 필요한 조건, 환경정보를 제공하는 객체입니다.실행 컨텍스트를 이해하면 Scope, hoisting, closure, this와 같은 중요한 동작을 이해할 수 있습니다.아래는 위 코드를 실행 컨텍스트 내부로 추상화한 것입
JS 데이터 타입(원시형 vs 참조형)
자바스크립트에서 데이터 타입에는 아래와 같이 원시형과 참조형으로 나뉩니다.자바스크립트 메모리 구조는 스택 메모리(정적 할당, 변수, 원시형 데이터 저장)와 힙 메모리(동적 할당, 참조형 데이터, 저장) 영역으로 나뉘어 있습니다.객체를 제외한 모든 타입은 원시 값(불변
바벨(Babel) 설정하기
바벨은 트랜스파일러로 최신 자바스크립트(타입스크립트, JSX 포함)가 모든 브라우저에서 동작하도록 변환해 줍니다.실행이 안되는 구버전 웹브라우저를 대응하기 위해 배포할 때에 예전 방식의 자바스크립트로 변환해서 배포하려고 사용합니다.파싱(Parsing): 코드를 분해하
React Query
React 애플리케이션에서 데이터를 가져오기 위한 라이브러리입니다.데이터 Fetching, 캐싱, 동기화, 서버 쪽 데이터 업데이트 비동기 과정에서 데이터를 관리하기 편하게 할 수 있습니다.아래와 같이 React는 데이터를 가져올 때 useEffect를 사용하고 use
CRA(Create React App) 웹팩 설정하기
CRA는 프로젝트 초기 세팅 및 복잡한 과정을 해결해줍니다.예를 들어, 아래와 같은 명령어로 타입스크립트 환경의 리액트 프로젝트를 만들 수 있습니다.이렇게 프로젝트를 만들게 되면 바벨이나 웹팩 같은 빌드 도구를 사용하지만 종속된 라이브러리나 설정이 보이지 않습니다.숨겨
http 와 https
http는 Hyper Text Transfer Protocol의 약자로 인터넷에서 요청과 응답의 형태로 정보를 주고받을 수 있는 프로토콜입니다.TCP 기반으로 작동하며 비연결성, 비상태성 특징을 가집니다.이로 인해 많은 실제 동시 접속을 최소화하여 더 많은 유저의 요청
React에서 setInterval 사용하기
업데이트 함수 setState를 활용하여 구현 위 소스는 1초마다 카운트를 1 씩 올려주는 코드입니다. useEffect 두 번째 인자에 빈 배열을 넣어 componenetDidMount와 같이 timer 함수를 한 번만 세팅합니다. setInnerval로 time
React 18 버전 업데이트 정리
자동 배치란 여러 개의 state 업데이트를 하나로 묶어 render 함수를 호출(리렌더링 성능 개선)하는 것을 말합니다.기존 17 버전에서도 이러한 배칭 처리는 되었지만 비동기 부분에서는 자동 배치 처리가 되지 않았습니다.하지만 18 버전부터는 비동기에서도 자동 배치