Taehwan Go

기술뉴스, 2026-04-24

Anthropic: 클로드 4.7 출시 및 디자인 에이전트 도입 * 클로드 오퍼스 4.7과 코딩 성능 향상: 최근 공개된 클로드 오퍼스 4.7은 에이전틱 코딩 역량이 대폭 강화되어 현재 종합 1위 모델로 평가받고 있습니다. 특히 지시 사항 이행 능력이 개선되었고, 고해상도 이미지 처리 능력이 이전 모델 대비 3배 이상 향상되어 복잡한

기술뉴스, 2026-02-24

조코딩 AI 뉴스: Gemini 3.1 Pro, Claude 4.6, Grok 4.2 및 최신 AI 트렌드 정리 1. 구글(Google)의 역습: Gemini 3.1 Pro 및 신규 도구 * Gemini 3.1 Pro 출시: * ARC-AGI-2 벤치마크 점수가 기존 31.1점에서 77.1점으로 약 9배 상승하며 종합 1위를 차지했습니다. * 2016년

[React Native] WebView 안드로이드 로그인 유지

증상 * 안드로이드 앱에서 로그인 유지가 의도한 것 보다 짧게 유지 되거나 로그인 정보가 날라가는 오류가 있었습니다 원인 * 로그인 인증을 위한 쿠키가 메모리에서 디스크로 이동하는데 일정 간격이 있어서 실시간으로 동기화 되지 않았기 때문입니다 조치 * 안드로이드에서 쿠키를 디스크(영구 저장소)로 저장하는 메소드를 앱이 백그라운드로 이동할 때 호출하여 해결하였습니다 * React native의 쿠키관리

Next.js v14.2.8 빌드 에러

Error occurred prerendering page "/dashboard". Read more: https://nextjs.org/docs/messages/prerender-error ReferenceError: window is not defined 얼마전 github actions에서 배포 중 에러가 발생했습니다 로컬에서 githook의 pre-push에서 빌드를 하기 때문에 빌드에러는 발생하지 않을 것이라 생각했지만 빌드 중 window is not defined 에러가 발생했습니다 의심되는 부분을 수정해봤지만 해결되지 않았고 로그를

안드로이드 expo-notifications 잠금화면 알림 표시

