분류 전체보기

이전 글 1편은 맥미니를 사게 된 결정적인 이유와, 홈서버의 목적이 기록된 글이다. 이 포스트는 지금까지 어떤 조건에서 홈서버를 운영해왔고, 대략 4년간 홈서버 3대를 돌려본 사람으로서 홈서버의 선정기준을 공유하려고 한다. https://devent.tistory.com/174 Mac mini로 홈서버를 구축해보며 #1 사건의 발단 지난 3년간 LG 14인치 그램과 HP 노트북 2대로 홈서버를 구성했었다. 그러던 중 오랜 기간 플러그가 꽂힌 채로 배터리 과열이 생기게 되었고 결국 배터리가 부풀어 오르는 현상이 발 devent.tistory.com 맥 미니 서버를 구축하기 까지 LG 그램 14인치로는 간단한 웹서버를 구축하는데 문제가 없었다. 그러나 동시접속자가 늘고 사이트의 트래픽이 무거워지면서 점차 부..

SASS 기존 웹페이지에 스타일을 적용하기 위해서는 CSS로 하나하나 변경해주어야 하는 번거로움이 있다. 이 같은 CSS의 개발 편의성을 높이기 위해 등장한 SASS, 프리프로세서 스크립트 언어이다. CSS의 경우 HTML환경에 style 태그만 지정해주면 바로 로드가 되는데 이 SASS란 녀석은 그렇지가 않다. 사용하기 전에 CSS로 컴파일하는 과정이 필수다. 그래서 보통 웹팩과 함께 사용된다. 1. 필요 라이브러리 설치 npm i webpack webpack-cli sass sass-loader style-loader mini-css-extract-plugin css-loader 설치를 완료해주면 웹팩 설정파일을 만들어준다. 2. webpack.config.js import MiniCssExtract..

사건의 발단 지난 3년간 LG 14인치 그램과 HP 노트북 2대로 홈서버를 구성했었다. 그러던 중 오랜 기간 플러그가 꽂힌 채로 배터리 과열이 생기게 되었고 결국 배터리가 부풀어 오르는 현상이 발생하게 된다. 사실 조만간 노트북 서버에서 미니 PC 서버로 갈아탈 예정이었기 때문에 곧바로 폐기 처분했다. 이후 고대하던 맥미니를 영접하며 별다른 고민 없이 24시간 상시 고문실(?)로 들어가게 되었다. (사..사알... 살려줘ㅓㅓ...) 참고로 24시간 켜져있는 서버용이라 초기에 세팅할 때 제외하고는 모니터 연결도 제외해놓았다. 그러면 서버 관리가 힘들어지기에 VNC 기능을 사용해서 원격 접속으로 관리한다. 기존에 맥북이 있었기 때문에 크롬으로 vnc:// 주소를 입력하기만 하면 된다. 노트북 서버 vs 맥미..

😎 디자인 시스템을 구상하기로 마음먹었다 그동안 개발했던 서비스마다 디자인이 재각각이었다. 버튼 색은 모두 달랐고 내비게이션 바 디자인은 페이지마다 달랐다. 새로운 서비스를 만들거나 개선할 때마다 이전 디자인을 참고해서 새로 만들어야 했고 표준 없이 만들다 보니 걸리는 시간은 배로 늘어났다. 이토록 통일되지 않는 디자인 요소들을 개발 효율을 위해 디자인 시스템으로 묶을 필요가 생겼다. 디자인 시스템이란 디자인 원칙, 컴포넌트, UI 패턴 등을 포함한 디자인 세트라고 보면 된다. 디자인 시스템의 장점으로는 각각의 서비스마다 디자인을 통일시켜주며 서비스의 정체성을 확고하게 할 수 있다. 동시에 디자인 코드의 반복을 줄여주고 빠른 프론트엔드 개발이 가능하게끔 한다. 즉, 디자인 시스템을 적용한다면 빠르고, 확..

원칙 세상에는 수많은 기술이 있다. 오래된 기술부터 새로 나온 따끈따끈한 기술까지, 그 범위는 지금도 넓어지고 있다. 그러나 신기술이 최신이고 좋아 보인다고 해서 무작정 도입했다가는 낭패를 볼 수 있다. 그만큼 예상치 못한 이슈가 발생할 가능성이 크고 커뮤니티가 활성화되어있지 않아 버그나 취약점에 대해 발 빠른 대응이 힘들다는 단점이 있기 때문이다. 그렇다고 해서 신기술을 보수적으로만 바라본다면, 보다 본질적인 생산성을 해칠 수 있기에 신기술에 대해서는 신중하게 바라보아야 한다. 따라서 이 글에서는 신기술을 도입했을 때에 장단점을 비교하고 프로덕트를 위한 방향을 지향하는 원칙을 정의하고자 한다. 하나, 신기술이 기술 의존도를 높이는가. 한때 개발자들 사이에서 유행했었던 자바스크립트 라이브러리가 있다. 바..

요약 프로메테우스는 오픈소스 시스템 모니터링 툴이다. 쿠버네티스 환경을 운용하는 시스템이라면 프로메테우스를 사용하라고 권장할 정도로 널리 사용되고 있다. 프로메테우스가 매트릭 수집을 하기 위해서는 익스포터라는 프로세스를 두게 된다. 다른 모니터링 툴과 다른 점은 push가 아닌 pull 방식으로 매트릭을 수집한다는 점이다. 이때 익스포터 서버는 전송 스케줄 부하를 신경 쓰지 않아도 된다는 장점이 있다. 프로메테우스 설치&실행 맥 OS에서 구동될 예정이기 때문에 homebrew를 이용하겠다. 아래 명령어를 입력해서 설치 후 실행을 해보자. 이후 http://localhost:9090/ 로 접속해서 정상 작동하는지 확인하면 된다. brew install prometheus brew services start..

사실 이걸 굳이 회고 카테고리로 넣었어야 했나.. 쨋든, 블로그 이름과 프로필 이미지를 변경했습니다. (드디어!) 이전의 투박하던 블로그 이미지와 기억하기 난해한 제목을 제 프로필 사진과 "대혼돈의 형준버스"라는 약간은 캐주얼하면서도 궁금해지는 이름으로 바꿨습니다. 최근 전체 방문자 20000명도 넘었겠다. 보다 개인적이면서 저의 아이덴티티와 "DeVent" 라는 1인 브랜드를 분리할 필요가 있었습니다. 이제 https://blog.devent.kr 은 DeVent 기술 블로그로 활용할 예정입니다. 더 좋은 네이밍 있으면 추천 받겠습니다.

winston 설치 및 설정 아래 명령어를 입력해서 설치해줍니다. npm i winston 코드 설정 import winston from 'winston'; import dayjs from 'dayjs'; const messageSymbol = Symbol.for('message'); const colorset = { "INFO": "\x1b[34m[ %s ]\x1b[0m", "ERROR": "\x1b[31m[ %s ]\x1b[0m", "WARN": "\x1b[33m[ %s ]\x1b[0m" } export async function init () { winston.configure({ level: 'info', format: winston.format.combine( winston.format(func..