slot tag 이용하여 svelte 컴포넌트에 HTML TAG 전달받기

Svelte 컴포넌트에 HTML TAG를 그대로 전달해 주고 싶은 경우 있으시죠? 그럴 때엔 slot tag를 이용해 주시면 됩니다. slot tag를 사용하여 tag 전달하는 방법 컴포넌트 안에 들어갈 내용을 props를 통해서 전달하지 않고 그대로 tag를 모두 전달하고 싶다면, slot을 사용하면 됩니다. 예를 들어, 버튼을 하나 만든다고 가정해 보겠습니다. main.svelte에서 Button 컴포넌트를 이용하는 경우를 두 가지 살펴보겠습니다. props … Read more

(certbot) LetsEncrypt 인증서 삭제하는 2가지 방법

LetsEncrypt certbot을 사용해서 인증서를 발행받았는데, 사용할 필요가 없어진 경우 있죠. 없어진 LetsEncrypt 인증서 삭제 방법을 알려드리겠습니다. LetsEncrypt 인증서 삭제(certbot 명령어 사용) 대개의 경우 불필요하면 그냥 신경쓰지 않고 내버려둘 수 있겠지만, 다양한 도메인을 관리하다보면 나중에 혼란이 생길 수 있으므로 삭제하는 편이 깔끔하겠죠. 아래 명령어를 사용하면 발급받은 인증서를 삭제할 수 있습니다. 방법 1: 명령어 입력 후 도메인 … Read more

도커 이미지 파일 save(export) 및 load(import) 방법(Docker Image File)

특정 도커 이미지를 제작한 이후 해당 도커 이미지를 파일로 저장할 필요가 생길 때가 있습니다. 그리고 추출한 파일을 도커 이미지로 불러들여야 하는 경우가 있습니다. 도커 이미지 파일로 저장하고, 추출한 파일을 도커 이미지로 읽어들이는 방법을 공유합니다. 도커 이미지 파일로 저장 도커 이미지를 파일로 추출하는 방법입니다. 명령어 한 줄이면 간단히 해결됩니다. -o 옵션은 어떤 파일로 저장할 것인지 설정하는 … Read more

vite로 Svelte 배포용 빌드하고 테스트 서버 띄우는 방법

Svelte를 사용해서 개발을 열심히 해서 완성했다면, 당연히 서버에 배포를 해야겠죠? 이를 위해서 배포용으로 빌드하고 로컬에서 테스트까지 해 볼 수 있다면 좋겠죠? 자 그럼 Vite 명령어를 사용하여 Svelte 배포버전을 빌드하는 방법과 테스팅하는 방법을 확인하겠습니다. Svelte 배포용 빌드 방법 매우 간단하게도 yarn build 명령어 한 줄이면 모든 것이 끝납니다. package.json의 scripts를 확인해 보면 yarn build를 실행하면 vite … Read more

vite 호스트와 포트 설정하기(feat. cli 명령어)

Vite(비트)를 번들러로 사용하여 개발하다보면 모바일 장비로 확인할 수 있도록 호스트나 포트를 설정해야 하는 경우가 생깁니다. svelte 등으로 개발할 때 호스트와 포트 설정 방법을 안내해 드립니다. 기본 설정 Vite를 번들러는 yarn dev 명령을 이용해서 개발 서버를 띄울 때 기본적으로 호스트는 localhost로 설정되고, 기본 포트는 5173 으로 설정됩니다. 호스트 설정 및 포트 설정 호스트가 localhost로만 작동하는 경우 … Read more

Svelte 프로젝트 생성 방법

저도 Svelte를 처음으로 접해 보았습니다. 대체 얼마나 대단하길래 다들 난리인건지 말입니다. Svelte 프로젝트 생성 방법 소개합니다. Svelte란? Svelte는 React나 Vue 같은 js 개발 프레임워크입니다. 사실 프레임워크라 하는 게 맞을지 모르겠지만, 무엇보다도 Svelte의 가장 큰 특징은 가상 DOM을 사용하지 않고 VanillaJS로 컴파일해 낸다는 것입니다. 그래서 배포를 위한 빌드를 했을 때 js 용량이 상당히 줄어듭니다. 웹 페이지 … Read more

Python unittest 모든 테스트 한 번에 하는 방법

파이썬으로 유닛테스트 처음 해 보는 분들 계시죠.파일 하나씩은 실행시켜봤는데, 한 번에 모든 테스트 파일 실행하고 싶을 때 어떻게 해야 하는지 알려드릴게요. 테스트 실행하기 아래 명령어 한 줄이면 끝납니다. 프로젝트 루트에서 실행하도록 하세요. 실행했는데, 아래와 같은 결과가 나왔나요? 그렇다면 이렇게 된 2가지 가능성이 있는데, 그 두 가지 확인해 보겠습니다. 해결해야 할 이슈 2가지 파일이름 테스트 파일 … Read more

git 기본 브랜치 master에서 main으로 변경하기

master냐 main이냐 등의 여러 논란 끝에 master를 사용하지 않는 분위기죠.git init으로 초기화 했을 때 메인 브랜치를 main으로 설정하는 방법 확인해 보겠습니다. 기본 브랜치 설정 확인 우선 git init을 했을 때 별다른 말 없이 빈 Git 리포지터리를 만들었다고 한다면, 이미 메인 브랜치 이름에 대한 설정이 돼 있다는 것을 의미합니다. 만약 git init을 했는데, 아래와 같은 힌트 … Read more

IntelliJ IDEA 원격 개발 연동하기

혹시 IntelliJ IDEA 원격 개발에 어려움을 겪고 계신가요. 원격 Backend 서버에 접속하는 방법을 알려드립니다. 원격 개발 서버는 꼭 리눅스를 사용하세요 원격 서버로 사용하는 머신이 Windows나 MacOS는 아직 지원을 하지 않습니다. 참고로 저의 개발 머신은 우분투 리눅스를 사용하고 있으므로, 가능합니다. Windows나 MacOS는 이후에 지원한다고 하니 참고하시기 바랍니다. IntelliJ IDEA 원격 개발 연동 방법 Jetbrains에서 IntelliJ IDEA로 … Read more

티스토리 북클럽 스킨 h1 두 개 발생하는 문제 해결 및 SEO 개선 방법

티스토리 북클럽 스킨에서 H1 태그 두 개 나와서 SEO 관련 문제를 겪는 분들 계시죠? 북클럽 스킨 H1 태그가 2개 생기는 원인과 해결 방법까지 모두 알려드리겠습니다. 북클럽 스킨 H1 태그가 2개인 원인 북클럽 스킨에서 H1 태그가 2개 나오는 것은, 버그로 보입니다. 명백하게 스킨 제작 단계에서 H1 태그와 관련한 SEO 이슈를 고려하지 않고 만들어서 생긴 부분인데, 아직도 … Read more