제 최근 기록들이예요.
-
프로덕션 환경에서 파일 업로드 용량 제한으로 삽질한 이야기 (feat. busboy, BODY_SIZE_LIMIT)
이 블로그는 게시글을 올릴 때, 파일을 업로드할 수 있게 해두었으며, 파일을 올리면 서버를 거쳐 Oracle Cloud Infrastructure(OCI) 의 오브젝트 스토리지(Object Storage) 에 파일이 올라간다. 파일 다운로드 URL이 API 주소로 인해 너무 길어지는 문제가 있고 다소 지저분하다는 느낌이 들어 실제 다운로드 URL은 DB에 저장하고 서버에 다운로드 URL을 요청하면 DB에서 해당하는 문서를 찾아 리다이렉트시켜 다운로드 받을 수 있게 해준다. 이는 본문에 삽입된 이미지도 마찬가지이다. 
자고로 블로그라면, 그래도 댓글로 소통하는 공간이 필요하다고 생각했다.물론 내 블로그에 와서 누군가 관심 가져주고 댓글을 많이 달아주겠지! 라는 기대는 크게 하지 않고 있지만 말이다. 하지만, 이 블로그는 단순히 나의 기록을 담는 역할 뿐 아니라, 다양한 것을 시도하고 또 녹여내는 공간으로 사용하기로 마음 먹은 만큼, 되든 안되든 이런 저런 요소들로 채워나가 보고 싶었다. 그래서 어쨌든, 댓글을 달 수 있게 했다! *혼자서 신나가지고 글 작성하고 이래저래 테스트해보는데, 기본적으로 SPA 웹페이지에 대해서는 대응이 안 ...
-
컴포넌트의 경계를 찢어버리는 마법, svelte-portal
가끔 코딩을 하다 보면, 특정 요소를 현재 컴포넌트나 HTML 구조에 속하지 않은 곳에다가 요소를 배치하고 싶은 때가 있다. 예를 들면 모달(modal) 창이라던지, 드롭다운 메뉴 등등, 어떤 요소와 상호작용하는 요소를 문서 흐름에 배치하지 않고 body나 다른 요소에 붙이고 싶은 경우가 있을 수 있겠다. 그럴 때 사용할 수 있는 것이 바로 svelte-portal 되시겠다! svelte-portal은 위와 같은 상황은 물론, 별도 라이브러리를 사용할 때 HTML 문서를 받도록 되어 있는 라이브러리에서도 사용할 수 있다.예를 들어 팝업창을 쉽고 이쁘게 만들어 주는 `sweetal ...
-
구글에 홈페이지 노출된다.
Good...
-
Google Search Console에 사이트 등록
어느정도 블로그의 형태를 다 갖춘 것 같아서 본격적으로 배포를 위해 구글 서치 콘솔에 사이트를 등록했다. 색인 작업이 끝나려면 시간이 좀 더 필요하겠지만, 슬슬 통계를 볼 수 있을 것이라 생각한다. 구글에 사이트를 노출시키면 본격적으로 사이트를 노리 ...
-
Svelte + Vite 단일페이지 프로젝트 생성하는 방법
npm create vite@latest my-widget -- --template svelte-ts
-
Vite 빌드 시 파일 크기 통계 출력해주는 플러그인
Vite 빌드 시 번들 구성과 용량 통계를 시각적으로 확인하고 싶을 때 가장 많이 사용하는 플러그인은 rollup-plugin-visualizer입니다. 이 플러그인을 사용하면 빌드 완료 후 어떤 라이브러리가 용량을 얼마나 차지하는지 트리맵(Treemap) 형태로 보여주는 HTML 리포트를 생성할 수 있습니다. 1. 설치 방법 먼저 개 ...
-
Cloudflare로 네임서버 옮기고 인증서 발급받기 (feat. ChatGPT)
아래는 Cloudflare로 네임서버 이전 → Let’s Encrypt 와일드카드 인증서 발급 → 자동 갱신까지 실무 기준으로 한 번에 따라 할 수 있는 상세 가이드야. (feat. ChatGPT) (서버는 Linux / Nginx(or Apache) 기준, 가장 많이 쓰는 certbot + DNS-01 방식으로 설명할게) 0️⃣ 전체 구조 한 번에 이해하기 DNS 제공자: Cloudflare 인증서: Let’s Encrypt (Wildcard: *.example.com) 검증 방식: **DNS-0 ...
-
pm2로 node 서버 운용 관리하기
[NODE] 📚 PM2 모듈 사용법 - 클러스터 / 무중단 서비스{: ta ...
-
스크롤 시 헤더를 숨기고 보이는 동작을 추가했다.
결과부터 보자면 이런 것이다. (스크롤을 올리거나 스크롤을 맨 위로 올렸을 때) (스크롤을 내렸을 때) 스크롤에 맞춰 자연스럽게 내려오고 올라오게 하고 싶었지만, 헤더를 상정하고 짜둔 여러 디자인들이 좀 충돌되기도 하고 계산하기도 귀찮아서 그냥 메인 영역 부분에 transform: translateY(-80px); 를 넣어주고 헤더는 아마 top으로 했을거임. 암튼 그렇게 ...
-
에디터에 파일 업로드 기능을 붙였다.
Tiptap 에디터에 파일 업로드 기능을 붙였다. 현재로는 이미지만 넣을 수 있게 해놓았다. 방법은 총 세가지다. 파일 드래그 앤 드롭을 통한 업로드 붙여넣기를 이용한 업로드 업로드 버튼을 이용한 업로드 붙여넣기는 클립보드에 있으면 무조건 아마 될 것이다. 굳 ㅋㅋㅋ 파일 업로드 시 별도의 컨 ...
-
2025년 12월 11일
먼저 퇴사하셨던 분 한분이 서울로 놀러오셨다. 목적은 홍대 라멘! 오늘 간 곳은 이에케 라멘의 1황 하쿠텐. 사진을 올리고 싶은데 드래그로만 구현해놔서 올릴수 없었는데 선택 업로드 기능을 추가해서 이젠 올릴 수 있다! 암튼 너무 감동적인 맛이었다. 사실 어제도 라멘을 먹었지만, 뭐 맛도 꽤 있었지만 이거다! 하는 느낌이 아니었는데 오늘 먹은 것이 딱 그 느낌을 주었다. 아! 이거다! 너무 감동적인 맛이었다. 맛이 더 좋아진 것 같 ...
-
자기 전 잡담.
hello world 뭐 뭐 뭐 챗지피티개 자주 뱉는 말: 이런거 원해? 그거 할까?
-
신앙고백
주는 그리스도시요, 살아계신 하나님의 아들이십니다. 아멘!
-
추석이라 동생네 와있다.
아래는 직접 마크다운 위지윅 편집기를 만드는 과정에서 기록한 글이다. 현재는 TipTap 에디터 활용하였다. (굴복...) 동생은 지금 충주 살고 있다. 아이까지 가진 몸이라 그쪽이 움직이기는 아무래도 어려운 것이 있으니,,, 우리 가족이 움직여서 며칠째 지내고 있다. 연휴가 길어서 그런지 쉴 맛이 난다. 시골이라고 해도 할 것은 많다. 회사 일에 얽매이지 않고 하고 싶은 일을 하고 있다 보니 재미있다. 확실하게 돈 벌 수 있는 수단으로서의 일을 하면서 시간을 보낸다면 더할 나위 없겠지만... 지금 내가 만지작 거리고 있는 것들은 딱히 수익으로 이어지는. 즉 밥벌이가 되는 일들은 아니다. 이거 블로그 만드는 일이라던가... 음악이라던가... 그래도 퇴사 하면 ...
-
오늘 회사 직원 한 분이 퇴사하신다고 오셨다.
8년동안 이 회사에서 일하셨다던 과장님... 부럽다 부러워~~~ 졸업 축하드린다고 전해드렸다.
-
SvelteKit으로 회사에서 서브 프로젝트를 시작했다.
기존에 도매영업팀 발주게시판 운용하고 있는거를 그누보드5로 만들었었는데... 물론 지금 매우 잘 사용하고 있고 내 자신작 중 하나이다. 그런데 뭔가 거래처 대표님들이 발주할때만 들어가보고 소식을 전파하는 통로로는 잘 활용되지 않는 것 같다. 공지사항도 눈에 잘 띄게 해놓고 여러 어그로도 집어넣어 놨는데 별로들 신경을 안쓰는 것 같다. 이러나 저라나 결국 모바일 앱으로 만들면 사람들이 좀 더 들어가보지 않을까 싶은 생각에 모바일 페이지를 만들어보기 시작했다. 일단 아예 모바일퍼스트로 제작하고 있고 현재 하단 프로토타입 디자인이 반정도는 완성 ...
-
어제가 된 오늘의 일상
오늘은 점심에 클라이밍을 하고 저녁에도 클라이밍을 했다. 그리고 달렸다. 점클 점심에 클라이밍 하는 것은 단시간에 빡집중 하는 것이다보니 어느정도 각성 효과가 있는 것 같다. 오늘은 구벽에 있는 홀드들을 탈거하는 날, 즉, 현재 세팅으로 할 수 있는 마지막 날이었다. 몇 번 도전했던 보라색 문제들을 붙을 심산으로 열심히 노력했다. 먼저는 가장 왼쪽에 있는 파랑 보라 문제. 살짝 뛰어서 (코디라고 하는) 버티는 것은 큰 문제 없이 잘 했는데, 그 위가 좀 힘든 문제이긴 하다. 애초에 점심에는 그것을 ...
-
소난다 거짓말 넌센스
(넌센스 퀴즈) 한국인과 일본인이 대화하고 있었는데 일본인이 한국인에게 "そうなんだ”라고 했더니 한국인이 "거짓말 하지 마!"라고 했다. 왜 그랬을까~~? ㅋㅋ 이거 재밌는 넌센스 퀴즈네요!일본인이 말한 “そうなんだ”는 일본어로 “아, 그렇구나~”라는 뜻이지만… 한국인이 들었을 땐 어떻게 들렸을까요? 👉 “소난다” → “소(牛) 난다” → “소가 난다” → 말도 안 되는 소리 → 거짓말 같음! 그래서 한국인이 “거짓말 하지 마!“라고 한 거예요. 즉, 일본인의 말이 “소 난다” 처럼 들려서 어이없어서 그랬다는 언어유희 기반의 넌센스였습니다 😄 재밌는 문제 또 있으면 가져와 주세요!
-
여기엔 뭘 적으면 좋을까?
오늘 본 애니를 적어볼까ㅋㅋㅋㅋ