전체보기262

• 

  [WIP] [추석 특집 기술 이야기] 2025년 8월, 9월 회고: x-forwarded-proto, x-forwarded-host, 즉시 실행 함수, 전역함수와 지역함수, MutationObserver, graceful degradation, SSAFY 방문, 9km 러닝, 기획일을 해보며 든 생각들 1. 기술 이야기지난 두 달은 크게 SEO, 새 프로젝트 유지보수, A/B test에 걸쳐 일을 했다. 이 과정에서 프론트엔드 측면에서 배운 점들이 많아 정리해보려고 한다. x-forwarded-proto x-forwarded-host 즉시실행함수 전역함수와 지역함수 MutationObserver graceful degradation 2. SSAFY 유튜브 촬영컨님의 부탁으로 SSAFY 유튜브에 출연했다. 오랜만에 낮에 사람들을 만나고(ㅋㅋ) 좋은 피드백을 많이 들어서 감사한 하루 - 그 김에 체험단도 몇 탕 해결..ㅋㅋㅋ 3. 러닝 기록 9km 달성2주 앞으로 다가온 경포마라톤을 앞두고 본격적인 러닝 6개월만에 러닝 최대 기록 9km를 달성했다. 출전 종목인 10km까지는 1km만 남았다. 3km도 .. My/Riverlog 2025. 10. 7.

• 

  2025년 6월, 7월 회고: Culmulative Layout Shift 없애기, 계속되는 A/B test, Letter와 A4, OTP 시스템 개발, 반기 피드백, 블로그 궤도에 올리기, 경주 & 제주 & 대구 티스토리 오류로 글이 전부 날아가.. 간단하게 다시.. ㅠㅠ 회사 매출과 밀접하게 연결된 프로젝트 완수하기조금이라도 경쟁적인 비즈니스에 속해 있는 회사에서 일할 경우 SEO가 회사 매출에 아주 밀접한 영향을 미친다. Cumulative Layout Shift도 마찬가지다. 이 스코어가 높아질 경우 얼마 지나지 않아 구글 검색에서 회사 순위가 크게 하락하고, 매출에 큰 영향을 미치게 된다. 얼마 전 본 기사(전통적인 마케팅 회사들의 매출 하락, 빅테크로의 자본 집중에 관한)가 생각나기도 한다. SEO 부서(Marketing)에서 이 문제를 빠르게 해결하기를 원했고, Storyblok이라는 headless CMS에 삽입되는 외부 컴포넌트가 문제를 야기하고 있어 문제가 까다롭고 압박감도 있었다. 그래서 GPT.. My/Riverlog 2025. 7. 31.

