대본 기획 도우미▸ 
AI 앱 
AI 뉴스 
Chalk.ist: Idered가 제작한 오픈소스 코드 스크린샷 도구
Chalk.ist: Idered가 제작한 오픈소스 코드 스크린샷 도구소개
Chalk.ist란 무엇인가요?
Chalk.ist는 Idered가 만든 오픈소스 코드 스크린샷 도구로, 주로 개발자가 코드를 보기 좋은 이미지로 생성할 수 있도록 도와줍니다. 사용자는 코드를 붙여넣고 테마와 스타일을 선택하기만 하면 빠르게 보기 좋은 코드 스크린샷을 만들 수 있으며, 다양한 프로그래밍 언어를 지원합니다. 블로그 작문, ppt 강의, 소셜 미디어 공유 등의 상황에 적합합니다.
Chalk.ist의 특징
직관적인 인터페이스: 왼쪽에 테마, 글꼴, 배경, 형식 등 다양한 조절 매개변수 패널이 있으며, 다양한 그라데이션 배경이 아름다워 사용자가 직접 탐색하고 조정할 수 있어 코드 표시 스타일에 대한 다양한 사용자의 개인화된 요구를 충족할 수 있습니다.
높은 사용자 정의:
코드 세부 조정: 취향에 따라 코드의 글꼴, 글자 크기, 행간, 자간 등의 세부 사항을 조정할 수 있으며, 다양한 코드 강조 스타일을 선택하여 코드를 더 명확하고 읽기 쉽게 만들 수 있습니다.
창 스타일 맞춤 설정: 창 배경, 제목 표시줄, 창 그림자 등을 포함하여 창 스타일을 사용자 정의할 수 있도록 지원하여 스크린샷을 더 전문적으로 만듭니다.
다양한 장식 옵션: 행 장식, 배경 노이즈, 배경 입자 등 다양한 장식 옵션을 지원하여 코드 스크린샷의 시각적 효과를 향상시킵니다.
풍부한 테마: 일련의 사전 제작된 테마가 포함되어 있으며, 사용자가 자신의 테마를 만들 수도 있습니다. 다양한 테마와 스타일이 내장되어 있어 자신의 스타일에 가장 부합하는 코드 색상 조합을 자유롭게 선택할 수 있습니다.
간편하고 효율적: 간단한 몇 단계만으로 코드를 멋진 이미지로 생성할 수 있어 모든 소셜 미디어 공유에 적합하며, 시간과 노력을 절약할 수 있습니다.
사전 설정 저장 지원: 사용자는 현재 설정을 사전 설정으로 저장하여 나중에 빠르게 액세스하고 사용할 수 있으며, 다음 스크린샷에서 자주 사용하는 스타일을 빠르게 적용하여 시간과 노력을 절약할 수 있습니다.
손쉬운 공유: 사용자는 아름답게 만든 코드 스크린샷을 PNG 또는 SVG 형식으로 내보내고 소셜 미디어에 쉽게 공유하거나 블로그에 삽입할 수 있습니다.
우수한 성능: Vue 3로 구축되어 속도가 빠릅니다.
기술 아키텍처
프론트엔드: Vue.js 기반이며, 풍부한 상호작용 및 UI 구성 옵션을 제공합니다.
백엔드: 주로 Nuxt.js로 구동되며, 동적 라우팅 및 서버 측 렌더링 기능을 지원합니다.
스타일 처리: TailwindCSS로 구현되어 유연하고 효율적입니다. 또한 프로젝트는 서비스 상태를 모니터링하는 데 사용할 수 있는 /healthcheck API 엔드포인트를 제공합니다.
Chalk.ist 사용 튜토리얼
Chalk.ist 웹사이트 방문: https://chalk.ist/ 에 접속합니다.
코드 테마 선택: 웹사이트에서 좋아하는 코드 테마를 선택합니다. 다양한 사전 설정 테마와 사용자 정의 테마를 제공하여 다양한 사용자의 요구를 충족합니다.
코드 붙여넣기: 아름답게 만들고 싶은 코드를 편집기에 붙여넣으면 편집기에서 코드의 실시간 미리보기 효과를 볼 수 있습니다.
스타일 사용자 정의: 필요에 따라 창 스타일, 배경 색상, 글꼴, 줄 번호 표시 등을 포함한 코드 스타일을 사용자 정의할 수 있으며, 창의 테두리, 그림자, 투명도와 같은 매개변수를 조정하여 스크린샷을 더 보기 좋게 만들 수 있습니다.
스크린샷 내보내기: 사용자 정의를 완료한 후 "내보내기" 버튼을 클릭하여 아름답게 만든 코드 스크린샷을 로컬에 저장합니다. PNG 또는 SVG 형식으로 내보내기를 선택할 수 있습니다.
배포 방식
http://chalk.ist/ 는 Nuxt.js를 사용하여 프론트엔드와 백엔드를 개발하며, Vercel에서 빠르게 배포하는 것을 지원하여 매우 편리합니다. 로컬에서 실행하려면 다음 단계를 참조하여 작업을 진행하세요:
프로젝트 복제: 터미널에서 git clone https://github.com/Idered/chalk.ist 명령을 실행합니다.
종속성 설치: pnpm install 명령을 사용하여 프로젝트에 필요한 종속성을 설치합니다.
개발 환경 시작: pnpm run dev 명령을 실행하면 로컬에서 Chalk.ist를 시작할 수 있습니다.
오픈소스 주소: https://github.com/Idered/chalk.ist
관련 정보:
