본문 바로가기

전체 글161

프론트엔드 빌드 툴 webpack 부터 vite 까지 개발에서 손을 뗀 뒤로 웹팩이란 말을 들었을 때 도대체 저게 뭘까? 라는 궁금증이 들었지만 실제로 사용해본 적은 한번도 없었다.우연히 IT기업에 다니는 초보개발자랑 잠깐 말을 섞을 일이 있었는데 회사 내에서도 웹팩을 많이 사용한다는 얘기를 들었는데 실제로 사용해 본적이 없으니 그냥 궁금 궁금. 그러다 구글의 노트북LM을 알게 되면서 유튜브나 웹에서 소스들을 싹 가져와서 분석을 맡겨보았다.그리고 번들러라는 개념에 대해 어렴풋이 알 수 있었다. 이전에는 (내가) 웹사이트를 만든다고 했을 때 그냥 여기저기서 js 파일이며, css 파일들을 가져다 덕지덕지 붙여서 썼다.그러다 보니 이게 실제로 필요한 건지 어디서 쓰고 있는건지 사실 잘 모를 때도 많았고, 시간이 좀 지나면 그냥 그러려니 하고 서버에 죄다 올라가.. 2026. 7. 3.
디지털 집 짓기 바이브코딩 해설 https://youtu.be/uiBVFeFmpcc?si=sXfigvOL8Oe5_QXr 2026. 7. 3.
AI 만능 어댑터 MCP의 이해 바이브코딩 초보를 위한 MCP 설명https://youtu.be/ukWiwYWODFI?si=UXyCDnQ-o4G9Mf1Y#1 기초학습https://youtu.be/7T9JSCkVGYI?si=l0o7sWhtZ5elxP-S#2 심화학습 2026. 7. 3.
브라우저에서 바로 이미지를 PDF로 — SvelteKit 기반 Image to PDF 제작기 TL;DR — 서버 없이, 개인 파일을 외부로 전송하지 않고 브라우저 안에서만 이미지를 PDF로 변환하는 웹앱을 SvelteKit + Tailwind CSS v4로 만들었습니다. GitHub Pages에 무료로 배포해서 누구나 쓸 수 있습니다.왜 만들었나요?스캔 이미지나 사진 몇 장을 PDF로 묶어 제출해야 할 때가 꽤 자주 있습니다. 그런데 vFlat 앱으로 사진을 찍었더니 유료 서비스에 가입을 해야 하더군요. 그래서 급히 직접 만들어보기로 했습니다. 어떻게 만들었나요?안티그래비티에 대략적인 기능을 설명해 주었습니다.그러자 스스로 개발초안을 만들며 개선안까지 제시를 해주었습니다.처음에는 서버에서 동작하는 것으로 생각했으나, 브라우저에서도 처리할 수 있다고 제안까지 한 것입니다. 그리고 안티그래비티가 임.. 2026. 7. 1.
[첫 개발일지] 나만의 실시간 주식 대시보드를 만들었습니다 — My Stock 제작기 🚀 시작하게 된 이유주식을 하다 보면 항상 아쉬운 게 있었습니다. 국내 증권사 HTS는 기능은 많지만 UI가 복잡하고, 해외 주식을 보려면 앱을 또 따로 켜야 하고, 환율은 어딘가에서 또 따로 확인해야 하고…그래서 아예 내가 원하는 기능만 담은 대시보드를 직접 만들어보자고 생각했습니다."코스피, 나스닥, 내가 보유한 주식, 환율까지 한 화면에서 바로 보고 싶다." 그게 My Stock의 시작이었습니다. 📱 어떤 서비스인가요?My Stock은 실시간 글로벌 시장 지수, 개별 주식 시세, 환율을 한 화면에서 모니터링하고, 내 포트폴리오를 원화 기준으로 관리할 수 있는 개인용 금융 대시보드 웹앱입니다. 주요 기능을 정리하면 이렇습니다:📊 글로벌 지수 모니터링: 코스피, 코스닥, 나스닥, S&P 500을.. 2026. 7. 1.
[SvelteKit] 이미지 드래그앤드롭 PDF 변환 웹 프로그램 만들기 안녕하세요! 오늘은 스벨트킷(SvelteKit)을 활용하여 사용자가 업로드한 이미지들을 하나의 PDF 파일로 병합하고 다운로드할 수 있는 웹 애플리케이션 개발 가이드를 정리해 보려고 합니다.특히 데스크톱뿐만 아니라 모바일 환경 최적화, 작업 진행 중 세련된 애니메이션, 그리고 서버 용량 관리를 위한 24시간 임시 파일 자동 삭제(TTL) 기능까지 포함된 완성도 높은 풀스택 프롬프트와 설계 구조입니다.🛠️ 기술 스택 및 개발 프레임워크Framework: SvelteKit (최신 안정 버전)Styling: Tailwind CSS (반응형 및 모바일 터치 최적화)PDF Library: pdf-lib 또는 jsPDF (서버/클라이언트 환경에 맞춤)Storage: Node.js 내부 스케줄러 기반의 24시간 자.. 2026. 6. 24.
MCP로 만들어 본 AI 관련 뉴스 2024년 AI 기술 트렌드: 최신 소식 5가지인공지능 기술은 2024년에도 계속해서 빠른 속도로 발전하고 있습니다. 이번 포스트에서는 최근 AI 분야에서 주목받고 있는 주요 뉴스와 기술 발전 사항을 살펴보겠습니다. 세계적인 기업들과 연구기관들이 선보인 혁신적인 AI 기술과 그 응용 사례를 확인해보세요.1. 2024년을 정의한 6가지 게임 체인징 AI 브레이크스루2024년 AI 분야에서 가장 주목할 만한 혁신 중 하나는 AlphaFold 2와 같은 인공지능 모델이 화학 분야에서 노벨상을 수상하는 데 기여한 것입니다. 이 AI 모델은 새로운 단백질을 생성하는 과정에서 중요한 역할을 했으며, 이는 AI가 순수 과학 분야에서도 혁신을 이끌어낼 수 있음을 보여주는 중요한 사례입니다.출처: Forbes2. 202.. 2025. 4. 28.
[팁] 스왑파일 설정하기 스왑파일이 잡혀있는지 확인해 보자.$ sudo free -m total used free shared buff/cache availableMem: 956 535 71 7 511 421Swap: 0 0 0 0으로 되어 있다. 1. 4G 스왑파일 생성$ sudo fallocate -l 4G /swapfile 2. 권한설정$ sudo chmod 600 /swapfile 3. 스왑 영역으로 설정$ sudo mkswap /swapfile 4. 스왑활성화$ sudo swapon /swapfi.. 2025. 4. 14.
FTP로 오라클 클라우드 프리티어에 업로드 하기 우선 필요한 것은 PuTTY과 FileZilla 를 다운받는다. PuTTY를 설치하면 PuTTYgen 프로그램을 실행한다. 앞서 프라이빗과 퍼블릭 키를 만들어두었다면 프라이빗키를 Load를 통해 불러온 뒤 Save private key로 저장하면 .ppk 파일로 저장된다. 파일질라를 실행한 후 프로토콜 SFTP, 호스트는 내 도메인, 포트는 22, 로그온 유형은 키파일.사용자는 ubuntu 그리고 키파일을 앞서 생성한 ppk 파일을 불러온 후 연결하면 된다. 만약, 업로드가 되지 않는다면 /var/www/html 폴더의 소유자와 그룹이 ubuntu로 되어 있는지 확인하고 그렇지 않다면 소유자를 변경한다. 2025. 4. 14.