Logo ari Space

About

프론트엔드에서 인증·보안을 끝까지 파고드는 개발자

안녕하세요, 프론트엔드 개발자 ari입니다. HttpOnly 쿠키 하이브리드 인증을 실제 서비스에 설계·운영한 1년 4개월 동안, 토큰 저장 전략·SameSite Lax 한계·Refresh Token Rotation·CSRF 같은 프론트엔드가 놓치기 쉬운 보안 영역을 깊이 다뤄왔습니다. 디자인·퍼블리싱을 거친 배경 덕에 화면의 완성도와 체감 품질까지 함께 챙깁니다.

인증·보안ReactNext.jsTypeScript성능 최적화AI 활용 개발

What I do

  • 인증·보안

    HttpOnly 쿠키 하이브리드 인증을 직접 설계·운영했고, CSP·Refresh Token Rotation·CSRF·SameSite Lax 한계까지 프론트엔드에서 놓치기 쉬운 보안 영역을 깊이 다룹니다.

  • 프론트엔드 아키텍처

    Next.js·React 기반으로 화면을 설계하고, 이미지 로드 시 레이아웃 시프트 같은 체감 품질 문제를 끝까지 파고들어 개선합니다.

  • 제품 만들기

    AI 도구를 기획·구현·리팩토링 흐름에 넣어 MVP를 빠르게 만들고, 사용자 피드백 반영까지 혼자 끌고 갑니다.

경력

  1. 1

    디자인

    화면을 그리는 일에서 출발했습니다. 사용자가 무엇을 보고 어떻게 느끼는지 먼저 생각하는 습관이 여기서 생겼습니다.

  2. 2

    퍼블리싱

    디자인을 코드로 옮기며 마크업·스타일·접근성을 익혔고, 자연스럽게 동작과 데이터에 관심이 옮겨갔습니다.

  3. 3

    프론트엔드 개발

    사내 디자이너용 AI 이미지 생성 서비스를 프론트엔드 단독으로 1년 4개월 담당. 사용자 피드백 미팅·릴리즈 노트 작성 등 “일하는 방식”까지 만들며 성장했습니다.

Security 시리즈

전체 보기

프론트엔드 인증·보안을 처음부터 끝까지 따라가도록 4편의 글을 학습 순서대로 정리했습니다. 토큰 저장 결정에서 출발해 실 운영 회고까지 이어집니다.

  1. 1. 토큰을 어디에 저장할까

    "토큰을 어디에 저장할까" — localStorage, 서버 세션, HttpOnly 쿠키 하이브리드 비교

    세 가지 저장 전략을 비교하고 HttpOnly 하이브리드를 선택한 이유

  2. 2. HttpOnly만 믿으면 안 된다

    "HttpOnly만 믿으면 안 된다" — XSS 활성 상태와 SameSite Lax의 한계

    XSS 활성 상태와 SameSite Lax의 세 가지 구조적 한계

  3. 3. 인증 아키텍처의 헷갈렸던 다섯 지점

    인증 아키텍처에서 가장 헷갈렸던 다섯 지점 — 토큰 위치, 토큰 관리 분산, HttpOnly, SameSite Lax, CSRF 논증

    실제 구현에서 가장 시간이 많이 든 결정들

  4. 4. 다시 한다면 어떻게 할까

    "다시 한다면 어떻게 할까" — 인증 아키텍처 회고와 개선안

    운영하며 아쉬웠던 결정과 다음에 바꿀 다섯 가지

대표 프로젝트

  • 사내 AI 이미지 생성 서비스

    프론트엔드 단독 · 1년 4개월

    사내 디자이너가 AI로 이미지를 더 쉽게 만들도록 돕는 웹 서비스. Next.js 개발부터 K8s 배포, 사용자 피드백 미팅 도입, 릴리즈 노트 운영까지 담당했습니다.

    혼자 프론트를 담당하며 배운 것들 →
  • later-you-said · Emova

    사이드 프로젝트 · AI 활용 MVP

    AI 도구를 기획·구현·리팩토링·지표 확인 흐름에 넣어 만든 두 개의 MVP. AI를 “생산성 도구”로 실제 제품 개발에 녹여본 경험입니다.

    AI 도구를 MVP 흐름에 넣은 기록 →

대표 글

Contact

새로운 합류처를 찾고 있습니다. 함께 일하고 싶거나 궁금한 점이 있다면 편하게 연락 주세요.