필터 1
카카오엔터테인먼트FE
프론트엔드

라이브러리 없이 라우터(Router) 만들기

바닐라 JS로 해시 라우터를 직접 구현하는 과정을 설명했습니다. 경로 매핑, navigate, path parameter 추출까지 확장하는 방법을 다뤘습니다.

#JavaScript#SPA
25005분
비브로스
프론트엔드

리팩터링 가이드 - 좋은 코딩 습관을 기르자

리팩터링을 기능은 그대로 두고 코드 구조를 개선하는 방법으로 정리했습니다. 함수 추출, 조건문 분해, 특이 케이스 추가 같은 기본 기법과 적용 흐름을 소개했습니다.

#refactoring#Java
22005분
카카오엔터테인먼트FE
프론트엔드

자바스크립트로 만든 유한 상태 기계 XState

XState로 유한 상태 기계의 개념과 사용법을 장바구니 예제로 설명했습니다. React에서 상태, 컨텍스트, 액션, 가드를 어떻게 연결하는지 정리했습니다.

#XState#FSM
35005분
카카오엔터테인먼트FE
프론트엔드

카카오 공채 입사 후 10개월 FE개발팀에서의 여정

카카오엔터테인먼트 FE개발팀 신입이 10개월간의 온보딩과 실전 프로젝트 경험을 소개했습니다. 재택근무 속 게더타운, 스몰토크, 데모데이, 협업 문화로 성장한 과정을 공유했습니다.

#JavaScript#HTML
24005분
티맵모빌리티
프론트엔드

자바스크립트 지도 엔진에 웹 워커를 적용해봤습니다 - 14편 - 웹 워커, 어디까지 써봤니?

TMAP JS를 브라우저 기반 지도 엔진으로 소개하고, WebGL 풀 벡터 방식과 사용자 데이터 추가 지원을 설명했습니다. 또한 성능 개선을 위해 웹 워커를 적용한 개발 맥락을 다뤘습니다.

#JavaScript#Web Worker
25005분
구글 시트(GoogleSheet) Apps Script 소개
트렌비
기타

구글 시트(GoogleSheet) Apps Script 소개

구글 시트 Apps Script로 커스텀 메뉴, 사이드바, API 연동을 만드는 방법을 소개했습니다.\n운영 데이터 자동화와 권한, 계정 이슈 같은 주의사항도 함께 정리했습니다.

#GoogleSheet#Apps Script
41005분
ZUM
프론트엔드

댓글 모듈 레거시 걷어내기 with TDD

JavaScript와 jQuery 기반의 댓글 모듈을 Vue와 TypeScript로 재구성했습니다. TDD와 컴포넌트 분리를 통해 SPA에 맞는 사내 라이브러리로 배포했습니다.

#JavaScript#Vue
3005분
ZUM
기타

주니어 프론트엔드 개발자의 채용 프로세스 참여 후기

채용 과정에서 프론트엔드 신입을 평가하기 위해 과제, 채점표, 코드리뷰를 도입한 사례를 정리했습니다. 지원자에게 객관적 피드백을 주며 원리 이해와 구현 역량을 확인한 과정입니다.

#채용#채용 과제
2005분
ZUM
프론트엔드

크롬 확장프로그램 개발⛏️ 회고

크롬 확장프로그램을 Vue와 Chrome API로 개발하고 배포한 과정을 회고했습니다. 검수 과정에서 권한, HTTPS, CSP, 리소스 처리 같은 실무 이슈를 정리했습니다.

#Chrome Extension#Vue.js
2005분
ZUM
프론트엔드

Webpack Dev Server를 이용한 개발 환경 구성 Part1

Webpack Dev Server로 프론트엔드 단독 개발 모드를 구성하는 방법을 설명했습니다. Axios와 stub 파일, before 훅을 활용해 백엔드 없이도 API 응답을 모사했습니다.

#Webpack#Webpack Dev Server
3005분