본문 바로가기

Programming

(16)
1분만에 하는 터미널 실행 시 날씨 정보 보기 설정(wttr.in) 리눅스에서 백그라운드(&)를 Done 없이 깔끔하게 실행하기에서 wttr.in의 날씨정보를 터미널을 열때마다 뿌리고 있다고 했는데, 오늘은 그 방법에 대해 소개하고자 한다. 먼저, wttr.in은 wego의 래핑으로 시작한 프로젝트로 콘솔 지향 기상 예보 서비스다. 이미지 없이 Text만으로도 멋진 날씨 정보를 볼 수 있는 서비스다. 자세한 정보는 https://github.com/chubin/wttr.in를 참조하면 된다. 설정 방법 여기서는 curl을 사용하지만, 다른 http 클라이언트를 사용해도 무방하다. 1. .bashrc나 .zshrc 파일을 연다. (사용하는 쉘에 맞게) 2. 빈 줄에 다음 명령어을 추가한다. (도시를 생략하면 현 위치 기반으로 동작) `(curl -s "ko.wttr.in/..
리눅스에서 백그라운드(&)를 Done 없이 깔끔하게 실행하기 리눅스에서 '&' 명령어를 사용하여 작업을 백그라운드에서 시작하면, 아래와 같이 PID와 작업이 완료되었을 때의 + Done 메시지가 뿌려진다. 하지만 필요없는 경우도 있다. WSL2를 사용하면서, curl로 wttr.in의 날씨정보를 터미널에 뿌리고 있는데, 이를 백그라운드로 실행하자, 날씨정보 앞뒤로 저 메시지가 뜨게 됐었다. 처음에는 output을 /dev/null로 보내는 글만 있었는데, 당연하지만 날씨 정보만 보고 싶은거지, 모든 output을 버리고 싶었던건 아니었다. 서론이 길었다. 답은 명령을 괄호로 감싸는 것이다. 괄호로 감싸게 되면 subshell에서 실행되기 때문에 위 두 메시지가 보이지 않는다고 한다. 예) (curl wttr.in &) 참고자료 : https://stackoverf..
모바일 디바이스를 위한 웹 최적화가 필요한 이유 원래는 애플의 아이폰과, 최신 플래그십 안드로이드 스마트폰의 성능은 급속도록 증가하고 있다. 이에 맞춰 모바일 디바이스를 위한 웹 성능 최적화 전략이 수정될 가능성이 있다. 느린 핸드폰을 지원하기 위한 자바스크립트 성능 최적화보단, 120Hz 스크린을 위한 애니메이션 지원이 더 중요해질 수 있다. 물론 모바일 디바이스는 배터리라는 한계점을 안고 있기 때문에, 여전히 자바스크립트 성능 최적화는 중요하다. ―라고 생각했었다. 현실은 달랐다. 이 글에 따르면 모바일 성능 격차는 매우 크다. 특히 안드로이드와 iOS의 성능 격차는 크며, 플래그십 안드로이드와 중저가 안드로이드 스마트폰의 성능 격차는 충격적으로 크다. 원래 위와 같이 생각했던 이유는 구글에서는 평균적인 모바일 기기를(라이트하우스등) 2016년에 ..
뜯어 고치기 vs '2' 추가하기 이게 아닌데... 뭔가 잘못됐다. 높이가 40px인 공통 버튼 컴포넌트 를 만들었다. 하지만 알고 봤더니 높이가 40px이 아니라 28px이었다. 이미 수십 번 넘게 이곳저곳에서 쓰였던 상황이다. 당신은 어떤 선택을 해야 할까? A. 뜯어고치기 어차피 바뀌어야하는 것이다. 레이아웃이 깨지는 곳을 고치는 것은 매우 귀찮은 일이지만 어처피 해야 할 일을 하는 것일 뿐이다. 지금 고치지 않으면 점점 공수는 커져만 갈 것이다. 그래서 당신은 공통 버튼 컴포넌트를 수정하기로 결심했다. 선택의 결과 이제 당신에게 주어진 것은 버튼을 쓴 곳마다 레이아웃이 깨지는지 확인해야 하는 일이다. 아쉽게도 버튼은 주변 레이아웃에 많은 영향을 끼쳤다. 하단 푸터 버튼 영역의 height를 무심코 40px로 지정했었고, 15개의 ..
커밋을 잘게 쪼개자 - 커밋은 언제 하는 것이 가장 좋을까? "깃 커밋은 언제 하는 것이 가장 좋을까?" 들어가면서 커밋의 단위는 개발자들마다 생각이 각기 다를 것이다. 누구는 크게, 누구는 작게 말이다. 이 글에서는 커밋을 어느 단위로 할지에 대해 이야기한다. 다만 웹 프론트엔드 개발에 한정한다. 이는 웹 백엔드나 기타 다른 응용 프로그램 개발에서는 또 다른 원칙이 적용될 수도 있기 때문이다. 커밋의 기본 원칙 커밋의 기본 원칙은 '1 Action, 1 Commit'이라고 생각한다. 이는 추후에 혹시나 모를 revert 등을 통한 롤백을 쉽게 하기 위함이기도 하다. 하나의 액션, 하나의 커밋 하나의 액션은 커밋 메시지 한 줄이다. 예를 들면 "카드 컴포넌트 내부에 말 줄임표 처리", "font-size를 16px에서 14px로 조정", "Item이란 용어를 Ca..
개발자들이 꼭 알아야할 KJDD 방법론 KJDD 방법론은 KkulJaem Driven Development 의 약자다. 한국어로 꿀잼 주도 개발이다. KJDD 방법론은 재밌어야 개발이 잘 된다는 이론에 기반하고 있다. 물론 그 이론은 당연히도 내가 만든 것이다. 개발할 때 카페인만큼 중요한 건 꿀잼이라 생각한다. 물론 이 꿀잼의 강도는 매번 다르겠지만 어쨌든 꿀잼이기만 하면 된다. 토종꿀이든 서양 꿀이든 상관없이 꿀이면 된다는 것이다. '꿀잼 주도 개발'을 실천하는 간단한 예시가 있다. 예제를 재밌게 하면 된다. 예를 들어 쇼핑몰 사이트를 만든다고 생각해 본다. 보통이라면 상품 테스트 데이터로, 상품명을 '상품 1', '상품 2', '상품 3'으로, 상품 사진은 기본 이미지로 넣을 것이다. 하지만 KJDD 방법론은 다르다. 상품명은 '하품',..
TypeScript 4.5의 변경 사항 요약 지난주, TypreScript 4.5가 출시되었습니다. 아래의 글에서는 TypeScript 4.5에 추가된 기능이나 변경사항들을 요약하여 소개합니다. 이 요약사항의 원본 글은 Announcing TypeScript 4.5 입니다. Awaited 유형을 통한 Promise 개선 Promise들을 재귀적으로 언래핑하여 'Promise' 와 같은 타입을 'number'로 바꿔주는 Awaited가 추가 됩니다. 이번 업데이트를 통해 Promise.all과 같은 함수를 사용할 때, 타입이 잘못 추론되는 오류를 해결 할 수 있습니다. 개인적으로 이번 업데이트 중 가장 크게 느껴질 업데이트라 생각합니다. 추가적이 기능들은 깃허브 PR을 참조하세요. 사용하지 않는 import 제거를 끄는 플래그 추가 eval을 사용하..
[리팩토링] 코드 숨기기, 가독성 좋은 코드 짜기 변수 추출(Extract Variable) 어떤 코드가 조금 보기 복잡해 졌다고 가정했을 때, 먼저 시도 해볼만한 것은 코드를 쪼개 변수로 나누는 것이다. 예를 들어 아래와 같이 부모와 자식의 값을 더하는 함수가 있다고 가정한다. 읽기 매우 난해할 것이다. 물론 함수명을 잘 지어도 좋지만, 여기서는 논외로 둔다. 각 값들을 변수로 쪼개면 아래와 같은 코드가 된다. 조금 더 알아보기 쉬운 코드가 됐다. 긴 코드들이 있었지만, 이 함수에서의 핵심 로직은 부모 값과 자식 값을 더한다는 것을 알 수 있게 됐다. 코드의 추상화 제멋대로 붙인말이지만, 뭔가 좀 있어보이게 말하자면, '코드의 추상화'라고도 할 수 있을 것 같다. 실제 데이터의 흐름은 app.store.data.parent.value + app.sto..