Hello World! 226

[HTML] Video 태그 원하는 구간 반복시키기

요즘 아침에 공부하면서 보는 책이 있는데, 음성 파일이 네이버 블로그에 업로드 되어 제공되고 있다.영상 시작할 때 앞에 레슨, 유닛 정보를 언급하기 때문에 반복해서 들을 때 매우 거슬렸다.찾아보니 아주 쉽게 컨트롤이 가능했다. 1. 전체 반복시키기전체 반복은 쉽다. loop 속성만 추가해주면 된다. 2. 원하는 구간 반복시키기1) ended 사용하는 방법추가했던 loop 속성을 제거해줘야 한다.video loop 설정되어 있는 경우 비디오가 끝날 때 내부적으로 다시 재생되기 때문에 ended가 동작하지 않기 때문이다.const video = document.getElementById('video'); // id가 없으면 만들어주기video.addEventListener('ended', () => { ..

[WSL, Windows] Claude Code 작업 끝나면 알림 울리게 하는 방법 (hooks Notification/Stop)

클로드 코드 굴려놓고 다 끝나길 기다리면서, 끝났는지 계속 확인하는 게 너무 번거로운 일이다.클로드 코드는 hooks 라는 기능으로 트리거 설정이 가능하다.작업이 끝났거나 나한테 대답을 요구할 때 소리를 재생하도록 설정하면, 신경쓰지 않고 다른 작업을 하고 있을 수 있다. 1. WSL에서 paplay 설치$ sudo apt upate$ sudo apt install pulseaudio-utils 💡 paplay를 설치하는 이유? WSL2 환경에서는 기본적으로 오디오 출력이 안 되므로, WSLg(Windows 11 기본)를 사용하거나 PulseAudio 서버를 설정해야 소리가 들리기 때문이다. 2. 소리 테스트세팅하기 전에 소리 먼저 들어보기. 원하는 거 고르면 됨~!$ paplay /mnt/c/Win..

[Google Cloud Skills Boost] Streaming Analytics into BigQuery: Challenge Lab - Dataflow job 실행 안 될 때.. (Task 4)

[입력할 것]Job name: 복사해서 넣기Region endpoint: us-central1 (lowa) 선택Dataflow template: Custom Template 선택 > Template path:dataflow-templates-Region/latest/PubSub_to_BigQuery복사해서 넣기..BigQuery output table: {데이터셋.테이블} 선택Input Pub/Sub topic: 선택Temporary location: 복사해서 넣고, 뒤에 /temp 붙여줘야 함.Service account email: Compute Engine default service account → 이거 선택 안 해주면 dataflow job 실행할 때 temp 경로 못 만들고 account 무..

멀쩡한 Gemini API 키가 안 될 때.. (+ Netlify)

오류 내용: 백엔드 오류! 상태: 500, 메시지: [GoogleGenerativeAI Error]: Error fetching from https://generativelanguage.googleapis.com/v1/models/gemini-2.0-flash:generateContent: [400 Bad Request] API key not valid. Please pass a valid API key. [{"@type":"type.googleapis.com/google.rpc.ErrorInfo","reason":"API_KEY_INVALID","domain":"googleapis.com","metadata":{"service":"generativelanguage.googleapis.com"}},{"@..

[Windows, WSL2, PostgreSQL] npx prisma migration dev 실패

$ npx prisma migrate dev Environment variables loaded from .env Prisma schema loaded from prisma/schema.prisma Datasource "db": PostgreSQL database "디비명", schema "public" at "WSL아이피:5432" Error: P1001: Can't reach database server at `WSL아이피`:`5432` Please make sure your database server is running at `WSL아이피`:`5432`. 계속 연결이 안 돼서 마이그레이션 못 함.. 연결이 안 됨..DB 잘 떠 있고 pgadmin4로는 잘 연결되는데..?wsl에서만 연결이 안 됨...

[Windows] WSL 2에서는 localhost가 WSL 2 내부를 가리킴 (PostgreSQL 연결 실패 에러)

Windows 터미널에서 WSL(Windows Subsystem for Linux)을 실행했을 때, WSL 2는 별도의 가상 네트워크 인터페이스를 사용한다. = 다른 네트워크처럼 동작따라서 WSL 2와 Windows는 다른 IP 주소를 가진다.일반적으로 172.x.x.x 대역의 프라이빗 IP를 가진다. 참고로 WSL 1은 Windows와 동일한 커널을 공유하고 Windows 네트워크 스택을 사용한다.즉, WSL 1에서는 Windows와 동일한 네트워크 인터페이스/IP를 사용한다.※ 요약항목WSL 1WSL 2네트워크 스택Windows와 공유가상화된 별도 네트워크IP 주소Windows와 동일WSL 전용 별도 IP통신 방식직접 공유NAT 기반 통신 그렇기 때문에 WSL 2에서 localhost로 호출하면 W..

Windows 환경 Claude code 설치 및 세팅 (+ Credit balance 오류)

1. WSL 설치 및 실행 2. nvm 설치curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bashsource ~/.bashrc 3. node.js 설치nvm install --lts (나는 그냥 18버전 설치함.)node --version 4. npm 전역 설치 설정 npm 전역 패키지용 디렉토리 생성 mkdir -p ~/.npm-global npm 설정 변경npm config set prefix '~/.npm-global' PATH에 추가echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.bashrc source ~/.bashrc 5. 클로드 코드 전역 설치npm install -..

Windows 환경 Gemini CLI 설치 및 세팅 방법

1. WSL 설치 및 실행 2. nvm install 18node.js 18버전 이상이어야 함. 3. node --version버전 확인 4. npm install -g @google/gemini-cli 5. Google Cloud Project 생성 6. 생성한 프로젝트 Generative Language API 사용(활성화) 7. 생성한 프로젝트 API Key 생성 8. 터미널에서 nano ~/.bashrc프로젝트ID, API키 추가 export GOOGLE_CLOUD_PROJECT="프로젝트ID"export GEMINI_API_KEY="API키" ※ 이유는 모르겠는데 API키만 넣으면 인증 실패하길래 프로젝트ID도 넣어주었음. 9. source ~/.bashrc 10. gemini 실행테마 선택하고..

Gemini Canvas 기능으로 5분만에 AI 링크드인 포스트 생성기 만들기

요청1링크드인 포스팅 글을 자동으로 작성하는 웹 페이지를 만들고 싶습니다. 대충 장황하게 작성한 필기를 입력하고, 원하는 어투와 구조를 선택하면 글을 가공해서 출력해주는 페이지였으면 좋겠어요. 요청2생성된 게시물에서는 AI가 작성한 티가 나는 특수문자를 제거해주세요. 예를 들어서, 강조 표시를 위해 '**'를 단어 앞뒤에 붙인다거나, 특정 내용을 설명할 때 ':' 콜론을 붙이고 설명이 이어지는 것을 제거해주세요. 그리고 어떤 사례를 설명할 때에는 그 사례의 제목 정도는 써주어야 무슨 사례인지 알 수 있을 것 같습니다. 예를 들어서 'Shopify 사례처럼' 이라고 축약하는 것보다 'Shopify Otto’s Grotto 사례처럼' 이라고 축약하는 것이 정보 전달 시 좋겠습니다. 요청3ai api key ..