Svelte Shield 확장 기능 출시와 Toymorphism 디자인으로

개시하다
이 글은 Svelte Advent Calendar 2021의 다음날 글이다.
제가 올해 개발한 두 개의 Svelte제 OSS를 소개할 수 있도록 허락해 주십시오. 전체적인 상황이 어떠한지 돌아보고 정리하고 싶습니다.
Svelte Shild 확장 기능
Svelte Shield는 지난해 발표한'시선 이동 없이 일본어를 쉽게 읽을 수 있는 도구'다.
올해 2021/05에 이 확장판이 발표되었다.
페이지에서 텍스트를 선택하고 마우스 오른쪽 버튼으로 클릭하여 작업을 수행할 수 있습니다.

Svelte Shield 확장 기능 - 크롬 사이트 스토어

GitHub

개인적으로 많이 썼고 인터넷 기사를 많이 읽어서 편해졌어요.
네트워크 버전에서 사용Neumorphism UI은 전역 스타일에 영향을 미치기 때문에 페이지 삽입식의 이 확장 기능에 사용할 수 없고 간단한 스타일입니다.
Neumorphism 라이브러리에는 Svelte 버전과 웹 Components 버전이 없는 것 같아서 언젠가는 시간이 나면 하고 싶을 거예요.
Toymorphism
웹페이지를 장난감으로 만들어 즐기자는 사상을 바탕으로 개발된 구성 요소 라이브러리다.

Toymorphism

GitHub

예리한 개발에서는 앞으로 이 점에 가이드라인을 정의하는 등 작은 디자인 시스템을 구축할 예정이다.
최소한의 물건이 준비됐을 때 Svelte 일본과 공식 디지털 코드로 소개하려고 합니다.
이 개발에서 IBM Carbon Design System과 GiitHub Primer의 문서 소스 코드를 봤습니다.
Carbon Design System에서 sveld를 대상으로 하는 svelte &js의 형 강화 라이브러리는 매우 편리하고 Toymorphism에 이용되었다.또한 GiitHub Primer는 CI 주변 상황을 참고해 changeesets를 사용하기로 했다.
앞으로 웹 Component 버전과React 버전에 대응할 수 있었으면 좋겠다고 생각해서monorepo 구조를 채택했습니다.우리는 svelte-kit의monorepo 구조를 참고했다.
성과는 좋지 않지만 배운 게 많고 좋은 경험이다.
전체를 회고하다
구성 요소 라이브러리를 만들어 봤기 때문에 Svelte가 못하는 일(공통된 스타일의 정의 등)도 일부를 볼 수 있지만, 그럼에도 불구하고 종합적인 장점은 적지 않다.
한편 올해는 지난해보다 Svelte 코드를 쓰는 시간이 늘었다.

이상은 올해 인코딩된 각 언어의 비율입니다.(1개월만 WakaTime에 데이터 청구)
TypeScript의 인코딩 시간 중 절반 정도가 React입니다.일주일에 4번 리액트 사건처럼 코딩 시간을 낼 수 있어서 너무 기쁩니다.
내년에도 Svelte 쓰기 시간을 늘렸으면 좋겠어요.
아울러 앞으로도 간단한 Svelte를 활용할 수 있는 발전을 기대하고 있다.
끝까지 읽어주셔서 감사합니다.🙇‍♂️🙇‍♀️🙇
🌈🏳️‍🌈🎨