2026년 1월 현재, 나는 AI를 어떻게 쓰고 있는지 정리해봤다. 정말 AI enthusiasts분들처럼 딥하게 쓰는 건 아닌데, 그럼에도 불구하고 AI 이전으로는 못 돌아갈 것 같은 상황까지는 온 느낌이다. 1. **영어회화**를 위해서는 ChatGPT를 쓴다. 그냥 무료 plan이고, 자기 전에 잠깐이나 심심할 때, 또는 운전 중에 음성모드로 해두고 영어로 대화한다. 영어 native 친구가 많지 않다면 좋은 대체재이고...

얼마 전, 이제는 리액트를 놓아주고 시그널 기반의 최신 프레임워크(ex: Vue, Svelte...)들을 쓰자는 취지의 [위시켓 글](https://yozm.wishket.com/magazine/detail/3153)을 보고 굉장한 공감을 했다. 이전에 [글로 쓰기도 했지만](https://blog.coinsect.io/posts/why-i-prefer-vue-over-react), 나 역시 리액트를 안 좋아한다. 2025년...

최근에 [Nuxt](https://nuxt.com/)를 쓸 일이 있어 Nuxt 4 기반 프로젝트를 새로 만들어보았다. ``` npm create nuxt@latest <project-name> ``` 원래도 DX가 뛰어난 Vue를 오랜기간 써 왔기 때문에 학습곡선은 거의 0에 가까웠고, Remix 경험이 있어서 디렉토리 기반 라우팅에도 바로 적응했다. 레일즈마냥 워낙 많은 마법이 존재해서 "이게 왜 되지?" 싶은 것들이 좀...

원티드로 딸깍 지원하고 별 생각을 안 하고 있었는데 서류 합격이 되어서 과제 전형을 수행하라는 메일을 받았다. NDS 서약 때문에 자세히는 얘기할 수 없지만, 일정 시간을 주고 실제 입사한다면 구현해볼 법한 기능을 구현하는 과제였다. 개인적으론 구현해야 할 양이 좀 많다고 생각했으며, 꽤나 체력적으로 부쳤지만(~~늙은듯~~) 어떻게 꾸역꾸역 해서 제출했다. 아마 다 하지 못하는 지원자도 상당히 많겠다는 생각이 들었다. ...

바로 직전 글이 [업비트 웹소켓 API의 Origin별 Rate Limit 우회하기](https://blog.coinsect.io/posts/bypass-upbit-websocket-rate-limit)였다. 결론적으로 거기까진 성공적이었으나, 모든 트래픽이 죄다 내 ec2 인스턴스로 들어오는 터에 비용이 갑자기 엄청나게 증가했다. ![](https://d1085v6s0hknp1.cloudfront.net/boards/coi...

필자가 운영중인 암호화폐 시세 정보 제공 사이트 [코인충](https://coinsect.io)에서는 업비트 웹소켓 API에 자주 붙는다. 일례로 메인 화면에는 아래와 같은 영역이 있고,  김프가와 비슷하게 아래와 같은 페이지도 ...

## Options API Vue 2 에서는 아래와 같이 작성하는 Options API가 주류였다. ```javascript <script> export default { props: { // 부모로부터 넘겨받는 값들 }, methods: { // 메소드들 }, computed: { // 계산된 값들 }, data: () => { // 데이터 }, mounted(...

커리어 초창기에 일했던 회사에서 나는 golang으로 백엔드에 입문했다. 물론 그 이전에도 PHP + Codeigniter 조합으로~~틀~~ SSR을 했던 경험이 있긴 한데, 본격적으로 백엔드 + 프론트엔드가 분리된 웹앱을 만들어본 경험에서 첫 도구는 golang이었다. 그리고 이 때 받았던 인상은 너무나 긍정적이었어서, 지금도 최애인 nodejs와 병용하고 있다. ## 마스코트 ![](https://go.dev/blog/g...

간만에 무한반복 중인 곡이 생겼다. 일단 곡이 정말 잘 뽑혔고 뮤비나 음악의 전반적인 디렉팅의 디테일 하나하나도 너무나 좋다. ## 뮤직비디오 [](https://youtu.be/IajeQM00yfE) ## 리뷰 ![](https://d1085...

운영중인 사이트 [코인충](https://coinsect.io/)에는 박호두, 사또, 짭구 등 유명 스트리머들의 포지션을 거의 실시간에 가깝게 계속 추적해서 보여주는 기능이 있다.  코인충 관리자 페이지의 '실시간 포지...

자바스크립트에 네이티브로 반응형 값을 선언할 수 있는 방식을 추가하자는 [제안](https://github.com/tc39/proposal-signals)이 있다. 아직 Stage 1이며, [폴리필](https://github.com/proposal-signals/signal-polyfill)까지 구현이 완료된 상태이다. 개인적으로 정말로 크게 기대되는 부분이다. 반응형 프로그래밍은 오랜 역사를 가지고 있다. 아마 스프레드시...

그야말로 생성형 AI의 시대이다. 이제 **좋은 검색 결과를 얻기 위한 핵심 키워드**를 잘 입력하는 것에 목을 멜 필요가 없다. 검색엔진이 아닌 [ChatGPT](https://chatgpt.com/)나 [Gemini](https://gemini.google.com/)에 접속해 전문가와 대화하듯 자연어로 '실제 질문'을 하면 된다. 그러면 AI들은 자기들이 인터넷을 뒤져서 최적의 답변을 해준다. 온 마켓이 그야말로 blood...

프론트엔드 코딩을 하다보면 `console.log`를 넣을 일이 매우 많다. 나는 특히 크롬의 디버깅 툴을 쓰기보다는 필요한 곳들에 로깅을 하면서 개발하는 것을 선호한다. 그런데 자바스크립트는 함수가 실행될 때 주변의 환경을 기억하는 클로저라는 기능이 있다. 이 때문에, 참조되는 변수는 메모리에서 GC의 대상이 되지 않고 남아있게 된다. 아래의 상황을 생각해보자. ```javascript const myArr = new Ar...

Universal Rendering을 하는 모던 웹앱에는 Hydration이라는 개념이 존재한다. 단순한 SPA(Single-Page Application)와 달리 서버에서 일단 HTML을 온전히 렌더링해서 내려준 뒤, 클라이언트에서 자바스크립트 다운로드 & 해석이 끝나면 갖고 있는 HTML에 필요한 이벤트들을 바인딩하는 작업을 하는 것을 일컫는다. 이렇게 하면 검색엔진에도 대응할 수 있고(SEO), 첫 요청 이후로는 SPA로...

퍼블리싱을 하다보면 리스트를 많이 보게 된다. 아래와 같은 목록에서, 자녀들 사이의 간격을 8px로 설정하고 싶다면 어떻게 코드를 쓸 것인가? ```markup <div class="parent"> <div>1</div> <div>2</div> <div>3</div> </div> ``` 아마도 아래와 같은 코드를 쓸 것이다. ```css .parent { div:not(:last-child) { m...

SEO란 Search Engine Optimizing, 검색 엔진 최적화를 말한다. 검색엔진(특히 구글)이나 SNS들이 내가 만든 웹사이트의 내용을 잘 읽고 내용을 이해할 수 있게 하는 작업이다. 이것은 브랜드 인지도와 마케팅에 큰 영향을 줄 수 있다. 구글은 대개 양질의 정보를 상단에 띄워주는 경향이 있고, 사람들이 많이 검색해볼 법한 키워드들에서 내 컨텐츠가 상위권에 노출된다면 웹사이트 유입을 늘리는데 큰 도움이 된다. 이...

나는 [비트코인 블로그](https://btc.coinsect.io)를 운영중이다. 사람들이 흔히 갖는 비트코인에 대한 FUD(Fear / Uncertainty / Doubt), 궁금해하는 점들 또는 기타 기술적 질문들에 대해 매번 답변하는 것이 귀찮아 글로 잘 정리한 뒤 링크만 전달해주기 위해 시작한 블로그이다. 반면 이 블로그는, 개발과 IT 및 개인적 관심사들에 관한 이야기를 하기 위한 공간이다. 그리고 이력서에 Rea...

### 1. Vue와 React의 간단 비교 React는 오랜 기간 왕좌를 차지해온 jQuery의 아성을 깨고 엄청난 인기를 얻는데 성공한 모던 프론트엔드의 대표 **UI 라이브러리**이다. 2024년 현재까지도 React의 지대한 인기는 식을 줄을 모른다. ![NPM 트렌드](https://d1085v6s0hknp1.cloudfront.net/chat/10368a5d-3977-48f1-acb3-5d4e1fb8f90f_ima...

[비트코인 블로그](https://btc.coinsect.io)는 글을 HTML로 퍼블리싱하고 있는데, 이 개인 블로그는 마크다운으로 진행해보려 한다. 링크를 걸 때도 []와 ()의 조합을 쓰는 것이 일일히 `<a>` 태그를 사용하는 것보다 쉬운 감도 있기도 하고, 아래와 같은 코드 블록의 스타일링도 마크다운 형태로 작성해 서드파티에 의존하는게 훨씬 용이하다고 느껴지는 부분도 있다. ```javascript // etern...