추천 기술 아티클

[Vue.js] 고민 끝에 찾은 "vue3-toastify"를 이용한 토스트 알림 Custom 스타일-나만의-적용 방법

1. "vue3-toastify" 오 이거 괜찮은데?! vue3 프로젝트에 적용할 토스트 라이브러리를 찾다가 npm에서 vue3-toastify 발견했다. 디자인, 애니메이션, 기능도 훌륭했고 문서도 제공되고 있었다. 공식 페이지 : https://vue3-toastify.js-bridge.com/ 2. 알림의 종류에 따라 다른 스타일을 적용하고 싶은데 어떻게 하는 거지? "경고, 심각, 위험"이라는 3가지 상태에 대한 토스트 알림을 주고자 했다. 각 상태에 따라 각각 다른 사용자 경험을 주고 싶었고 백그라운드 컬러를 다르게 하는 방식을 생각했다. 그런데 그런 커스텀한 스타일은 어떻게 주는 거지?? 2.1. 시도 공식 문서에서 "How to style"라는 페이지에서 힌트를 얻을 수 있을 것 같았다. 해..

VSCode에서 Mermaid Chart로 다이어그램 그리기: 개발자를 위한 완벽 가이드

VSCode에서 Mermaid Chart로 다이어그램 그리기: 개발자를 위한 완벽 가이드개발 과정에서 시스템 구조나 프로세스를 시각화해야 할 때가 있다. 복잡한 그래픽 도구 대신 코드로 다이어그램을 그릴 수 있다면 얼마나 좋을까? Mermaid Chart는 바로 그런 니즈를 충족시켜주는 강력한 도구이다.Mermaid Chart란?Mermaid는 텍스트 기반의 다이어그램 생성 도구이다. 마크다운과 유사한 문법을 사용해 다양한 종류의 차트와 다이어그램을 생성할 수 있다. 플로우차트, 시퀀스 다이어그램, 간트 차트, 클래스 다이어그램 등을 코드로 작성할 수 있어 개발자들에게 특히 인기가 높다.VSCode Mermaid Extension 설치1. Extension 설치VSCode에서 Extensions 탭(Ct..

Mac Mini M4(Apple Silicon) 환경에서 Ollama 설치 및 관리 가이드

Mac Mini M4(Apple Silicon) 환경에서 Ollama 설치 및 관리 가이드1. 서론Mac Mini M4(Apple Silicon) 환경에서 Homebrew 패키지 관리자를 사용하여 로컬 LLM 추론 도구인 Ollama를 설치하고, 실행 및 관리하는 방법에 대해 안내한다. 설치 및 삭제 절차, 서비스 관리, 추가적인 주의 사항을 상세히 설명한다.특히, 이 환경에서는 Ollama가 Apple Silicon 칩의 CPU와 GPU(Apple Metal API 기반)를 모두 자동으로 활용한다. 딥러닝 추론 시 모델의 연산은 macOS의 Metal API를 통해 GPU로 오프로드되며, 일부 보조 연산과 관리 기능은 CPU에서 동작한다. 별도의 사용자 설정 없이 Ollama의 네이티브 설치만으로 Ap..

최신 포스트

Windows 생산성 극대화를 위한 필수 도구: Microsoft PowerToys 활용 가이드

Windows 생산성 극대화를 위한 필수 도구: Microsoft PowerToys 활용 가이드실행 환경 및 요구 사항본 가이드의 작성 및 테스트 환경은 다음과 같다.운영체제(OS): Windows 11 Pro 64-bit (Windows 10 v2004 이상 지원)대상 소프트웨어: Microsoft PowerToys 최신 버전설치 도구: Windows Package Manager(winget) 또는 Microsoft Store작업 효율을 획기적으로 개선하는 Windows 도구소프트웨어 개발과 문서 작업 환경에서 창 배치, 빠른 앱 검색, 화면 내 색상 및 텍스트 추출은 일상적으로 반복되는 작업이다. 그러나 Windows 기본 환경만으로는 다중 모니터 작업 시 복잡한 창 분할이나 서식 없는 텍스트 붙여넣..

확장 프로그램 없이 VS Code 내장 Git Blame으로 코드 작성자 및 커밋 이력 확인하기

확장 프로그램 없이 VS Code 내장 Git Blame으로 코드 작성자 및 커밋 이력 확인하기1. 내장 Git Blame 기능 개요1-1. 기능 소개 및 도입 배경외부 확장 프로그램 의존성 제거 GitLens와 같은 대형 확장 프로그램을 설치하지 않고도 코드 작성자와 커밋 정보를 즉시 확인할 수 있다.가벼운 개발 환경 유지 추가적인 리소스 소모를 방지하여 VS Code의 구동 속도와 쾌적한 에디터 성능을 보장한다.에디터 내 라인별 인라인 데코레이션 제공 커서가 위치한 코드 라인의 끝에 커밋 작성자, 작성 시간, 커밋 해시 등의 메타데이터가 흐린 텍스트 형태로 자동 렌더링된다.2. 설정 활성화 방법2-1. GUI 설정 메뉴를 통한 활성화2-1-1. 설정 화면 진입 및 옵션 검색설정 화면 열기 단축..

잘못된 브랜치명 변경부터 꼬인 커밋 강제 복구까지! 실전 Git 치트시트

Git 실무 핵심 가이드: 브랜치 관리부터 커밋 복구 및 리셋까지형상 관리 도구로 Git을 사용하다 보면 브랜치 이름을 잘못 생성하거나, 원격 브랜치와의 추적(Upstream) 연결이 끊어지거나, 잘못 커밋한 내용을 과거 시점으로 되돌려야 하는 위기 상황에 직면한다. GUI 도구는 직관적이지만 예기치 않은 오류가 발생했을 때 문제의 근본 원인을 파악하고 정밀하게 수습하기 어렵다. 터미널 기반의 핵심 Git 명령어를 명확히 이해하고 있으면 예기치 않은 히스토리 꼬임 현상도 안전하게 복구할 수 있다.테스트 환경: Git 2.23 이상 (최신 권장 명령어 git switch 지원)운영체제: macOS / Linux / Windows PowerShell 공통1. 브랜치 생성과 이름 변경 및 원격 동기화프로젝트 ..

.gitignore가 작동하지 않는다?

.gitignore가 작동하지 않는다?실행 환경OS: Windows 11 / macOS 14Git: 2.x 버전 이상프로젝트를 진행하다 보면 개인 설정 파일이나 IDE 설정 폴더(예: .vscode/, .idea/)가 원격 저장소에 잘못 올라가는 경우가 있다. 이를 방지하기 위해 뒤늦게 .gitignore 파일에 해당 폴더나 파일을 추가하게 된다.그런데 분명히 .gitignore에 추가하고 저장했는데도 불구하고, 로컬에서 파일 내용이 변경될 때마다 git status에 수정된 파일(Modified)로 잡히고 계속해서 Git의 추적을 받는 현상이 발생한다.원인 파악: 왜 이런 일이 발생할까?결론부터 말하면, Git은 이미 한 번 커밋되어 "추적 중(Tracked)"인 파일에 대해서는 .gitignore 규..

Hermes Agent와 gemini-3.1-flash-lite로 무장한 돌쇠(서브 에이전트) 군단으로 무료 에이전트 구축

이 글을 작성하는 2026년 6월 기준, gemini-3.1-flash-lite 모델의 무료 티어는 일 500회, 분당 5회로 호출 횟수가 엄격히 제한되어 있다. 이 모델을 메인 에이전트인 Hermes(애칭 '제이')에 연동하여 운영하다 보니 '429 에러'가 빈번하게 발생하여 시스템이 멈추는 일이 잦았다. 이를 근본적으로 해결하기 위해 제이에게 쿼터 제한을 우회할 '조수'를 만들도록 지시했다. Google AI Studio에서는 계정당 최대 10개의 프로젝트를 생성할 수 있으며, 각 프로젝트에서 발급된 API 키는 독립적인 1일 쿼터를 보장받는다. 즉, 10개의 키를 확보하면 하루 최대 5,000회까지 호출이 가능해진다. 이 점에 착안하여 제이에게 7개의 API 키를 제공하고 파이썬으로 7명의 조수(이..