sveltekit
-
[SvelteKit] 스벨트킷 과 mdsvex를 이용한 마크다운(Markdown) 기반 사이트 개발 구현하기Javascript & TypeScript 2023. 12. 10. 13:35
Sveltekit 과 mdsvex를 활용하여 마크다운(markdown)을 컨텐츠로 사용하는 나만의 문서기반 사이트를 개발할 때 좋은 프로젝트 구성 순서를 정리한다. 1. 프로젝트 생성 seveltkit 프로젝트 생성명령어를 통해 프로젝트를 생성한다. 본 예제에선 typescript 를 선택했는데, javascript 방식으로 선택해도 별 상관없다. npm create svelte@latest $ProjectName 2. mdsvex 설치 및 적용 svelte 에서 markdown 을 인식시키기 위해 mdsvex 라이브러리를 설치한다. npm i --save-dev mdsvex 설치 후 svelte.cofnig.js 파일을 열어 예시와 같이 수정한다. 주석으로 "추가 영역"이라 명시된 부분이다. impor..
-
[DevContainer] 컨테이너 환경에서 Vite의 hot reload가 안될 경우 (with VSCode, svelte)ETC 2023. 2. 23. 00:19
일반적인 로컬환경에서는 잘 동작하는 vite hot reload가 sveltekit 프로젝트를 devcontainer 내에서 코딩 및 디버그를 할 때제대로 동작하지 않고 매번 npm run dev 명령어로 새로 실행해줘야 수정사항이 반영되는 현상이 있었다. 해결방법은 로컬에 있는 소스코드를 bind 방식이 아닌, volume 으로 동작해야하는데, 이렇게 되면 빌드 후 생성된 volumne이 빈 volumne이 된다. // See https://containers.dev/implementors/json_reference/ for configuration reference { "name": "Node.js with firebase", "build": { "dockerfile": "Dockerfile" }, ..
-
[Typescript] swagger로 httpClient code를 자동 생성해주는 도구 swagger-typescript-api 소개Javascript & TypeScript 2023. 1. 29. 11:53
Swagger? 스웨거(Swagger)는 개발자가 REST 웹 서비스를 설계, 빌드, 문서화, 소비하는 일을 도와주는 대형 도구 생태계의 지원을 받는 오픈 소스 소프트웨어 프레임워크이다. 대부분의 사용자들은 스웨거 UI 도구를 통해 스웨거를 식별하며 스웨거 툴셋에는 자동화된 문서화, 코드 생성, 테스트 케이스 생성 지원이 포함된다. 스웨거 (소프트웨어) - 위키백과, 우리 모두의 백과사전 (wikipedia.org) swagger-typescript-api swagger-typescript-api는 별다른 추가 설정 없이 현재 구현중인 typescript 프로젝트 내 적절한 위치에 추가시킬 수 있는 CLI 명령어 도구이다. acacode/swagger-typescript-api: TypeScript AP..