최근 expo가 많이 개선되었다고 해서 expo로 모바일앱 개발을 하고 있습니다 이전에 react native cli로 개발했을 때 개발환경 설정이 피로하고 그 설정을 공유하는 것이 번거로워서 expo를 선택하였습니다 이슈 공식문서(https://docs.expo.dev/versions/latest/sdk/notifications/)의 예제 코드르 따라하면 쉽게 푸시메세지가 수신되는 것을 확인할 수 있습니다 하지만 안드로이드폰에서 잠금화면이거나

Next.js 에서 bootstrap과 tailwind css 같이 사용하기(bootstrap에서 important 제거하기)

이슈 bootstrap과 tailwind 모두 기능 단위로 각 css를 유틸클래스(HTML class 속성)로 정의해놓고 조합해서 사용한다는 공통점이 있습니다

Hello world!

하지만 bootstrap과 tailwind는 클래스명이 같지만 그 안에 정의된 수치가 다른 경우가 있습니다 특히 shadcn-ui를 사용하는 경우 tailwind에서 정의된 클래스를 기반으로 구성이 되어있는데 이것이 bootstrap에 정의된 클래스라면 bootstrap의 유틸클래스는 !important가 붙어서

Next-auth refresh token

이슈 * Refresh token으로 Access token을 재발급 받은 후 새로고침하면 로그인이 풀리는 현상 원인 1. 리프레시 토큰으로 토큰 재발급 후 만료시간을 설정 오류 2. 토큰을 설정하는 jwt 콜백이 비정상적으로 한번 더 실행 1. 리프레시 토큰으로 토큰을 재발급 받은 후 jwt 콜백이 호출되고 session 콜백이 호출돼서 값이 넘어가야하는데 마지막에 만료된 토큰데이터로 jwt

Next.js 모바일과 PC를 구분해서 다른 경로로 이동 시키기(middleware 사용)

이슈 * 모바일로 접속할 때와 PC로 접속할 때 다른 화면을 보여줘야한다 * 모바일로 접속 시 기존 앱 경로를 보여주고 * PC로 접속 시 v2 앱 경로를 보여준다 해결 * Next.js의 middleware를 사용하여 모바일로 접속했는지 PC로 접속했는지 확인 후 의도한 화면의 경로로 redirect 시켰습니다 function isMobileUserAgent(userAgent: string): boolean { const mobileRegex = /Android|iPhone|iPad|

Axios interceptors 를 활용한 Refresh token 만료 시 처리 구현

이슈 JWT refresh token 만료 시 로그인 페이지로 이동하지 않는 현상 문제점 refresh 토큰이 만료된 경우를 구분이 어렵다 access 토큰은 만료되었으나 refresh 토큰은 만료되지 않은 경우에 첫 요청은 실패하지만 react-query에서 3번 더 요청을 하기 때문에 두 번째 요청을 보내기 전에 next auth에서 refresh 토큰을 발급받아서 두 번째 요청은 성공했다 해결

Typescript 함수의 입력 타입과 출력타입 추출하기

라이브러리를 사용하다보면 제공하는 메서드의 대부분의 타입을 import 해서 사용할 수 있지만 그렇지 않은 경우도 있습니다 함수의 입력타입 추출하기 함수로 부터 입력 파라미터 타입을 추출할 수 있는 유틸타입(Parameters)을 사용하면 쉽게 타입을 정의해서 사용할 수 있습니다 * Parameters<함수타입> 과 같이 사용하면 함수의 파라미터타입을 배열로 받을 수 있습니다 function add(a:

대량 엑셀 다운로드

대량 엑셀 다운로드를 구현하기 위해 시도한 시행착오를 정리해보았습니다 😊 기존 엑셀 다운로드 구성 * Machine365의 '기록' 페이지를 렌더링 하기 위한 API 사용하여 데이터를 가져오고 가져온 데이터를 브라우저에서 엑셀파일로 구성해서 다운로드가 되는 방식이었습니다 기존 다운로드의 문제점 * 기존 모니터링 데이터를 가져오는 API는 페이지를 렌더링하기 위해 페이지네이션이 적용되어 있었습니다 * 따라서 엑셀로 구성하는 데이터 수에 비례해서

[Javascript] 기준 날짜를 내가 설정한 시간의 기준 날짜로 구하기

이슈 * 사용자 기준 시간이 내가 설정한 시간이 아닌 브라우저 시간을 기준으로 나오는 현상이 있었습니다 예시 * 한국(UTC+9) 2024년 3월 5일 아침 8시에 내가 설정한 시간대가 UTC-1이고 기준 날짜를 구하는 경우(UTC+9와 UTC-1은 10시간 차이가 납니다) * 한국 시간: 2024-03-05 08:00 -> 기준 날짜: 3월 5일 * 설정 시간: 2024-03-04

아키텍처 결정 레코드(ADR)

아키텍처 결정을 가장 효과적으로 문서화하는 방법은 아키텍처 결정 레코드(Architecture Decision Reccord, ADR)을 작성하는 것 입니다 기본 구조 ADR의 기본 구조는 제목(Title), 상태(Status), 콘텍스트(Context), 결정(Decision), 결과(Consequences) 이렇게 5개 섹션으로 구성됩니다 여기에 컴플라이언스(Compliance)와 노트(Notes)라는 추가 섹션을 덧붙일 수 있습니다 제목 * 아키텍처

axios 를 이용해서 우아하게 파라미터 넘기기

GET 메서드는 파라미터를 query string으로 넘깁니다 * 위 그림의 parameters는 query string 이라고도 부릅니다 데이터 조회 시 파라미터 넘기기 type FactoryParams = { size: number; page: number; companyId?: string; factoryName?: string; enabled?: boolean; sort?: string | string[]; } export async function getFactories({ companyId, factoryName, enabled, page, size, sort, }: FactoryParams) { const queryParams = []; if (companyId !== '') { queryParams.

TypeScript

[TypeScript] as 대신 satisfies

satisfies 는 as와 같이 타입 캐스팅하는 용도로 사용할 수 있습니다 * satisfies는 타입스크립트 4.9버전에 업데이트되었습니다 as는 강제로 해당 타입으로 만들어주지만 satifies는 실제로 타입이 맞는지 확인을 합니다 * as로 타입을 캐스팅하면 위와 같이 타입 중 일부가 없어도 타입에러가 발생하지 않지만 satisfies는 모두 있는지 확인해서 안전하게 사용할 수 있습니다