구리

회사에서 개발중인 CRA 기반의 React 프로젝트를 Docker 이미지로 빌드시 npm run build 명령어를 통한 빌드 시간이 너무 오래 걸려 이를 개선한 과정을 작성한 글입니다. 프로젝트를 그냥 빌드하면 1분 50초정도 걸리지만 Docker 이미지로 빌드시 빌드시간이 약 6분정도로 3배가량 차이가 났습니다. 그래서 Webpack을 커스텀해 빌드 시간 자체를 줄이면 Docker 이미지 빌드 시간도 줄일 수 있지 않을까 싶어 빌드 과정을 개선해보겠습니다. 내용이 길어질 것 같아 2개의 글로 나눠 이번 포스팅은 모듈 번들러, Webpack이란 무엇이고 왜 쓰는지에 대해 알아보겠습니다. 사전 지식 CRA React 빌드 과정 모듈 시스템 본론 모듈 번들러 트랜스파일러 Webpack Create Reac..

멘토님께 개발자, 그리고 인생을 살아갈때 좋은 자세와 관련된 좋은 영상 2개를 추천받아 보면서 부족한 점과 개선 방법에 대해 고민한 내용을 작성한 글입니다. 추천 영상 https://www.youtube.com/watch?v=GR5PuqbyA50 https://www.youtube.com/watch?v=fHyTA-UIcqs 첫번째 영상은 개발자가 갖추어야 할 9가지 기술로 연차별 엔지니어에 따라 어떤 기술을 갖춰야 하는지에 대한 주제였고, 두번째 영상은 아시아 최초 프랑스 장관이셨던 플뢰르 펠르랭님의 인생 철학에 대한 주제였습니다. 측정, 변화 그리고 발전 두개의 영상을 보면서 공통적으로 느꼈던 부분은 성장하는 사람은 성공할 수 밖에 없으며 성장하기 위해선 측정, 변화, 발전의 과정을 계속 경험한다는 것..

도커 교과서의 5장(레지스트리에 이미지 공유), 6장(도커 볼륨을 이용한 퍼시스턴트 스토리지)을 읽으면서 공부한 것을 정리한 글입니다. 도커의 여러 장점 중에서도 공유는 핵심에 해당됩니다. 공유는 로컬 컴퓨터에서 빌드한 이미지를 다른 사람이 사용할 수 있게끔 하는 기능입니다. 그러면 공유되는 이미지의 구조와 공유 방식에 대해 알아보겠습니다. 이미지 참조 우리가 내려받는 이미지는 도커 레지스트리라는 서버에 저장됩니다. 도커 레지스트리 중 가장 유명한 도커 허브는 도커 엔진에 기본으로 설정된 레지스트리로 로컬에 없는 이미지를 내려받을 경우, 먼저 도커 허브에서 탐색합니다. 이때, 도커 이미지를 구분하기 위해 이미지에는 이미지 참조(전체 이름)이 부여되며 레지스트리에서 이미지 식별자 역할을 합니다. 이미지 참..

어떤 키워드 (사과 요리)를 검색했을 때, 관련 사이트 목록뿐만 아니라 다양한 컨텐츠 형식(레시피)을 볼 수 있습니다. 이는 페이지에 구조화된 데이터를 포함하기 때문에 가능하며 사용자에게 더욱 효과적인 검색결과를 제공해 웹사이트와 더 많은 상호작용을 하도록 유도할 수 있습니다. 이때 구조화된 데이터를 만들기 위한 방법 중 하나로 사용되는 것이 JSON-LD입니다. JSON 탄생 배경 JSON-LD를 알아보기 전, 먼저 JSON의 탄생 배경에 대해 알아보겠습니다. JSON은 XML의 대안으로 더 쉽게 데이터를 교환하고 저장하기 위해 고안되었습니다. XML(Extensible Markup Language)은 HTML과 비슷한 문자 기반의 마크업 언어로 무언가를 실행하는 언어가 아닌 데이터를 표현하는 '형식'..