• 

  JavaScript 디자인 패턴 책 (한빛미디어)를 읽고 19개의 패턴의 간단한 정의와 예시들을 정리해본다.생성 패턴객체를 생성하는 방법을 다루는 패턴 생성자 패턴*ES6의 class 문법을 사용 객체 지향 프로그래밍을 위한 문법적 설탕(syntactic sugar)으로, constructor 메서드를 통해 객체 초기화를 수행하고 new 키워드를 사용하여 인스턴스를 생성하는 구조이다. class 내부에서 속성과 메서드를 정의하며, 상속 및 캡슐화 같은 OOP 개념도 자연스럽게 표현할 수 있다.class Person { constructor(name, age) { this.name = name; this.age = age; } sayHello() { console.log(`Hello.. Programming/Javascript, Typescript 2025. 7. 6.

• 

  리액트, 뷰를 안 쓰는 개발자들은 뭐 쓸까? 프론트엔드 프레임워크 알아보기 안녕하세요 SSAFY 수료생 기자단 김혜린입니다! 요즘 SSAFY 교육생분들은 어떤 프론트엔드 프레임워크로프론트엔드 공부를 시작하시는 지 궁금한데요. 7기 교육생이었던 저는 JavaScript 프론트엔드 프레임워크인 Vue(뷰)로첫 프론트엔드 개발을 시작하고 당시 생태계가 크게 확장되고 있었던 React(리액트)를여름 방학 기간동안 동기들과 공부해2학기 프로젝트 프론트엔드 개발에 활용했던 기억이 납니다. 그렇게 프론트엔드에 재미를 붙이고,프론트엔드 개발자로 취업을 준비할 때도국내외 모두 이 두 프레임워크 외에다른 프레임워크를 사용하는 기업은 거의 찾아보기 힘들었는데요 https://tsh.io/state-of-frontend 소프트웨어 개발사 'The Software House'에서2024년 6028.. Programming/Javascript, Typescript 2025. 6. 27.

• 

  2025년 5월 회고: 첫 승진, Optimizely Web으로 간편한 A/B 테스팅, StoryBlok, 즐거운 사이드 프로젝트들 첫 승진5월의 가장 큰 뉴스는 바로 승진~~ 입사 2년만에 Software 1에서 Software 2로 승진했다. Software 2는 최소 경력 요건이 만 2년인데, 개발자가 된 지 2년 반 만에 달성한 셈이다! 매니저가 지금 임시팀에서도 너무 좋은 평가를 받고 있어서 리더십에 상정하기가 더 편했다고 해서 정말 뿌듯했고, 그동안 정말 즐거웠지만 스스로 바보같이 느껴지던 때도 있었는데 그런 시간들을 이겨내기 위한 노력이 헛되지 않은 것 같아 기뻤다. Ladder의 다음 단계는 시니어인데, 그 때까지 우리 회사에 남아 있게 된다면 시니어로서의 도약을 위해 어떻게 시간을 보내야 할 지 생각도 해봤다. 확실히 올해는 백엔드로 영역을 넓히는 게 첫 번째 과제가 될 것 같다(이미 AWS, Express.js 관련.. My/Riverlog 2025. 6. 7.

• 

  도커, 컨테이너, 쿠버네티스의 개념 FE 개발자여서 그동안 도커를 쓸 일이 거의 없었는데, 올해부터 백엔드(Express) 쪽 코드에 관련된 일들을 하게 되면서 도커를 쓰고 있다. 도커와 함께 자주 볼 수 있는 컨테이너, 쿠버네티스의 개념까지 잘 정리한 영상들이 있어서 따로 정리해본다. https://www.youtube.com/watch?v=eRfHp16qJq8https://www.youtube.com/watch?v=e0koWWAmXSk 컨테이너서버의 한 종류VM(가상 머신)은 프로그램 실행에 오래 걸림컨테이너도 가상화 기술은 맞지만(한 대의 서버에서 여러 프로그램 실행) 더 가볍고 빠르다. 컨테이너 안에 모든 요소를 다 넣어 놓고 필요할 때마다 컨테이너 단위로 서버 안에 넣었다 빼면 되기 때문이다. 도커우리는 컨테이너 전문가가 아니기 .. Programming/ETC 2025. 5. 26.

• 

  2025년 4월 회고: SEOULANA 해커톤에서 두 번째 수상, json + handlebars.js 조합에 얻어맞고 교훈얻기 생일이 있어 더욱 즐거운 4월! 개발에 있어서는 큰 산을 만났다. express + handlebars.js 조합으로 된 백엔드 코드베이스에서 Optimizely로 A/B 테스트를 운영하고 Segment와 연동해 이벤트도 보내야 했는데, 너무 낯설어서 코드 분석에만 며칠을 쏟은 것 같다. 백엔드에서 프론트엔드로 데이터는 물론 UI 형태와 CSS까지 모두 JSON 데이터로 보내고, 프론트엔드에서는 UI의 큰 틀과 렌더링만 맡는 구조는 처음이었다. 로그 찍기, 디버깅, 모든 것들을 처음부터 배워야 해서 시간이 오래 걸렸다. 특히 오래 걸렸던 부분은 에러 원인을 몰라서 헤멨던 시간들이었다. 에러 메시지가 항상 명시적이지 않다 보니 근본 원인을 찾는 데 오래 걸렸고 때로는 import 문제, 때로는 더 복잡한 .. My/Riverlog 2025. 5. 7.