즐겁게, 코드

이미지에 파일을 하나 추가했다고 해서 처음부터 수백 메가에 달하는 파일을 다시 다운받는다면 굉장히 비효율적일 것입니다. 하지만, 도커 데몬은 레이어 를 활용해 이미지를 빌드할 때 파일이 추가되거나 변경될 때마다 해당 동작을 캐시합니다. 오늘은 도커파일을 잘 작성해 레이어의 캐싱을 최대화하고, 이를 통해 이미지 빌드 속도를 최적화하는 팁을 소개해보려 합니다. 이미지 생성하기 간단한 node.js 어플리케이션 하나를 이미지로 만들어 보겠습니다. 코드는 다음과 같습니다. const express = require('express'); const app = express(); app.get('/', (req, res) => { res.send(` 간단한 node.js 어플리케이션입니다. `); }) app.li..

구글에서 제작한 컴파일 언어인 Go(Golang)는 그 빠르다는 C++에도 밀리지 않는 성능과 간단히 CLI를 개발할 수 있다는 등의 장점을 살려 백엔드 개발과 데브옵스 개발자들에게 큰 인기를 얻고 있습니다. ✅ Go의 주요 사용 분야는 이곳 에서 확인해볼 수 있습니다! Go 설치하기 Go는 컴파일 언어이자 강타입 언어로, 설치 링크 에서 Go 컴파일러를 간단히 설치할 수 있습니다. 시작하기 전에 : 모듈에 대해 본격적으로 Hello, world! 출력에 도전하기 전에, Go의 중요한 개념인 모듈에 대해 다뤄보도록 하겠습니다. 간결한 문법도 Go의 빠른 속도의 원인 중 하나겠지만, 구글에서는 최적화된 종속성 관리 를 가장 큰 요인으로 뽑고 있는데요, Go에서는 모듈 을 통해 의존성 변경을 추적하고 효율적..

오늘은 메모리계의 날쎈돌이, 캐시 메모리의 역할과 원리를 간단히 요약해보도록 하겠습니다. ✅ 읽기 전에 알려드려요! 이 글에서는 L1 ~ L3 캐시 구조 등 하드웨어적인 동작 원리에 대해서는 다루지 않으며, 캐시의 지역성만을 다룰 예정입니다. 🙂 캐시 메모리란? 먼저 캐시 메모리 란 처리속도가 다른 두 장치간의 속도차에 따른 병목 현상을 줄이기 위한 범용 메모리입니다. 만일 캐시가 존재하지 않는다면 RAM에서 데이터를 인출해오는 속도가 CPU가 태스크를 처리하는 속도보다 느리기 때문에 불필요하게 시간을 낭비해야 하지만, 실제로는 중간에 위치한 캐시 메모리가 둘 사이에서 데이터를 고속으로 전달해 줌으로써 속도 차이로 인한 병목을 어느정도 해결해 줄 수 있습니다. 그러나 캐시 메모리는 처리속도가 굉장히 빠른..

여러 개발 도구들 중에서도 쿠버네티스는 어려운 축에 꼽히는데요, 쿠버네티스를 이해하려면 먼저 클러스터를 구성하는 기본 구성 요소들에 대해 알아야 합니다. 이번 글에서는 클러스터를 구성하는 컴포넌트들과 각각의 역할을 간단히 정리해보도록 하겠습니다. 메인 쿠버네티스 컴포넌트 목록 제가 아직 사용해보지 않은 DaemonSet 등 일부 쿠버네티스 컴포넌트는 이 글에서 다루지 않지만, 주로 사용되는 컴포넌트를 정리해 보았습니다. (정리되지 않은 컴포넌트 역시 추후 추가할 수 있도록 해보겠습니다. 🙂) Pod Pod(파드)는 쿠버네티스의 가장 작은 유닛으로, 컨테이너를 감싸 추상화한 결과물을 의미합니다. 주로 1개 파드에서 1개 어플리케이션을 운영하며, 각 파드는 고유한 내부 IP 주소를 부여받아 노드 내에서 파드..

EC2 인스턴스를 사용하는 목적은 다양할 텐데요, 누군가는 여러 EC2 인스턴스들을 하나로 묶어 높은 컴퓨팅 성능을 원할 것이고, 다른 누군가는 EC2 인스턴스들에 고가용성에 초점을 맞출 수도 있습니다. 사용자가 EC2 인스턴스를 생성하면 AWS에서는 하드웨어(랙)에 이를 생성하는데요, 컴퓨팅, 분산처리 특화 등의 인스턴스 활용 전략을 수립하기 위해 EC2 배치 그룹(Placement Group) 설정을 활용하면 여러 EC2 인스턴스들을 랙 상에서 어떤 형태로 배치할 지 설정할 수 있습니다. 인스턴스 배치 그룹 배치 그룹은 EC2 관리 콘솔 사이드바 중 [네트워크 및 보안] 탭에서 생성할 수 있습니다. 배치 그룹 메뉴에 들어가면 여러 배치 그룹을 관리하거나 생성할 수 있는 메뉴가 나타나는데요, 우측 상단..

TL;DR "인터섹션" 이란 요소가 화면(뷰포트) 상에 위치하고 있는지를 의미합니다. 인터섹션 옵저버를 사용하면 이 인터섹션을 감지하고 수행할 콜백을 지정할 수 있습니다. threshold 옵션을 사용하면 감지 비율을 설정할 수 있습니다. 인스타그램과 페이스북은 어떻게 스크롤을 할 때마다 새로운 피드를 불러올까요? 흔히 “무한 스크롤” 이라고 부르는 이 기법은 자바스크립트의 intersection observer(인터섹션 옵저버) 라는 API를 사용해 간단히 구현할 수 있는데요, 오늘은 AOS(Animate-On-Scroll) 효과와 무한 스크롤을 구현해보며 인터섹션 옵저버를 간단히 알아보도록 하겠습니다! 실습을 위해, 먼저 아래 마크업을 복사해 주세요! /* styles.css */ .container..

자바스크립트 단에서 화면 사이즈를 기반으로 모바일 여부를 검사하는 useIsMobile 훅을 제작하고 있었습니다. import { useEffect, useState } from "react"; const useIsMobile = () => { const [isMobile, setIsMobile] = useState(false); const [screenWidth, setScreenWidth] = useState(0); const handleScreenResize = () => { setScreenWidth(window.innerWidth); screenWidth > 768 ? setIsMobile(false) : setIsMobile(true); }; useEffect(() => { handleScre..