회사에서 진행하는 프로젝트에서 꽤 큰(?) 비중의 기능을 구현하게 되었습니다. 그래서 개발 전에 설계를 먼저 했는데 어떻게 해야할지 많이 헤맸던 것 같습니다...! 그래서 프론트엔드 설계는 어떻게 해야하는지 공부하며 정리한 글입니다. 그러면 설계란 왜 필요한 것이고 정확히 어떤 개념일까요? 설계란? 설계 (設計) 베풀 설 (設), 셀 계 (計)라는 한자로 사전적 정의는 일반적으로 계획을 세우는 일을 통들어서 설계라고 지칭합니다. 공학, 토목, 전자 등의 분야에서는 목적물을 만들기, 변경, 해체하는 일에 대한 계획을 세우는 일을 의미합니다. 소프트웨어의 관점에서 설계는 우리가 만들 제품을 어떻게 만들지에 대한 계획을 세우는 일이라고 할 수 있습니다. 설계 왜 하는 걸까? 그런데 설계는 왜 하는 걸까요? 집..

Docker는 Host OS에 상관 없이 다양한 Linux 배포판의 Container를 올릴 수 있습니다. 예를 들면 Host OS는 Ubuntu지만 Container는 CentOS일 수 있습니다. 이것이 가능한 이유를 알기 전에 Linux, Linux 배포판이 무엇인지 알아보겠습니다. Linux Linux는 컴퓨터 OS 커널의 일종인 Linux 커널, 또는 Linux 커널을 사용한 운영체제를 뜻합니다. 여기서 Linux는 크게 커널 영역, 사용자 영역으로 분리됩니다. 사용자 영역은 애플리케이션이 실행되는 공간으로, 애플리케이션 실행을 위한 라이브러리나 환경을 제공하는 system daemon이 존재합니다. 커널 영역은 하드웨어 리소스를 제어하고 관리하는 역할로, 사용자 영역으로부터 System Call..

개발 공부를 하면서 제대로 몰랐던 용어의 개념을 정리한 글입니다. 운영체제, 프로세스, 커널을 이해하기 위해선 컴퓨터가 어떤 구성으로 되어 있는지 먼저 알아야 합니다. 컴퓨터는 크게 하드웨어와 소프트웨어로 구성되어 있습니다. 하드웨어 컴퓨터를 구성하는 기계 장치로 소프트웨어가 지시한 일을 수행 크게 중앙처리장치 (CPU), 기억장치 (램, 하드디스크 등), 입력장치 (키보드, 스캐너 등), 출력장치 (모니터, 스피커 등)로 구성 입력장치를 통해 외부 데이터를 입력 받음 → 중앙처리장치에서 명령을 실행 → 기억장치에서 필요한 데이터 저장 → 출력장치를 통해 결과 출력 소프트웨어 하드웨어의 동작 지시 및 제어하는 역할의 프로그램, 프로그램에 필요한 데이터 크게 시스템 소프트웨어, 응용 소프트 웨어로 나눌 수..

Docker를 공부하면서 추상화, 가상화란 단어를 많이 접하게 되는데 정확한 개념과 장점이 무엇인지 알아보며 정리한 글입니다. 추상화 복잡한 시스템, 데이터 또는 프로세스를 간결하고 이해하기 쉬운 형태로 단순화하는 개념 복잡성을 숨기고 간소화하기에 사용자는 복합한 세부 사항을 신경쓰지 않고 시스템을 다룰 수 있음 예를 들어, 운영체제는 하드웨어의 추상화로 하드웨어의 복잡성을 숨기고 개발자가 간단한 인터페이스를 통해 시스템을 다룰 수 있음 가상화 하나의 물리적 리소스를 여러 개의 가상 환경으로 분할해 독립적으로 사용하는 기술 복잡한 하드웨어와 리소스를 단순한 형태로 추상화하여 사용자에게 제공하기에 리소스 활용을 최적화할 수 있으며, 가상 환경은 서로 독립돼있어 서로 영향을 주지 않기에 시스템 안정성과 격리..