전체 글 47

TIMESTAMP vs DATETIME, 그리고 2038년 문제까지 한 번에 정리하기

서비스에 만료일(expire_at) 같은 컬럼을 설계하다 보면, 언젠가 이런 에러를 한 번쯤 보게 된다.SQL Error [1292] [22001]: Data truncation: Incorrect datetime value: '9999-12-31 11:59:59' for column 'expire_at' at row 1 값 자체는 멀쩡해 보이는데, MySQL이 Incorrect datetime value 라면서 거부하는 상황이다. 왜 이런 에러가 나는지TIMESTAMP와 DATETIME의 차이가 뭔지왜 TIMESTAMP는 2038년까지만 되는지스프링 / JPA에서 LocalDateTime, Timestamp랑 어떻게 매핑되는지DEFAULT CURRENT_TIMESTAMP 를 DATETIME에 써도 되는..

WIL/스터디 2025.11.14

Spring Security 중심으로 보는 OAuth2 소셜 로그인

1) Spring Security는 이렇게 생겼다 요청은 서블릿 앞단의 FilterChainProxy를 거치고, URL 매칭 규칙에 따라 하나의 SecurityFilterChain이 선택되어 내부 보안 필터들이 등록 순서대로 실행된다. 각 필터는 대부분 OncePerRequestFilter를 확장해 한 요청당 한 번 동작한다. 필터 순서가 곧 보안 정책의 우선순위다.핵심 필터들의 역할CorsFilter: 사전 요청 및 CORS 헤더 처리CsrfFilter: 상태 저장 환경에서 CSRF 토큰 검증UsernamePasswordAuthenticationFilter: 폼 로그인 자격 증명 추출 및 인증 시도OAuth2LoginAuthenticationFilter: OAuth2 인가 코드 콜백 처리 및 토큰 교환..

WIL/웹 개발 2025.10.31

UserDetailsService.loadUserByUsername에 파라미터를 추가하고 싶을 때: 불가능한 이유와 대안

TL; DRloadUserByUsername(String) 시그니처는 변경 불가: 스프링 시큐리티 표준 인터페이스라 메서드 시그니처를 바꿀 수 없다.대안 1 — username 인코딩: email|type 형태로 합쳐서 loadUserByUsername 내부에서 파싱 후 위임.대안 2 — 커스텀 AuthenticationProvider: 타입을 포함한 토큰/프로바이더를 만들어 검증.대안 3 — authenticate 없이(수동 검증+JWT/소셜): 표준 Provider를 거치지 않고 직접 검증 또는 외부 검증 후 JWT 발급.왜 시그니처를 바꿀 수 없나?UserDetailsService는 스프링 시큐리티가 사용하는 계약(Contract) 이고, DaoAuthenticationProvider 등 표준 컴포..

WIL/웹 개발 2025.10.10

Next.js + TypeScript + App Router 환경에서 tsconfig 타입 꼬임

이번 이슈는 tsconfig.json의 설정으로 인해 Next.js 프로젝트에서 타입 추론이 꼬이면서 발생한 에러에 대한 정리다.✅ 한 줄 요약tsconfig.json의 "include"에 .next/types를 포함하면, Next.js가 자동 생성한 잘못된 타입 정의까지 타입 검사 대상에 포함되어 에러가 발생한다.1. .next/types에 자동 생성되는 타입app/ 디렉토리 기반 라우팅을 사용하는 Next.js에서는 내부적으로 props, metadata, routes 등을 분석하여.next/types/app/XXX/page.ts 같은 타입 파일을 자동 생성한다. 예를 들어 다음과 같은 타입이 생성될 수 있다:// .next/types/app/search/page.tsexport type PagePr..

WIL/웹 개발 2025.03.27

Windows에서 Docker로 Ubuntu 서버 만들기 2: Ubuntu 개발 환경 초기 설정

개발을 위한 우분투 개발환경을 처음부터 구축하려면, 무엇보다 먼저 패키지 설치 속도 개선을 위한 APT 미러 설정을 선행하고, 그 다음 필요한 패키지들을 차례로 설치해야 한다. 이 문서는 Node.js 기반 프론트엔드 개발을 위한 우분투 초기 세팅을 순서대로 정리하였다.0. APT 서버를 Kakao 미러로 변경하기패키지를 설치하기 전에, 먼저 APT 서버 주소를 Kakao 미러(mirror.kakao.com)로 변경하여 속도 문제나 에러를 예방하자.먼저 vim과 sudo를 깔아주자.apt install vim sudo/etc/apt/sources.list.d/ubuntu.sources 파일 열기sudo vi /etc/apt/sources.list.d/ubuntu.sources 아래에서 URI의 archi..

WIL/웹 개발 2025.03.24

Windows에서 Docker로 Ubuntu 서버 만들기 1

