전체 글
-
바이브 코딩으로 서비스 하나 개발해보기 (짐 타임 테이블)개발/Study 2026. 4. 13. 17:10
안녕하세요. 오랜만에 블로그를 써봅니다. 👀(왠지 자식 소개하는 느낌이어서 존댓말로 적어봅니다.) 최근 회사 업무 외에, 내가 정말 해보고 싶어서 하는 개발은 거의 없었다는 생각이 들었습니다. 토이 프로젝트로 기획해본 것들은 많았지만, “이걸 정말 쓸까?”라는 고민과 부딪히며 결국 저조차 사용하지 않을 프로덕트를 만드는 건 아닐까 하는 생각에 아무것도 시작하지 못하고 있었습니다.이런 상황에서는 신중함이 아니라 일단 도전해보는 게 맞다는 걸 머리로는 알고 있지만, 실제로 행동으로 옮기는 건 생각보다 쉽지 않더라고요.그래서 이번 글은, 그런 고민 속에서 “내가 쓰고 싶어서” 만들어본 토이 프로젝트를 소개하는 글입니다.기획 배경여러 장소에서 운동하는 사람을 위한날짜별 일정 · 장소 · 이동 시간 · 통계를 ..
-
24년 9월부터 26년 3월까지의 회고log 2026. 4. 8. 11:43
24년 9월부터 26년 3월까지의 회고벌써 개발자가 된지 햇수로는 7년 정도, 프론트엔드 개발자로 포지션을 잡고 나서는 4년 반 정도? 일해온 것 같다.이번 회고는 뭔가 특정 프로젝트 이야기라기보다는 한 회사에 꽤 오래 있으면서 느꼈던 것들에 더 가까운 글이다.글을 적고 있는 지금까지도 다니고 있는 작은 주류 스타트업에 대한 내 이야기가 될 것 같다.(벌써 2년 7개월이나 다녔다는 사실이 믿기지가 않는다.)현재 회사에 합류하게 된 계기21년 회고글을 작성하고 합류하게 된 회사였으나 당시에는 이직을 고민하는 게 꽤 자연스러운 상태였다.이전 회사에서는 셀프스토리지와 풀필먼트 서비스를 했고, 1인 프론트엔드 개발자로 일하고 있었다.혼자 일하는 게 처음에는 나쁘지 않았는데 시간이 지날수록 아쉬운 부분들이 조금씩..
-
2021년까지의 회고log 2021. 12. 29. 13:42
잠시 재정비 기간을 가지며 개발자라는 직업을 선택하고 쉼 없이 달리던 약 3년의 회고 겸 생각정리를 해보고자 글을 시작한다. 매년 쓰려고 다짐했던 회고를 이제야 (몰아서) 쓰게 되니 조금 길거나 잡다할 것 같다는 생각도 들지만,, 회사 물류/IT회사 → 에이전시 → 암호화폐거래소 → 메타버스관련회사(잠깐) 다녔던 회사를 보면 3년이 되는 시간동안 이직이 좀 잦았다. 첫 회사였던 물류/IT회사에서는 개발자로 입사했으나 CS업무를 기반으로 작업하는 일이 대부분이었고 팀장에게서 폭언과 막말을 견디다가 L 대기업에서의 파견 생활 3달을 거쳐 본사로 돌아온 후 이직을 결심했다. 에이전시는 2000년 초반에 생긴 곳이었다. PHP 구버전과 CI(Code Igniter), 그누보드-영카트 기반으로 된 레거시 웹 사이..
-
VSC[Visual Studio Code] Extension 정리개발/Study 2021. 8. 12. 15:35
Extension 목록 정리 컨벤션용(들여쓰기, 저장시 스타일 정형화) ESLint(TSLint) Prettier 협업 간편화용(for Git) Git Graph (깃 branch를 gui 형태로 확인 가능하다.) Git Extension Pack VSC 한글화(설치시 기본이 영어로 되어있음) Korean Language Pack for Visual Studio Code react 스타일드 컴포넌트 자동완성용 react 스타일링 방법에 따라 결정할 것. scss나 sass를 위한 Extenstion도 존재한다. vscode-styled-components 다국어 지원을 위한 i18n 적용시 편의성 해당 플러그인을 통해 코드상에서 미리 번역될 글자로 볼 수 있다. i18n Ally 해야할 일 체크용 TOD..
-
Node.js & NPM개발/Study 2021. 8. 3. 15:56
node.js 개념 정리했던 medium 글을 이전해왔다. 해당 글은 Node.js 교과서라는 책 기반으로 포스팅했다. Node.js란? 아래는 공식 사이트에서 설명하는 노드이다. Node.js는 Chrome의 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임입니다. Node.js는 이벤트 기반, 논블로킹 I/O 모델을 사용해 가볍고 효율적입니다. Node.js의 패키지 생태계인 npm은 세계에서 가장 큰 오픈 소스 라이브러리 생태계이기도 합니다. 런타임: 특정 언어로 만들어진 프로그램들을 실행할 수 있는 환경 이벤트 기반: 이벤트가 발생할 때 미리 지정해준 작업을 수행하는 방식 (ex. 클릭, 네트워크 요청) 이벤트 루프 관련 설명은 JSCONF event loop 영상을 보면 좋습니다. 이전에 s..
-
[React.js] useMemo개발 2021. 7. 14. 16:15
회사에서 useCallback을 사용해 성능 최적화를 해야할 일이 생겼고, useCallback이 useMemo를 기반으로 만들어졌다는 부분을 보고 나서 useMemo와 함께 리서치하기로 했다. useMemo는 특정 결과값을 재사용할 때 사용하고, useCallback은 특정 함수를 새로 만들지 않고 재사용하고 싶을 때 사용한다고 한다. 메모이제이션(계산된 값을 자료구조에 저장하고 이후 같은 계산을 반복하지 않고 자료구조에서 꺼내 재사용하는 것)에 대해 알고 있어야 한다. 아래의 예제 코드는 https://www.youtube.com/watch?v=THL1OPn72vo 에서 사용한 예제이다. useMemo(어떻게 연산할지 정의하는 함수, deps 배열) import React, { useState, us..
-
[에러] Uncaught TypeError: Cannot read property 'forEach' of undefined에러 2021. 7. 12. 15:23
React Dev Tools에 있는 Highlight Updates 기능을 사용하려다가 해당 오류가 발생했다. 크롬 개발자도구 콘솔을 확인해보니 해당 오류와 함께 화면에 아무것도 렌더링되지 않았는데 원인 파악하고 백업용으로 작성하는 글.. Uncaught TypeError: Cannot read property 'forEach' of undefined at Object.injectIntoGlobalHook (react-refresh-runtime.development.js:465) at Object../node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:8) at __webpac..
-
Next.js 공부개발 2021. 7. 9. 16:44
Next.js란? Next.js는 React의 SSR(Server Side Rendering)을 쉽게 구현할 수 있게 도와주는 간단한 프레임워크 Next.js 제대로 알고 쓰자 Next.js의 특징 동적 경로 페이지 pages/posts/[id].js → post/1 ... Pre-rendering, static generation(SSG) 와 server-side rendering(SSR) 페이지별 지원 pre-rendering; 사전 렌더링 → 미리 HTML을 만드는 기능 더 빠른 페이지 로드를 위한 자동 코드 분할 최적화된 클라이언트 사이드 랜더링 Built-in CSS(내장 css), Sass, CSS-in-JS 지원 개발 환경에서 빠른 새로고침 지원 React 컴포넌트 편집에 대한 즉각적인 피드..