개발, 심리, 투자 그리고 일상의 생각 나눔
개발과 관련된 이야기들~*
SvelteKit으로 개발하면서 현재 경로에 따라 스타일링을 해야 하는 경우가 있습니다. 그러려면 현재 경로를 알 수 있어야겠죠. 그럼 sveltekit에서 현재 url 경로 구하는 방법을 확인해 보겠습니다. 오랫동안 SvelteKit이 1.0 출시를 못하고 있었는데, 2022년 12월 14일부로 1.0 출시를 했습니다. 1.0 출시 이전에는 처리하는 방법이 바뀌기도 했었는데, 이제 1.0 출시를 했으니, 어느정도 안정이 됐다고 볼 수 있겠네요. page … Read more
SvelteKit이 지난 12월 14일 1.0 출시를 했습니다. 기존에는 아무래도 1.0 출시 이전이라 페이지 라우팅 방식에 변경이 있었습니다. 이제는 1.0 출시를 했으니 안정이 좀 됐다고 봐도 괜찮을 것 같습니다. 그럼 SvelteKit 라우팅 +page, +layout 사용 방법을 알아보겠습니다. SvelteKit 라우팅 방식의 변경 기본 라우팅 페이지를 index.svelte로 사용했던 적이 있었습니다. 하지만, 현재는 +page.svelte를 인덱스 페이지로 사용하고 있습니다. __layout.svelte도 … Read more
이번에 처음 접하게 된 SvelteKit을 활용하여 전기요금 계산기를 만들었습니다. Svelte는 지금까지 개발해 왔던 React, Vue, Angular를 돌아보지 않게 만들 정도의 작품이라는 생각이 듭니다. Svelte에 대한 감탄은 그만하고, 전기요금 계산기에 대해 간단히 설명드릴게요. 누진요금 계산원리 어떤 원리로 누진요금이 계산되는지, 그리고 각 단계별로 계산되는 누진 요금도 확인할 수 있습니다. 기후환경요금과 연료비 조정액에 대한 계산까지 모두 살펴보실 수 … Read more
Svelte 컴포넌트에 HTML TAG를 그대로 전달해 주고 싶은 경우 있으시죠? 그럴 때엔 slot tag를 이용해 주시면 됩니다. slot tag를 사용하여 tag 전달하는 방법 컴포넌트 안에 들어갈 내용을 props를 통해서 전달하지 않고 그대로 tag를 모두 전달하고 싶다면, slot을 사용하면 됩니다. 예를 들어, 버튼을 하나 만든다고 가정해 보겠습니다. main.svelte에서 Button 컴포넌트를 이용하는 경우를 두 가지 살펴보겠습니다. props … Read more
Svelte를 사용해서 개발을 열심히 해서 완성했다면, 당연히 서버에 배포를 해야겠죠? 이를 위해서 배포용으로 빌드하고 로컬에서 테스트까지 해 볼 수 있다면 좋겠죠? 자 그럼 Vite 명령어를 사용하여 Svelte 배포버전을 빌드하는 방법과 테스팅하는 방법을 확인하겠습니다. Svelte 배포용 빌드 방법 매우 간단하게도 yarn build 명령어 한 줄이면 모든 것이 끝납니다. package.json의 scripts를 확인해 보면 yarn build를 실행하면 vite … Read more
Vite(비트)를 번들러로 사용하여 개발하다보면 모바일 장비로 확인할 수 있도록 호스트나 포트를 설정해야 하는 경우가 생깁니다. svelte 등으로 개발할 때 호스트와 포트 설정 방법을 안내해 드립니다. 기본 설정 Vite를 번들러는 yarn dev 명령을 이용해서 개발 서버를 띄울 때 기본적으로 호스트는 localhost로 설정되고, 기본 포트는 5173 으로 설정됩니다. 호스트 설정 및 포트 설정 호스트가 localhost로만 작동하는 경우 … Read more
저도 Svelte를 처음으로 접해 보았습니다. 대체 얼마나 대단하길래 다들 난리인건지 말입니다. Svelte 프로젝트 생성 방법 소개합니다. Svelte란? Svelte는 React나 Vue 같은 js 개발 프레임워크입니다. 사실 프레임워크라 하는 게 맞을지 모르겠지만, 무엇보다도 Svelte의 가장 큰 특징은 가상 DOM을 사용하지 않고 VanillaJS로 컴파일해 낸다는 것입니다. 그래서 배포를 위한 빌드를 했을 때 js 용량이 상당히 줄어듭니다. 웹 페이지 … Read more
파이썬으로 유닛테스트 처음 해 보는 분들 계시죠.파일 하나씩은 실행시켜봤는데, 한 번에 모든 테스트 파일 실행하고 싶을 때 어떻게 해야 하는지 알려드릴게요. 테스트 실행하기 아래 명령어 한 줄이면 끝납니다. 프로젝트 루트에서 실행하도록 하세요. 실행했는데, 아래와 같은 결과가 나왔나요? 그렇다면 이렇게 된 2가지 가능성이 있는데, 그 두 가지 확인해 보겠습니다. 해결해야 할 이슈 2가지 파일이름 테스트 파일 … Read more
master냐 main이냐 등의 여러 논란 끝에 master를 사용하지 않는 분위기죠.git init으로 초기화 했을 때 메인 브랜치를 main으로 설정하는 방법 확인해 보겠습니다. 기본 브랜치 설정 확인 우선 git init을 했을 때 별다른 말 없이 빈 Git 리포지터리를 만들었다고 한다면, 이미 메인 브랜치 이름에 대한 설정이 돼 있다는 것을 의미합니다. 만약 git init을 했는데, 아래와 같은 힌트 … Read more
혹시 IntelliJ IDEA 원격 개발에 어려움을 겪고 계신가요. 원격 Backend 서버에 접속하는 방법을 알려드립니다. 원격 개발 서버는 꼭 리눅스를 사용하세요 원격 서버로 사용하는 머신이 Windows나 MacOS는 아직 지원을 하지 않습니다. 참고로 저의 개발 머신은 우분투 리눅스를 사용하고 있으므로, 가능합니다. Windows나 MacOS는 이후에 지원한다고 하니 참고하시기 바랍니다. IntelliJ IDEA 원격 개발 연동 방법 Jetbrains에서 IntelliJ IDEA로 … Read more