hmk run dev

웹 브라우저의 보안 클라이언트 힌트 (Sec-CH-UA) 이해하기 웹 브라우저는 서버에게 어떻게 동작하고 어떤 환경에서 실행되고 있는지에 대한 정보를 전송하기 위해 다양한 헤더를 사용합니다. 이 중에서도 "Sec-CH-UA" 헤더는 보안 클라이언트 힌트의 사용자 에이전트 정보를 제공하는 중요한 역할을 합니다. 이번 글에서는 "Sec-CH-UA" 헤더의 각 필드에 대해 자세히 알아보겠습니다. "Sec-CH-UA"와 관련된 헤더는 주로 웹 브라우저에 의해 자동으로 생성되며, 클라이언트 측에서 서버에 전송됩니다. 이 헤더는 브라우저의 사용자 에이전트 정보와 함께 웹 페이지 요청에 포함됩니다. 유저가 어떤 환경에서 우리 서비스를 사용하는지에 대한 정보를 수집할 수도 있으며 웹사이트 크롤링을 방어할 때 Sec-C..

마이크로 프런트엔드란? 마이크로 프런트엔드는 소규모 프런트엔드 서비스를 독립적으로 개발, 배포, 운영할 수 있게 하는 아키텍처 패턴. 전통적인 단일 프론트엔드 애플리케이션 대신 여러 개의 작은 프런트엔드 애플리케이션으로 애플리케이션을 분리합니다. 마이크로 프런트엔드의 주요 목표와 문제 해결 포인트는 다음과 같습니다. 독립적인 개발 및 배포: 각 마이크로 프런트엔드는 독립적으로 개발, 테스트, 배포할 수 있어 더 빠르게 애플리케이션을 개선하고 배포할 수 있습니다. 기술 스택의 유연성: 마이크로 프론트엔드 아키텍처는 다양한 프런트엔드 기술 스택을 사용할 수 있어 팀이 선호하는 기술을 선택하여 개발할 수 있습니다. (React, Vue, Svelte 등등) 재사용성 및 확장성: 기능이나 컴포넌트를 재사용하거나..

마이크로프로세서(CPU) 일단 V8엔진에 대해서 설명하기 전에 우리가 작성한 javscsript 코드가 어떻게 실행되는지 아주 간단하게 훑어보자 컴퓨터의 모든 시스템은 마이크로프로세서(CPU)를 포함하고 있다. 지금 블로그 글을 보고 있는 것도 그 덕분이다. 마이크로프로세서는 전자적인 신호로 동작하는 기계이다. 우리는 마이크로프로세서에게 지시(instruction)를 주고 마이크로프로세서는 job을 수행한다. 여기서 지시란 것은 마이크로프로세서가 해석할 수 있는 언어로 되어있다. 일반적으로 IA-32, x86-64, MIPS 그리고 ARM이 있다. 이러한 언어들은 직접 하드웨어와 소통하며 기계어라고 불린다. 우리가 컴퓨터에 코딩한 고수준 언어들은 컴파일되어 기계어 되어 마이크로프로세서가 실행할 수 있는..

Agile 애자일은 사전적 의미론 '날렵한', '민첩한' 을 뜻한다. 소프트웨어 개발 방법론의 하나인 애자일 프로세스는 처음부터 끝까지 계획을 수립하고 개발하는 폭포수(waterfall) 방법론과는 달리 개발과 함께 즉시 피드백을 받아 유동적으로 개발하는 사상이다. -> 방법론이라고 소개한곳도 있으나, 애자일 자체가 의미하는 것은 사상 혹은 철학일뿐이고 이러한 사상을 계승하여 나온 방법론이 칸반, 스크럼 같은 방법론이라고 한다. - 고객 만족을 최우선으로 하는 개발(고객의 지속적인 피드백을 통해 개선) - 짧은주기의 개발단위를 반복(ex. sprint)하여 하나의 큰 프로젝트를 나가는 방식 - 핵심은 유연성과 의사소통 그리고 동료와의 협업 애자일을 계승한 방법론 스크럼(scrum) 애자일 방법론에는 스크..

운영체제가 프로세스 스케줄링을 위해 사용하는 실질적인 방법이다. 대표적인 CPU 할당을 위한 프로세스 스케줄링 알고리즘의 종류는 아래와 같다. 1. 선입 선처리 스케줄링(FIFO) 준비 큐에 삽입된 순서대로 CPU를 할당해주는 방식이다. 먼저 실행되는 프로세스들의 실행 시간이 길다면, 대기 중인 프로세스들이 기다리는 시간이 매우 길어질 수 있다. 2. 최단 작업 우선 스케줄링(Shortest Job First) 실행 시간이 가장 짧은 프로세스부터 CPU를 할당해주는 방식이다. 3. 라운드 로빈 스케줄링(Round Robin) 준비 큐에 삽입된 순서대로 CPU를 할당하지만, 정해진 시간(타임 슬라이스)만큼만 할당해주는 방식이다. 정해진 시간동안 전부 실행되지 못했다면, 맨 마지막 순서로 돌아가서 다시 기다..

