지난 포스팅에서는 GitHub Actions의 4가지 핵심적인 개념인 워크플로우(workflow), 작업(job), 단계(step), 액션(action)에 대해서 가볍게 살펴보았는데요. 이번 포스팅에서는 이 중에서도 가장 다양하게 설정할 수 있는 작업(job)에 대해서 좀 더 깊이 알아보도록 하겠습니다. GitHub Actions에서 작업(job)이란? 먼저 GitHub Actions에서 작업(job)의 역할과 위치에 대해서 간단히 복습을 하고 넘어가겠습니다. 작업(job)은 어떤 이벤트가 발생했을 때 독립된 환경에서 실행되야 하는
이번 포스팅에서는 npm 설정을 할 때 필요한 npmrc 파일과 npm config 커맨드에서 대해서 알아보겠습니다. npmrc 파일 npmrc 파일은 npm에서 설정을 저장해두는 파일로서 내장(builtin), 전역(global), 사용자(user), 프로젝트(project) 이렇게 4가지 범위의 npmrc 파일이 존재하는데요. 먼저 내장 설정은 npm이 설치된 경로에 있는 npmrc 파일에 명시되어 있으며 모든 기본 설정을 담고 있습니다. 전역 설정은 같은 컴퓨터를 사용하는 다른 사용자와 모든 프로젝트에 광범위하게 적용되기 때문
이번 포스팅에서는 파이썬에서 reversed() 함수를 이용해서 거꾸로 루프를 돌리는 방법에 대해서 알아보려고합니다. 뿐만 아니라 reversed() 함수와 비슷해보이지만 오묘하게 틀린 리스트의 slicing 연산자와 reverse() 함수에 대해서 간단히 살펴보도록 하겠습니다. 거꾸로 루프 돌리기 다음과 같이 5개의 알파멧 문자를 담고 있는 리스트를 어떻게 루프 돌면서 각 문자를 출력할 수 있을까요? 아마도 다음과 같이 간단한 for 문으로 어렵지 않게 각 문자에 순서대로 접근할 수 있을 것입니다. 그럼 역방향으로 각 문자에 접근
우리가 코드를 관리하는 GitHub의 저장소(repository)에서는 여러가지 일(event)들이 일어날 수 있죠? 개발자가 새로운 커밋(commit)을 푸시(push)할 수도 있고, 기여자(contributor)가 PR(pull request)을 제출하거나 사용자가 이슈(issue)를 보고할 수도 있습니다. GitHub Actions를 사용하면 이렇게 GitHub 저장소에서 일어나는 다양한 이벤트에 자동으로 반응하도록 워크플로우(workflow)를 구성할 수 있는데요. 이번 포스팅에서는 GitHub Actions에서 워크플로우를
지난 포스팅에서는 GitHub Actions를 이해하기 위해서 필요한 핵심 개념에 대해서 알아보았습니다. 이번 포스팅에서는 GitHub Actions 입문자를 위해서 정말 기초적인 워크플로우를 하나 생성해보려고 함께 테스트를 해보겠습니다. GitHub 저장소 생성 GitHub 계정이 있으시다면 누구나 무료로 GitHub 워크플로우를 사용해볼 수 있습니다 🤗 실습을 위해서 본인 GitHub에 계정에 github-actions-first-workflow라는 이름으로 새로운 코드 저장소(repository)를 하나를 만들고 시작하겠습니
GitHub가 Microsoft에 인수된 이후 야심차게 출시한 GitHub Actions는 CI/CD 시장에 지각변동을 일으키고 있는데요. 전 세계에 대부분의 개발자들이 이미 깃허브 계정이 있다고 해도 과언이 아닌 유리한 상황에서, GitHub Actions의 약진은 Jenkins, Circle CI, Travis CI와 같은 기존에 유수의 서비스까지도 위협하고 있습니다. 이번 포스팅은 제 블로그에서 GitHub Actions에 대해서 처음 다루는 만큼 GitHub Actions를 처음 접하시는 분들을 위해서 아주 얇고 넓게 Git
며칠 전에 드디어 React v18이 정식 릴리스가 되었죠? 🎉 이번 포스팅에서는 React v18에서 단연 가장 큰 주목과 기대를 받고 있는 기능일 Suspense에 대해서 알아보겠습니다. Suspense란? Suspense는 2018년에 첫 시연되어 React 커뮤니티에서 큰 반향을 일으킨 후, React v16.6에 실험적인(experimental) 기능으로 추가되어 이미 알 만한 분들은 다들 한 번씩 써보셨을텐데요. 많은 리액트 개발자들이 Suspense가 React의 정식 기능이 되기를 목이 빠지게 기다렸던 걸로 아는데
다른 프로그래밍 언어를 쓰시다가 파이썬으로 넘어온 분들이 for 루프 때문에 적지 않게 당황하시는 것을 자주 보게 됩니다. 다른 언어에서는 일반적으로 for 루프를 작성할 때 항상 다음 3가지를 명시를 하면서 시작하죠? 인덱스 변수의 초기 값 반복 지속 조건 인덱스 변수 갱신 방법 예를 들어, 자바의 경우 보통 다음과 같은 형태로 for 루프를 돌고요. 자바스크립트에서 for 루프를 돌리는 모습도 크게 다르지는 않습니다. 하지만 파이썬에서는 이러한 전형적인 for 문법을 제공하지 않고, 비교적 다른 언어에서는 나중에 추가된 for-
“사용자 인증을 할 때 쿠키를 사용하면 위험하고요 서버에 데이터를 저장하는 세션을 사용하는 것이 안전해요.” 사용자 인증에 대해서 논할 때 자주 듣게 되는 얘기인데요. 과연 이 말이 맞는 말일까요? 저한테는 굉장히 모순된 얘기로 들리는 것 같습니다. 많은 분들이 쿠키(cookie)와 세션(session)을 서로 대립하거나 세션이 쿠키를 대체하는 기술로 오해하는 것 같은데요. 사실 쿠키와 세션은 상호 보완을 하는 기술이라고 보는 것이 더 맞을 것입니다. 지난 포스팅에서는 서버가 브라우저에 쿠키를 어떻게 저장하고 쿠키라는 기술의 한계에
"쿠키는 클라이언트에 저장되고... 음,,, 보안에 좋지 않습니다." 😅 개발자 면접을 볼 때 쿠키에 대해서 물어보면 가장 흔하게 들을 수 있는 대답인데요. 완전히 틀린 말은 아니지만 뭔가 알맹이가 빠진 느낌이 듭니다. 쿠키가 왜 등장했는지를 이해하려면 HTTP가 무상태(stateless) 프로토콜이라는 점을 먼저 떠올려보면 좋습니다. "그럼 보안을 위해서 쿠키는 안 쓰는 게 좋겠네요?" 라고 반문을 하면 오랫동안 웹 개발을 한 분들도 머뭇거리시는 경우가 많은데요. 아무래도 대부분의 서버 프레임워크에서 쿠키를 직접 다루지 않아도
이번 포스팅에서는 다국어 지원을 할 때 정말 유용하게 쓸 수 있는 자바스크립트의 Intl API에 대해 알아보도록 하겠습니다. Intl API 소개 여러 가지 언어로 서비스를 할 수 있도록 웹 애플리케이션을 설계하고 구현하는 과정을 흔히 국제화(internalization, i18n)라고 합니다. 이를 위해서는 웹페이지 상에 사용된 문구들을 단순히 번역하여 표시해주는 것만 뿐만 아니라 동일한 데이터를 언어나 지역별로 다른 형식으로 보여줘야 하는데요. 예를 들어, 12/11/21로 표시된 날짜 데이터를 한국 사용자들은 2012년 11
GitHub에서 코드를 받아오거나 올려보고 싶은데 어디서부터 시작해야 할지 막막하신가요? Git이라는 도구를 깔아야 한다는 건 알겠는데, 설치 후에 뭘 해야 하는지 모르겠다는 분들이 꽤 많습니다. 이 글에서는 Git을 처음 사용하는 분들을 위해 설치부터 GitHub 원격 저장소와 연동하는 것까지 한 번에 정리해보겠습니다. 터미널 명령어가 낯설더라도 하나씩 따라 하다 보면 금방 익숙해질 거예요. Git 설치하기 Git을 사용하려면 먼저 컴퓨터에 설치가 되어 있어야 합니다. 혹시 이미 설치되어 있는지 확인부터 해볼까요? 이렇게 버전 정
이번 포스팅에서는 파이썬에서 모든 것이 참인지 확인할 때 사용하는 all() 내장 함수에 대해서 알아보겠습니다. 반복문으로 모두 참인지 확인하기 여러 개의 데이터가 모두 어떤 조건을 만족하는지 확인을 해야 할 때 보통 어떻게 접근을 하시나요? 많은 분들이 자연스럽게 반복문을 떠올릴 것 같은데요. 예를 들어, 여러 숫자가 모두 양의 짝수인지 확인하는 함수를 다음과 같이 구현할 수 있을 것입니다. 이 함수에 양의 짝수로만 이루어진 리스트를 넘겨서 호출하면 True를 반환하겠죠? 반면에 인자로 넘긴 리스트에 음수가 하나라도 있다면 Fal
curl로 API를 호출하고 나서 JSON 응답이 한 줄로 쭉 이어져서 나올 때 난감했던 경험, 한 번쯤 있지 않으신가요? 아니면 수백 줄짜리 JSON에서 딱 필요한 필드 하나만 뽑아내고 싶은데 눈으로 훑어보다 포기한 적은요? 이럴 때 빛을 발하는 게 바로 jq입니다. jq는 터미널에서 JSON 데이터를 자유롭게 조회하고 가공할 수 있게 해주는 커맨드라인 도구인데요. sed나 awk가 텍스트를 다루듯이 jq는 JSON을 다루는 전용 도구라고 보시면 됩니다. 이번 글에서는 jq의 설치부터 기본 문법과 실무에서 자주 쓰는 패턴까지 쭉
터미널 도구를 설치하다 보면 "Nerd Font를 설치하세요"라는 안내를 한 번쯤 보셨을 거예요. Starship을 깔 때도 그렇고, NeoVim 플러그인이나 Ghostty 같은 터미널을 꾸밀 때도 빠지지 않고 등장하죠. 그런데 막상 "Nerd Font가 뭔데?" 하고 물으면 선뜻 설명하기가 애매합니다. 폰트인 건지 아이콘 라이브러리인 건지 헷갈리는 분들을 위해 이 글을 준비했어요. Nerd Font가 뭔가요? Nerd Font는 기존 프로그래밍 폰트에 개발 관련 아이콘을 덧붙여주는 오픈소스 프로젝트입니다. "폰트 패치(patch)
파이썬에는 global과 nonlocal이라는 아주 많이 쓰이지는 않지만 종종 만나게 되는 재미있는 키워드가 있습니다. 이 두 키워드를 한글로 해석하면 각각 '전역', '비지역'으로 비슷한 의미인 것 같아서 많은 분들이 햇갈려하시는데요. 이번 포스팅에서는 이 두 개의 키워드가 왜 필요하고 어떤 경우에 사용해야되는지에 대해서 알아보도록 하겠습니다. 변수의 범위(scope) global과 nonlocal 키워드에 대해서 이해하려면 먼저 변수의 범위(scope)에 대한 개념을 간단히 짚고 넘어가야할 것 같습니다. 비단 파이썬 뿐만 아니라
개발을 하다 보면 영상이나 오디오 파일을 다뤄야 할 때가 종종 있죠. 프론트엔드에서 업로드된 영상의 포맷을 바꿔야 하거나, 데모 영상에서 오디오만 뽑아야 하거나, API 문서에 넣을 GIF를 만들어야 할 때처럼요. 이럴 때 GUI 편집 프로그램을 열기엔 너무 거창하고 간단한 커맨드 하나로 해결하고 싶을 때가 있는데요. FFmpeg은 바로 그런 상황에서 빛나는 도구입니다. 터미널에서 한 줄이면 영상 포맷을 변환하고, 오디오를 추출하고, 영상을 자르고 합칠 수 있거든요. 이번 글에서는 FFmpeg의 기본 개념부터 실전에서 자주 쓰는 명
웹사이트에 연결하고 싶은 커스텀(custom) 도메인 네임을 구매해놓고 DNS 설정이 생각처럼 잘 안되서 당혹스러우셨던 경험이 있으신가요? 아무래도 DNS 레코드에 대한 아무런 사전 지식이 없이 호스팅 서비스에서 시키는데로 따라하기가 쉽지 않은 것 같습니다. 그래서 이번 포스팅에서는 커스텀(custom) 도메인을 웹사이트에 연결할 때 알아두면 큰 도움이 되는 DNS 레코드의 기초적인 부분에 대해서 다뤄보려고 합니다. DNS 레코드란? 커스텀 도메인 추가하려고 웹사이트 호스팅 서비스가 제공하는 문서 페이지를 열어 보면 대게 A 레코드
PostgreSQL를 사용하실 때 일반적으로 데이터베이스를 보기 좋게 시각화하여 보여주는 GUI(그래픽 사용자 인터페이스) 기반 클라이언트를 이용하실텐데요. 하지만 간혹 어떤 제약 사항 때문에 이렇게 무거운 프로그램을 설치하기 어려운 상황도 생기기 마련이죠? 이런 경우 PostgreSQL에서 제공하는 CLI(명령 줄 인터페이스) 기반 클라이언트인 psql을 사용하면 매우 간편하게 터미널에서 데이터베이스에 접속할 수 있습니다. psql 명령어 설치 psql는 PostgreSQL 데이터베이스만 설치하면 기본적으로 딸려오는 CLI 도구입
웹 개발을 하다 보면 이미지를 다뤄야 하는 일이 정말 많죠. 사진을 리사이징하고, WebP나 AVIF로 변환하고, 썸네일을 만들고, 메타데이터를 확인하고... 이런 작업을 할 때 많은 분이 ImageMagick을 떠올리실 텐데요. 사실 더 빠르고 메모리도 훨씬 적게 쓰는 도구가 있습니다. 바로 libvips인데요. Node.js의 Sharp 라이브러리가 내부적으로 사용하는 이미지 처리 엔진이 바로 이 libvips입니다. Mastodon, Ruby on Rails, MediaWiki 같은 프로젝트에서도 이미지 처리에 libvips를