윈도우 환경에서 리눅스 서버를 사용하고 싶은 경우, Docker를 활용하면 간단하게 우분투 서버를 실행할 수 있다. 이 글에서는 Docker 설치부터 우분투 컨테이너를 실행하고 사용하는 방법까지 간단하게 설명한다.1. Docker란?Docker는 컨테이너 기반의 가상화 플랫폼으로, 리눅스 기반의 환경을 격리된 공간에서 손쉽게 실행할 수 있게 해주는 도구다. Docker를 사용하면 가상 머신보다 더 가볍고 빠르게 리눅스 환경을 만들 수 있다.2. 사전 준비Windows 10 Pro, Enterprise, 또는 Education (Hyper-V 기능 필요)WSL 2(Windows Subsystem for Linux) 활성화3. Docker Desktop 설치 및 설정Docker 공식 홈페이지에서 Docker..

WIL/웹 개발 2025.03.11

프로토타입과 클래스

1. 프로토타입(Prototype)JavaScript의 모든 객체는 프로토타입 기반 상속 방식을 통해 다른 객체의 속성과 메서드를 재사용할 수 있다. 이 상속 구조는 숨겨진 링크인 [[Prototype]]을 통해 이루어진다.1.1 프로토타입의 원리객체가 다른 객체로부터 속성과 메서드를 상속받으려면, 숨겨진 링크 [[Prototype]]이 설정된다.이 링크는 __proto__로 접근 가능하며, 이는 프로토타입 체인을 형성한다.프로토타입 체인객체에서 특정 속성이나 메서드를 찾을 때, 해당 객체에 없다면 프로토타입 체인을 따라 상위 객체에서 이를 찾는다.프로토타입 체인의 끝은 Object.prototype이며, 여기에 기본 메서드들이 정의되어 있다.const animal = { speak() { con..

WIL/웹 개발 2024.12.11

WAI-ARIA: Role과 Aria-Label이란?

웹 접근성을 향상시키기 위해 사용되는 중요한 도구 중 하나는 바로 WAI-ARIA다. WAI-ARIA는 Web Accessibility Initiative's Accessible Rich Internet Applications의 약자로, 스크린 리더가 웹 페이지를 읽을 때 요소의 역할과 의미를 파악할 수 있도록 돕는다. 특히 JavaScript 같은 동적 언어를 사용해 페이지 요소가 변경되더라도 스크린 리더는 새로고침 없이 변경된 내용을 읽을 수 있다.스크린 리더란?스크린 리더는 시각적으로 웹 페이지를 읽는 것이 어려운 사용자들을 위해 컴퓨터 화면의 내용을 읽어주는 소프트웨어다. 우리가 웹 페이지를 만들 때 시맨틱 태그를 사용하지 않거나 시각적으로만 요소를 꾸민다면, 스크린 리더 사용자들은 웹 페이지를 ..

WIL/웹 개발 2024.11.19

Spring 애플리케이션 배포 시 GitHub Actions 환경 변수 설정법

GitHub Actions에서 Elastic Beanstalk에 배포할 때 환경 변수를 설정하는 방법에는 $GITHUB_ENV 방식과 직접 Elastic Beanstalk 환경에 설정하는 방식이 있다. 이 두 방식이 어떻게 다른지, 그리고 어떤 상황에 어떤 방법이 좋은지 알아보자.1. $GITHUB_ENV 파일에 저장하는 방식먼저 $GITHUB_ENV 파일에 환경 변수를 저장하는 방식이다. GitHub Actions에서 echo로 환경 변수를 $GITHUB_ENV에 추가해두면, 이후 단계에서 바로 사용할 수 있다. 예를 들면:- name: Set environment variables run: | echo "DB_URL=${{ secrets.DB_URL }}" >> $GITHUB_ENV ec..

WIL/웹 개발 2024.11.04

Spring Boot 3 애플리케이션을 AWS Elastic Beanstalk에 배포했을 때의 Bad Gateway 문제 해결 과정

Spring Boot 3으로 작성한 애플리케이션을 AWS Elastic Beanstalk에 배포한 후, Nginx에서 502 Bad Gateway 오류가 발생하며 제대로 포트 포워딩이 되지 않는 상황을 겪었다. 기본적으로 Spring Boot는 8080 포트를 사용하고, Elastic Beanstalk의 Nginx는 5000 포트로 프록시하도록 설정되어 있어 이로 인해 충돌이 발생한 것으로 생각했다. 그러나 서버 포트를 수정했는데도 불구하고 계속 문제가 발생했다. 문제를 정확히 파악하기 위해 EC2 인스턴스에 직접 접근하여 상태를 확인해보기로 했다. 1. 문제 분석애플리케이션 설정 파일(application.yml)에서 서버 포트를 5000으로 설정했음에도 불구하고 여전히 502 Bad Gateway 오..

WIL/웹 개발 2024.10.31