GyaanSetu WebDev

Frontend, backend and devops for the modern web.

230 articlesDeep, practical knowledge

Open Interpreter, LLM의 로컬 코드 실행 지원으로 클라우드 비용 절감 및 프라이버시 강화

Open Interpreter는 대규모 언어 모델이 사용자의 기기에서 직접 셸 명령을 내리고 스크립트를 실행할 수 있게 함으로써, 민감한 파일을 로컬에 유지하면서도 비용이 많이 드는 클라우드 API 없이 작업을 수행할 수 있게 합니다. 다만, 개발자에게는 샌드박스와 동의 절차를 구축해야 하는 과제가 따릅니다.

WebDev · 2 min read

PostgreSQL 마이그레이션이 레플리카로 전송될 때 "Read-Only Transaction" 오류가 발생하는 경우

이 오류는 대개 쓰기 작업이 읽기 전용 레플리카에 도달할 때 발생합니다. 이는 주로 PgBouncer가 연결을 라우팅하거나, 특정 역할(role)이 읽기 전용으로 기본 설정되어 있거나, 클라우드 설정에서 리더 엔드포인트를 사용하기 때문입니다. 이 글에서는 현재 트랜잭션에 대해 해당 플래그를 재정의하는 방법과 이를 방지하는 방법을 설명합니다.

WebDev · 3 min read

타입 안정성이 보장된 API 모크의 트리 쉐이킹으로 번들 크기를 0으로 줄인 프론트엔드 팀

팀은 Axios 인터셉터와 Vite의 트리 쉐이킹을 활용해 개발 전용 모크 레이어를 구축했습니다. import.meta.env.DEV, 커스텀 VITE_ENABLE_MSW 플래그, 그리고 MODE 변수로 인터셉터를 제어함으로써, 전체 모크 코드가 프로덕션 번들에서 완전히 제거되어 번들 크기를 그대로 유지할 수 있습니다.

WebDev · 3 min read

API 키가 필요 없는, 모든 웹 페이지에서 작동하는 비용 제로 AI 쇼핑 봇

저자는 단일 16GB GPU를 사용하여 3천만 토큰의 합성 데이터셋으로 LiquidAI의 3억 5천만 파라미터 LFM2.5 모델을 미세 조정했습니다. 이후 8개의 하드코딩된 도구와 문법 제약 디코딩을 추가하여, 에이전트가 완전히 온디바이스 환경에서 상품 검색, 장바구니 담기 및 결제까지 수행할 수 있도록 구현했습니다.

WebDev · 4 min read

가나 개발자, 코딩 경험 없이 AI 로우코드로 'PowerPulse' 출시

PowerPulse를 통해 가나의 누구나 정전 상황을 보고하고, 실시간 피드를 확인하며, 기여에 따른 포인트를 적립할 수 있습니다. Next.js, Tailwind, Supabase로 구축되어 Vercel에서 호스팅되는 이 앱은 콜드 스타트 문제를 극복하기 위해 AI 기반 예측 및 푸시 알림 기능을 추가할 계획입니다.

WebDev · 3 min read

pnpm v12, Rust 재작성을 통해 웜 인스톨 시간을 381ms에서 12ms로 단축

“pacquet”이라 명명된 이번 재작성은 Node.js 부트스트랩을 싱글 스레드 Rust 바이너리로 교체하면서도, 모든 플래그와 락파일 형식은 그대로 유지합니다. 개발자는 지금 바로 `pnpm self-update next-12` 명령어를 통해 이를 적용해 보고, CI 파이프라인에 미치는 성능 변화를 벤치마크할 수 있습니다.

WebDev · 2 min read

Auto-Animate, Marko 6 어댑터 출시: 태그 하나로 리스트 애니메이션 구현

새로운 어댑터는 Marko의 onMount 라이프사이클에 연결되어 MutationObserver를 생성하고 auto-animate 엔진을 구동합니다. 이를 통해 개발자는 추가적인 자바스크립트 작성 없이 리스트에 <auto-animate> 태그를 선언하는 것만으로 부드러운 진입, 퇴장 및 순서 변경 효과를 구현할 수 있습니다.

WebDev · 3 min read

ES2023에 비변이(Non-Mutating) 배열 메서드 추가, React의 즉각적인 상태 변화 감지 지원

`toSorted`, `toReversed`, `toSpliced`, `with` 등 네 가지 신규 메서드는 새로운 배열을 반환합니다. 덕분에 React의 얕은 비교(shallow-compare)가 새로운 참조를 인식할 수 있어, 기존에 업데이트를 가리던 번거로운 스프레드 연산자(spread-operator) 활용 없이도 즉시 리렌더링이 가능합니다.

WebDev · 4 min read

Claude Fable 5, 코드 생성에서 GPT-5.6 능가하며 SWE-Bench Pro 80% 달성

GPT-5.6이 토큰 가격 면에서 Claude Fable 5보다 저렴하고 다단계 에이전트 작업에서 강점을 보이지만, Anthropic의 모델은 실제 코딩 벤치마크에서 확실한 우위를 보여줍니다. 개발자들은 최종 도입 전 캐싱 할인과 워크로드 패턴을 고려하여 두 모델을 모두 시범 운영해 보는 것이 좋습니다.

WebDev · 3 min read

TypeScript 7로 업그레이드하시겠습니까? 최대 10배 빠른 체크를 기대할 수 있지만, CI 실패에 주의하세요

새로운 Go 기반의 tsgo 엔진은 최대 10배 빠른 빌드를 제공하지만, 아직 변경 중인 프로그래밍 API로 인해 기존의 인기 도구들이 제대로 작동하지 않을 수 있습니다. 7.1 API 동결 전까지는 빌드용으로 TS 6.x 버전을 유지하고, 빠른 체크를 위해서는 @typescript/native-preview를 사용하는 것이 좋습니다.

WebDev · 3 min read