개발자 사이드 프로젝트의 가장 큰 약점이자, 숙원 사업은 디자인이다. 최근에 출시된 (나온지 2주가 넘었지만) Claude Design 을 가볍게 사용하여 간단한 사이트 리디자인을 진행하려고 한다. 먼저, 클로드 디자인 사이트에 접속해준다. Project Name 에 이름을 넣고, 원하는 항목을 선택하여 Create 를 누른다. https://claude.ai/design 클로드 디자인은 따로 웹 사이트에서 진행하는 거다보니, 기존 프로젝트에 대한 컨텍스트 및 디자인 정보를 가지고 있지 않다. 먼저 기존 사이트의 기본 컨텍스트 정보를 가져와 보겠다. 이것도 내가 직접 정리하긴 어려우니, Claude Code 에게 정리해달라고 요청하였다. 기존 사이트의 디자인은 다음과 같았다. 이거는 Clau..
claude 를 사용하다가 아래 에러가 발생했다. Please run /login · API Error: 401 {"type":"error","error":{"type":"authentication_error","message":"Invalid authentication credentials"},"request_id":"req_011CZur9e67GHCiZ9PPwUSJP"} 클로드 코드 입력 창에 /logout 을 입력하고, /logout claude 를 터미널에 입력해 재실행해, 재로그인하면 해결된다. 끝 !
React 와 별도로 js 파일을 구현할 일이 생겼다. 1. Tomcat 설치https://tomcat.apache.org/download-90.cgi#9.0.116 Apache Tomcat® - Apache Tomcat 9 Software DownloadsWelcome to the Apache Tomcat® 9.x software download page. This page provides download links for obtaining the latest version of Tomcat 9.0.x software, as well as links to the archives of older releases. Unsure which version you need? Specification versi..
데이터 스트리밍이란?데이터를 일정한 크기의 청크(Chunk) 나 이벤트 단위로 끊임없이 실시간으로 전송하고 처리하는 방식이다. AI 를 사용할 때, 스트리밍 방식으로 해두면 중간 과정을 토큰으로 받아온다. 완료 후에 보내면 사용자가 너무 오래 기다리니까, AI 와 채팅할 때 중간중간 오는 것들이 데이터 스트리밍 방식이다.(생성 ➡️ 전송 ➡️ 렌더링) 데이터가 생성되는 즉시 처리하여 실시간성, 데이터의 시작과 끝이 정해져 있지 않고 계속 흘러가는 지속성, 메모리에 전체 데이터를 올릴 필요가 없어 효율성이 있다. Apache Kafka, Apache Flink, Spark Streaming, AWS Kinesis 등의 도구를 통해 구현할 수 있다. 데이터가 끝난 걸 어떻게 알까?스트리밍은 보통 이벤트 ..
웹 사이트에서 로고를 클릭하면 새로고침되며 이미지 박스가 먼저 보임 > 1초 후 로고 로딩되는 문제가 발생했다. 큰 문제는 아니지만, 사용자에게 신뢰를 저하시킬 수 있는 부분이라 판단되어 수정을 진행하였다. 깜빡임 원인Image 컴포넌트를 사용하였고, Image 컴포넌트가 blob을 비동기로 가져오는 동안 blobSrc 가 빈 문자열이라 깜빡임이 발생하였다. Image 와 img 태그의 차이Image 컴포넌트인증 토큰을 헤더에 포함해 fetch 로 이미지를 가져옴응답을 Blob 으로 변환URL.createObjectURL() 로 메모리 URL 생성URL 을 img 태그의 src 로 이용 * Blob (Binary Large Object) 이란?Blob 은 데이터 덩어리를 브라우저/JS 에서 ..
