Remult + SvelteKitが良さげ
Web開発において汎用性かつ機能性の高い最適なAPIの開発やドキュメントの作成は非常に重要です。 今回は「型安全なAPIの自動生成・容易なリアルタイムデータ同期」が可能なRemultとFWのSve…
View ArticleSvelte 5の正式リリースを祝してその魅力を語ります
ついに、frontend の 新な大本命、Svelte 5 が2024年10月22日にリリースされました！ 2024年4月30日にSvelte 5 RC（Release Candidate）が登場し…
View ArticleSvelteのコンポーネントライブラリーであるLayerChartを触ってみた
はじめに SvelteのコンポーネントライブラリーであるLayerChartを触ってみようと思い立ち、触ってみましたので、その記録を記したいと思います LayerChartは、Svelte向けのデー…
View Article"Error in svelte.config.js ..." の解消方法
はじめに 公式の環境構築の手順に沿って作成したが、page.svelteとlayout.svelteに「Error in svelte.config.js ...」というエラーが発生しました。今回は…
View ArticleVitest / svelte-testing-library を使いSvelteのコンポーネントテストする方法
こんな方にマッチする記事です！ svelteのテストコードを書くのに興味がる方 svelteでコンポーネントテストを行う方法を知りたい方 testing-libraryのsvelte版にはどのような…
View ArticleVSCode拡張機能「 i18n Alliy 」を使って 多言語対応の開発生産性を劇的に飛躍させる
はじめに 近年はグロバール化が進んでおり、プロダクトに関してもグローバル対応が求められるケースが増えています。 グローバル対応を実現するにあたって基本的にはi18nなどを使って自前で実装するか、 外…
View ArticleSvelteのコンセプトに心打たれ、触れてみて書きやすさに感動し、Runeの使いやすさに涙した…けど、たった一点の理由で結局Vueに帰還したお話
先日バージョン5が公開されたSvelteを二週間ほど触ってみました。 仮想DOMを使わず、コンパイラーでコードを出力し高速な処理を実現するというコンセプトや、サンプルコードの見やすさに感心し興味が湧…
View ArticleAWS Amplify + Bun + Svelte のビルド設定
TL;DR Bun をインストールする: curl -fsSL https://bun.sh/install | bash Svelteのための gzimbron/amplify-adapter を…
View Articleshadcn-svelteのSelectコンポーネントの値の取得・操作について
はじめに Reactではよく使われるUIコンポーネントの「shadcn」ですが、これをSvelteに有志の方が移植してくれています。 shadcnは、シンプルでビジネス寄りなデザインのUIコンポーネ…
View Article生成AIでi18n多言語対応を簡単爆速に行う ※プロンプト例あり
はじめに みなさんが普段開発しているプロダクトでは多言語対応をしていますか？ グローバル対応を実現するにあたって基本的にはi18nなどを使って自前で実装するか、 外部のツールやサービスを利用するかの…
View Article国際電話番号に適合した電話番号が入力できる入力文字変換処理を作成する
クリアしたい課題！ 国際電話番号もしくは日本の電話番号の入力を可能にしつつ、不要な文字は入力できないような入力文字変換処理を作りたい！ https://www.android.com/intl/ja…
View ArticleSvelteキャッチアップしてみた
はじめに 今後Svelteを使用する機会があるので、公式チュートリアルを通して学んだことをアウトプットしていきます！ 公式チュートリアル 目次 1.Svelteってなに？ 特徴 他のフレームワークと…
View Article【Svelte】slotについて
Slot 子コンポーネントに<slot />タグを持たせることで、親コンポーネントから子コンポーネントに要素の受け渡しができる。 <div class=""> <slot /> </div> <Ch…
View ArticleSvelte の組み込み要素について
Svelteの組み込み要素 <svelte:self> 自分自身をインポートすることはできないため、<svelte:self>を使用して再起的にコンポーネントを使用できる。 <svelte:comp…
View ArticleSveltKitの概要
SvelteKit キャッチアップ Svelteをコンポーネントフレームワークとすると、SvelteKitはアプリケーションフレームワークと言えます。 各ページの書き方はNext.jsのApp Ro…
View ArticleSvelteの新しいリアクティブビルドインSvelteURLSearchParamsを使ってみよう
Svelte5では、SvelteMap、SvelteSet、SvelteURLなどの、リアクティブな組み込みバージョンを付け加えました。今日はその中の一つSvelteURLSearchParamsを…
View Article【Svelte 5】devtoolが無いなら$inspectを使えばいいじゃない
Svelteには最新のV5に対応した開発者ツールがまだ存在せず、諦めてVueで開発を進めていたのですが、 先日某所でSvelte有識者の方に「なんか値を追跡できるいい方法ないですかね」と質問したとこ…
View ArticleSvelte(Kit)の世界: Runes (おまけ) #6
はじめに はじめまして、WEB フロントエンドエンジニアの nuintee です。 この度かねてより関心があった Svelte に入門する覚悟が出来たので、 その学習過程をアドベントカレンダーにして…
View ArticleSvelte で 3D 表示を行うライブラリ Threlte Ex1: Svelte5 対応を試す
はじめに Svelte 5 が出てもう2か月目となったが、その間の開発周辺のサポートはまだまちまちだったりするものもある。 という事で、Svelte 5 の採用をどこまで判断するか考えるべく、周辺の…
View Article大切なあなたの時間を奪うクソゲーム
この世に溢れるクソゲー(いい意味で) YouTubeの広告や、アプリ内の無料クレジットを得るために流れる広告でよくみるクソゲー。 車を順番に外へ出すゲーム、絡まった縄を解くゲーム、槍を放ちながら前に…
View Article