기술 블로그 템플릿 판형: 명령어와 결정 기록을 구분해 읽는 구성
판형은 장애 복기와 성능 측정, 마이그레이션 과정을 남기는 개발자와 테크 팀을 위한 기술 블로그 템플릿입니다. 표지와 최신 글에서 다룰 문제를 고르고, 본문에서는 명령어·설정값·결정 근거·측정 조건을 구분해 읽습니다. 연재와 글 끝의 변경 이력에서 관련 기록도 찾아볼
장애 훈련 기록을 다시 보려면 실행한 명령과 결과 표, 그 방식을 택한 이유를 함께 찾아야 합니다. 판형은 명령·결과·결정 이유를 한 글에서 구분해 볼 수 있도록 만든 기술 블로그 템플릿입니다. 사내 기술 글을 한곳에 모으려는 테크 팀이나 개인 노트에 복기 글을 쌓는 개발자에게 어울립니다.
첫 화면은 먹빛 바탕 위에 「COVER STORY 이달의 기술 주제」를 걸고, 사진 모서리에 「NO. 058」 같은 일련번호를 단 표지 글로 시작합니다. 분야 꼬리표와 큰 제목 아래에는 무엇을 확인한 글인지 한 줄로 적고, 읽는 시간까지 밝혀 열기 전에 분량을 가늠하게 합니다. 같은 번호가 최신 글 목록과 글 머리, 맨 끝의 「END · 058」에도 적힙니다.
글을 열면 명령과 출력을 나눈 터미널 상자, 줄 번호가 붙은 설정 파일, CONTEXT·DECISION·TRADE-OFF로 나뉜 결정 블록, 측정 조건을 단 성능 표를 차례로 확인할 수 있습니다. 강조색은 라임 하나만 쓰고 그림자와 둥근 모서리는 뺐습니다. 코드와 표는 1px 선으로 나눠, 어느 글에서든 코드와 표를 같은 모양으로 찾아 읽을 수 있게 디자인했습니다. 판형 글 화면
이달의 기술 주제 아래 표지 글이 무엇을 확인했는지 한 줄로 밝힙니다
표지는 「이달의 기술 주제 · SYSTEM RELIABILITY」와 오른쪽 「01 / 04」 표시로 시작합니다. 큰 사진 옆에서 분야 꼬리표와 두 줄 제목, 확인한 내용을 적은 소개 한 줄을 읽고 필자·날짜·읽는 시간까지 본 뒤, 라임색 「기사 읽기」 버튼을 바로 누르거나 SAVE로 저장할 수 있습니다. 아래 썸네일 네 칸은 SYSTEMS·BACKEND·RUNTIME·DATA 순으로 이번 표지 글을 늘어놓아, 칸을 누르면 위 표지가 그 글로 바뀌고 고른 칸에 라임 밑줄이 그어집니다. 표지는 8초 남짓마다 다음 글로 넘어가다가 마우스를 올리면 멈춥니다. 판형 첫 화면
표지 글의 번호는 최신 글 목록과 본문 끝에도 표시돼 독자가 같은 글을 다시 찾기 쉽습니다. 제목과 본문은 Noto Sans KR 고딕으로 쓰고, COVER STORY·LATEST·CONTENTS 같은 꼬리표와 날짜·코드는 IBM Plex Mono로 자간을 넓혀 적어 본문과 꼬리표가 바로 구분되게 디자인했습니다.
최신 글의 번호·분야·소개를 읽고 코드 속 명령어까지 검색합니다
‘최신 글’은 줄마다 일련번호, SYSTEMS·BACKEND·SECURITY 같은 분야 꼬리표, 제목, 한 문장 소개, 날짜를 같은 자리에 보여 줘서 위아래 글을 견주기 쉽습니다. 독자는 분야 꼬리표와 소개 한 줄을 읽고 필요한 글을 고를 수 있습니다. 오른쪽 ‘MOST READ’에서는 많이 읽힌 다섯 편을 사진과 분야·번호·읽는 시간으로 확인할 수 있습니다. 전체 글 화면의 분류 칩에는 글 수가 적혀 있어 INFRA를 누르면 INFRA 글만 골라 볼 수 있습니다. 휴대폰에서는 메뉴 버튼을 누르면 갈래마다 글 수가 적힌 두 칸 메뉴가 내용을 밀어 내리며 펼쳐집니다. 홈과 목록, 본문, 글 하단에는 애드센스 광고 자리가 미리 잡혀 있어, 운영자는 광고가 글 사이 어디에 들어가는지 보면서 블로그를 꾸릴 수 있습니다. 판형 전체 글
머리의 검색 버튼을 누르면 「제목, 본문, 코드, 태그」를 찾는 검색창이 열립니다. `kubectl`처럼 명령어 이름을 넣으면 그 명령이 들어 있는 글이 뜨고, 코드 블록에서 찾았다는 「CODE」 표시가 함께 나옵니다.
명령어·측정 조건·결정 이유를 글 안에서 구분해 보여 줍니다
터미널 상자는 위 칸에 명령, 아래 칸에 출력을 나눠 담고 프롬프트 「$」만 라임으로 칠합니다. 결과 표는 첫 칸을 굵게 고정해 휴대폰에서 표가 넓어지면 표만 옆으로 밀립니다. 설정 파일은 「YAML」 머리와 COPY 버튼, 줄 번호를 달고, 그 아래 결정 블록은 CONTEXT·DECISION·TRADE-OFF 세 줄을 라임 왼쪽 선 하나로 묶어 무엇을 왜 정했는지 한눈에 보이게 합니다. 성능 표는 오른쪽 위에 측정 조건을 적고 BEFORE·AFTER 가운데 AFTER만 라임으로 굵게 칠합니다. 독자는 COPY로 명령을 옮겨 자기 환경에서 다시 돌려 보고, 측정 조건을 보고 자기 수치와 견줄 수 있습니다. 판형 장애 훈련 글
글 머리에서 발행일과 「UPDATED」 날짜, 코드 조각 수를 확인하고 SAVE·글자 크기 A−·A·A+·공유 버튼을 사용할 수 있습니다. 소제목마다 01~07 번호가 달리고, 오른쪽 「CONTENTS」 목차가 현재 읽는 칸을 라임으로 표시합니다. 맨 위 막대에서는 얼마나 읽었는지도 볼 수 있습니다. 머리 버튼으로 라이트 화면으로 바꾸면 강조색이 짙은 초록으로 바뀌어 흰 바탕에서도 또렷합니다.
연재는 한 문제를 여러 회차로 묶어 읽은 회차를 세고, 글 끝에는 변경 이력이 남습니다
홈의 연재 판에서는 왼쪽의 연재 제목·소개·「0 / 4 읽음」·「연재 시작하기」를 확인하고, 오른쪽에서 회차 01~04의 사진·제목·분야·읽는 시간을 비교할 수 있습니다. 회차마다 BACKEND·RUNTIME·AI INFRA·WEB으로 분야가 달라, 같은 병목 문제를 서버와 브라우저에서 각각 잰 기록이 한 줄로 이어집니다. 다음에 읽을 회차에는 라임 「NEXT →」가 달리고, 연재 화면에서는 읽은 만큼 「2 / 4 읽음 · 3편 이어 읽기」로 바뀌어 다 읽으면 「완료 다시 보기」가 됩니다. 판형 연재 화면
글 끝에는 REFERENCES의 외부 문서 링크와 「END · 058」, 같은 주제의 글로 가는 태그, 고친 날짜와 내용을 적은 CHANGELOG, 필자 카드, 이전 글과 관련 글 세 편이 나옵니다. 홈 연재 판 아래에는 「ENGINEERING LETTER」 구독 칸도 있어 새 글 소식을 받고 싶은 독자가 이메일을 남길 수 있습니다.
판형은 장애 복기와 측정 기록을 글·코드·표·연재로 함께 보여 주고 싶은 개발자와 테크 팀을 위한 블로그 템플릿입니다. 판형 본보기 화면에서 표지 글과 코드 검색, 연재 화면을 직접 살펴보세요.
명령·결정·측정을 한 글에서 구분해 보여 주고 싶다면 아래 판형 템플릿 상세를 확인해 주세요. 이 템플릿 구매를 원하시면 블로그 제작 안내에서 구매 가능합니다. 혹은 원하는 디자인으로 맞춤 제작하고 싶으시다면 프로젝트 문의에 맞춤 견적을 요청해 주세요.