모든 블로그
비브로스

비브로스

주요 카테고리 백엔드 · 프론트엔드 · DevOps

활동 요약

대표 인기 포스트예약 시스템 개편기: 우리는 왜 '예약 레고'를 만들었나130 조회
최근 30일
0개
평균 조회
24
누적 조회
1,616
전체 글
68개
마지막 발행
2026. 10. 7.
블로그 방문

비브로스 기술 블로그 글 (68)

프론트엔드

병원 상세 웹뷰 통신 및 크로스 브라우징

병원 상세 웹뷰를 사례로 웹-앱 통신 방식과 OS별 UX 차이를 정리했습니다. 또한 크로스 브라우징과 유지보수 개선 포인트까지 함께 다뤘습니다.

#웹뷰#JavaScript#iOS
3200

프론트엔드

비브로스 웹 프론트엔드 팀이 성능을 관리하기 시작했어요.

웹 프론트엔드 팀이 Lighthouse와 Web Vitals로 성능을 측정하며 개선 문화를 만들었습니다. 또한 측정 결과의 변동성을 줄이기 위한 모니터링 방식도 함께 고민했습니다.

#React#Next.js#Lighthouse
300

프론트엔드

비브로스 웹 프론트엔드 팀이 성능을 관리하기 시작했어요.

웹 프론트엔드 팀이 Lighthouse와 Web Vitals로 성능 관리를 문화로 도입한 과정을 소개했습니다. 이미지 로딩, 코드 분할, 스크립트 전략으로 개선하고 측정 변동성까지 다뤘습니다.

#성능#Lighthouse#Next.js
1800

프론트엔드

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

리팩터링의 의미와 코드 악취, 적용 시점을 정리한 글입니다. 함수 추출부터 조건문 분해까지 기본 기법을 예시와 함께 소개했습니다.

#refactoring#Java#JavaScript
200

프론트엔드

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

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

#refactoring#Java#JavaScript
2400

프론트엔드

웹 성능 최적화 - 렌더링 최적화

웹 성능 최적화를 렌더링과 로딩으로 나누고, 이번 글에서는 애니메이션 최적화에 초점을 맞추었습니다. Reflow와 Repaint 개념을 정리한 뒤 transform 활용과 Performance 탭 측정 결과를 비교했습니다.

#웹 성능#렌더링#Reflow
300

프론트엔드

웹 성능 최적화 - 렌더링 최적화

브라우저 렌더링 경로와 Reflow·Repaint가 애니메이션 성능에 미치는 영향을 설명했습니다. 사운드 미터 비교를 통해 transform 기반 구현의 Layout 비용 감소를 확인했습니다.

#성능#렌더링#CSS
3700

프론트엔드

신입 웹프론트엔드 개발자 2개월 차 후기

2개월 온보딩에서 Next.js 렌더링, 모노레포, Storybook의 동작과 활용 방식을 학습했습니다. 빌드·배포·협업 흐름을 경험하고 온보딩 문서화와 과제 구성 개선점을 제안했습니다.

#Next.js#SSG#SSR
3800

백엔드

Node.js로 Firebase Dynamic Link 다루기

Firebase Dynamic Link의 Deep Link 보완 방식과 서버 기반 생성 이유를 설명했습니다. Node.js REST API로 링크 생성·저장과 통계 조회 구현 방법을 소개합니다.

#node.js#Firebase#REST API
1300

프론트엔드

함수형 프로그래밍 (Functional Programming) 어떻게 적용할까?

함수형 프로그래밍의 순수 함수·불변성·선언적 추상화·커링 개념을 설명했습니다. RxJS와 React Custom Hook 사례로 OOP와 FP를 상황에 맞게 혼용하는 방법을 소개합니다.

#JavaScript#함수형 프로그래밍#RxJS
2500

프론트엔드

7주 차 신입 프론트엔드 개발자, 온보딩 적응기

7주 온보딩에서 Angular와 RxJS를 학습하고 코드 리뷰·스크럼으로 실무 적응 경험을 공유했습니다. 공식 문서 정독, 학습 기록 체계화, IDE 메모리 조정의 개선점을 정리했습니다.

#Angular#RxJS#NgRx
2600

프론트엔드

신입 웹프론트엔드 개발자 1개월 차 후기

웹프론트엔드 신입의 온보딩 경험을 통해 스크럼, 코드 리뷰, WebStorm, Angular 학습 과정을 공유했습니다. 컨벤션 문서 정비와 리뷰어 자동 태그로 협업 흐름을 개선할 지점을 제안했습니다.

#Angular#RxJS#WebStorm
2200

프론트엔드

웹 접근성이란?

웹 접근성과 웹 표준의 공통점과 상호 보완 관계를 설명했습니다. 대체 텍스트, WAI-ARIA, 시맨틱 태그 적용 방법을 소개했습니다.

#웹 접근성#웹 표준#WAI-ARIA
3200

프론트엔드

지금은 맞고 그때는 틀리다 (기술 블로그 개편 여정)

Jekyll 기반 기술 블로그의 기능·확장 한계를 분석하고 Docusaurus로 재구축했습니다. 태그, 목차, 다크 모드와 URL 리다이렉트 기반 마이그레이션을 적용했습니다.

#Docusaurus#Jekyll#Gatsby
2600

프론트엔드

[WPF] XAML Styler

XAML Styler로 WPF 팀의 XAML 서식 규칙을 통일하는 방법을 소개했습니다. 설정 파일과 일괄 포맷 기능으로 기존 코드의 가독성을 개선합니다.

#WPF#XAML#Visual Studio
3500

데브옵스

공공 API 크롤러 개발기

공공 API 만료일을 자동 확인하기 위해 Puppeteer 기반 Lambda 크롤러와 알림을 구현했습니다. 배포 용량, 메모리, Chromium 샌드박스 문제의 대응 과정도 공유했습니다.

#puppeteer#AWS#lambda
2800

백엔드

ifify: 코드의 본질에 집중하는 기술

ifify는 TypeScript의 반복적인 null 검사와 조건 분기를 Promise 체인 유틸리티로 추상화했습니다. 유효성이 보장된 값과 비즈니스 로직에 집중하는 코드 스타일을 제안합니다.

#TypeScript#node.js#Rust
1800

프론트엔드

웹프론트엔드 개발자의 Rust 돌려까기

Rust의 소유권과 Move를 TypeScript의 GC 기반 메모리 관리와 비교해 학습 난도를 분석했습니다. WebAssembly 활용보다 안정성과 성능을 위한 개발 관점 학습의 가치를 제시합니다.

#Rust#TypeScript#WebAssembly
2400