UX는 사용자 경험(User Experience)다. 사용자 경험을 중시하는 서비스는 반드시 성공하기 마련이다.(물론 다양한 복합적인 요소도 필요, 반박 시 그 말도 맞긴 함) 토스, 카카오 뱅크, 업비트 등등 수많은 서비스들이 증명했다. 토스나 카뱅같은 서비스가 아닌 다른 1 금융권 서비스에서 해외입출국금지 메뉴를 이용하려면 어떻게 해야 할까? 경험상, 굉장히 번거로운 몇 개의 과정을 거쳐 신청해야 한다. 심지어 은행앱을 설치했음에도 별도의 앱을 설치해야 하는 경우도 있다. 나는 이런 꼭 필요하고 자주 이용하는 메뉴임에도 이런 UX를 만나면 피가 거꾸로 솟는다.... 반면에, 카뱅을 이용하면 간단하게 토글 버튼하나로 해당 서비스를 이용할 수 있다. 기가 막히다! 좋은 UX란 무엇일까? 좋은 사용자 경험..

주로 FE 개발을 하고 있지만, 실무에서는 종종 리눅스 명령어를 사용해야 하는 경우가 많습니다. 리눅스 명령어는 각종 테스트를 수행하거나 커널에 작업을 요청하거나 필요한 정보를 확인하는 데 유용합니다. 또한, CLI(Command Line Interface)를 통해 작업하는 것이 GUI(Graphical User Interface)보다 업무 효율을 높일 수 있습니다. 마우스를 사용하는 것보다 키보드로 명령어를 입력하는 것이 시간을 절약할 수 있습니다. (시간 -> 자원 -> 돈) 배워야하는 이유는 간략하게 나열해 볼 수 있겠네요 시스템 관리: 리눅스는 다양한 서버 및 임베디드 시스템에서 널리 사용되며, 이러한 시스템을 관리하기 위해 명령줄 인터페이스를 사용하는 것이 효율적입니다. 기본 명령어를 알고 사용..

코딩은 개발자들이 해야 하는 많은 일 중 하나 개발자의 필요조건일 뿐, 비즈니스 목적을 달성하기 위한 도구일 뿐 그 외에 어떤 일들이 있는가? 1. 우선순위 선정하기 2. 개발 일정과 비용 산출하기 3. 주어진 여건에서 최적의 결정하기 4. 비기능적 요구사항과 계약 조건 검토하기 5. 지리적으로 분산된 팀들과 협업하기 6. 사업 목표 이해하기 7. 전체 비즈니스에 영향을 미칠 기술 선정하기... 등등 주위를 보면 존경받는 / 함께 일하고 싶은 / 팀에 큰 전력이 되는 개발자들은 코딩뿐만 아니라 위 역량이 뛰어남 주위 개발자를 보면서 수집한 행동들을 기반으로 크게 본질, 관계, 속마음 3개의 키워드를 선정해 팀에 기여하는 개발자란 어떤 모습인지에 대해 정리해 보겠습니다. 1. 본질 Situation 1 어..

디자인 패턴은 프로그램을 개발하는 과정에서 빈번하게 발생하는 디자인 설계문제를 정리해서 상황에 따라 간편하게 적용할 수 있게 정리한 것입니다. 선배 개발자 분들의 시행착오 끝에 그중 가장 효과적이라고 알려진 패턴으로 잘 활용할 수만 있다면 적지 않은 시간과 노력, 시행착오를 줄일 수 있습니다. 간략하게 미리 알아두고 풀고 싶은 문제가 있을 때 적재적소에 적용한다면 좋겠습니다! 디자인 패턴 용도에 따라 나누기 가장 대중적으로 널리 알려진 나누는 기준은 생성, 구조, 행동으로 나눈 기준입니다. 생성 패턴(Creational Pattern) 객체 인스턴스를 생성하는 패턴으로, 객체를 생성하는 방법과 시점을 추상화하고, 코드의 유연성, 재사용성 및 유지보수성을 향상시킵니다. 싱글턴 패턴(Singleton Pat..

이 글로 얻을 수 있는 것 - 메모리릭을 디버깅 할 수 있는 자신감! - Node.js 환경이든 브라우저 환경이든 크롬 브라우저의 Memory 탭에서 메모리 누수의 범인을 찾을 수 있음! 메모리 누수(Memory Leak)이란? 메모리 누수는 실제로는 필요하지 않은데, 메모리를 계속 차지하고 있는 현상 메모리 누수가 있으면 뭐가 문제일까? JS를 동작시킬 메모리가 부족하니까, 성능이 좋지 않게 된다. - GC의 활동이 늘어나면, CPU 사용량이 늘어난다. - CPU intensive한 작업이 늘어나면, 이벤트 루프가 블로킹되서 연산이 느려진다. 띄워놓은 Node.js 서버가 죽는다. - SIGABRT 등의 시그널로 인한 프로세스 종료 - 인스터스가 재시작되고 일부 요청에 대한 응답이 실패할 수 있음 - ..