Resource - フロントエンドエンジニア向け

shadcn/uiにインスパイアされたオープンソースのモバイル向けUIコンポーネント・「mobilecn UI」

mobilecn UIはshadcn/uiにインスパイアされたオープンソースのモバイル向けUIコンポーネントです。mobilecn UIにはReact Native向けのNativecn UIとSwiftUI向けのSwiftcn UIが用意されており、いずれもカスタマイズしやすく複雑な設定も不要ですぐに使えるUIコンポーネントとなっており、シンプルで美しいスタイルを重視して設計されています。

Web等の開発スキルアップに役立つ様々な分野のツールやリソースを探せるハブサイト・「LinksHub」

LinksHubはWeb等の開発スキルアップに役立つ様々な分野のツールやリソースを探せるハブサイトです。よくあるタイプのハブサイトですが、情報量が非常に多くなっています。基本的に大半はWebに関わる開発がメインとなっているのでITエンジニア向けのハブサイト、という認識で良いと思います。

AIモデルにGoogle Geminiを採用したオープンソースのAIチャットWebアプリ・「Google Gemini Web Chat」

Google Gemini Web ChatはAIモデルにGoogle Geminiを採用したオープンソースのAIチャットWebアプリです。構築にはViteが採用されています。利用するには Google AI StudioにてAPIキーを取得し、入力してからとなります。キーを入力したらすぐにもGemini AIとチャット出来るようになります。
Ads

Google formからのインポートも対応、プライバシーファーストで設計された送信フォーム作成プラットフォーム・「BetterCollected」

BetterCollectedはGoogle formからのインポートも対応、プライバシーファーストで設計された送信フォーム作成プラットフォームです。ユーザー(回答者)のプライバシーに配慮した設計となっていて、フォーム送信前にデータ収集の目的を設定し、送信者に同意して貰うように出来たり、送信者が自分の送信内容を確認したり、その内容を削除要求出来るなどの機能が設けられています。

ドメイン分析のためのWebアプリを構築できるオープンソースのツールキット・「Domain Digger」

Domain Diggerはドメイン分析のためのWebアプリを構築できるオープンソースのツールキットです。任意のドメインを入力するだけでDNS情報の取得、位置情報を含むIP情報取得、異なるグローバルサーバー間でのDNS検索実行、DNSデータの視覚化、WHOISデータ検索、SSL/TLS証明書の変更履歴追跡などが可能なWebアプリとして提供され、ブックマークレットも用意されています。

履歴書ファイルや任意のプロンプトからAIが適切なオープンソースプロジェクトを提案してくれるOSSのAIチャット・「Waterloti」

Waterlotiは履歴書ファイルや任意のプロンプトからAIが適切なオープンソースプロジェクトを提案してくれるOSSのAIチャットです。オープンソースプロジェクト検索専用のAIチャット、というものになります。よくあるAIチャットのプロンプトを元に適切なオープンソースプロジェクトを提案してくれます。APIには Github API代替としてOSSInsightのPublic APIが採用されています。

予め600以上の関数が用意されており、目的に合わせて構築できるオープンソースのDiscordボット開発ライブラリ・「aoi.js」

aoi.jsは予め600以上の関数が用意されており、目的に合わせて構築できるオープンソースのDiscordボット開発ライブラリです。ボットを自作しやすいよう設計されていますが、フレームワークのような類ではなく、既に作られている関数を使ってボットを作成出来る、というもの。

Next.jsとTailwind.cssで構築されたオープンソースのヘッドレスWordPressテンプレート・「Fjord」

FjordはNext.jsとTailwind.cssで構築されたオープンソースのヘッドレスWordPressテンプレートです。 バックエンドにヘッドレスWordPress、フロントエンドにNext.jsというアイデアに基づいて構築されたそうで、WordPress REST APIでデータを取得し、Next.jsでフロントエンドをレンダリングするような構成となっています。

ノーコードで簡単なアンケートフォームを作成、公開、管理できるオープンソースのWebアプリ・「FormsLab」

FormsLabはノーコードで簡単なアンケートフォームを作成、公開、管理できるオープンソースのWebアプリです。簡単なアンケートや評価、簡易フィードバックなど、いわゆるサーベイツールとなっており、ノーコードでアンケートを作成、公開、結果を管理画面で確認、グラフ化するというもの。

URLにパラメーターを加えて任意のチャートを画像で生成できるOSS・「InstaChart」

InstaChartはURLにパラメーターを加えて任意のチャートを画像で生成できるOSSです。APIを使って円や棒、ドーナツやパイ、線やレーダーなどのチャートを画像で生成できる、というものになります。

フロントエンド開発者向けのTipsを紹介する動画を収集、閲覧できる・「Front Tips」

Front Tipsはフロントエンド開発者向けのTipsを紹介する動画を収集、閲覧できるWebサイトです。動画Tipsはタイパ的には劣りますが見れば理解できるようなものが多いので確実に理解するには動画は良い選択だと思います。

Webサイトの送信フォームをフレームワーク等に依存せず簡単に設置出来るようにするためのOSS・「formie」

formieはWebサイトの送信フォームをフレームワーク等に依存せず簡単に設置出来るようにするためのOSSです。Zero setup form backend(フォームのバックエンドの設定は不要)を謳っており、バックエンド、API、ダッシュボード、メールサービスの機能を果たしてくれます。

React Native製アプリの動的UIを作成するためのOSS・「Design Blocks」

Design BlocksはReact Native製アプリの動的UIを作成するためのOSSです。開発者のエクスペリエンスを重視して開発されたもので、極力学習コストを掛けず、よりアプリ開発に集中できる事をゴールにしているそうです。

有料、無料の様々な人気アプリやツール等の代替となるOSSを探せる・「osssoftware.org」

osssoftware.orgは有料、無料の様々な人気アプリやツール等の代替となるOSSを探せるWebサイトです。沢山のカテゴリから探したりフリーキーワードで検索したり、元の人気アプリの名前から代替OSSを探す事も可能です。

Tailwind.cssの様々なUIコンポーネントのデザインサンプルを大量に公開している・「Tailwind CSS Components」

Tailwind CSS ComponentsはTailwind.cssの様々なUIコンポーネントのデザインサンプルを大量に公開しているプロジェクトサイトです。プロジェクトサイトでは特に何か機能がある訳ではなく、純粋にCSSスタイリングのサンプルを表示しているのみで、ソースコードはGithubで公開しています。

スラッシュコマンドも利用可能な、ブラウザ拡張で提供されたミニマルなOSSノートアプリ・「SnapNote」

SnapNoteはスラッシュコマンドも利用可能な、ブラウザ拡張で提供されたミニマルなOSSノートアプリです。透明性、利便性、そして最も重要視した速度性を目標に開発されており、その点でNotionやObsidianとは別のアプローチとして提供されています。

Vue.js開発者向けのオープンソースのプロトタイピングツール・「PreVue」

PreVueはVue.js開発者向けのオープンソースのプロトタイピングツールです。CI/CDパイプラインにおける共通の課題である、デザイナーとデベロッパー間の遅延を解決するために開発されました。

ドラッグ&ドロップでレスポンシブ対応のメールを作成出来るオープンソースのNext.jsベースなノーコードアプリ・「Email Editor」

Email Editorはドラッグ&ドロップでレスポンシブ対応のメールを作成出来るオープンソースのNext.jsベースなノーコードアプリです。よくある一般的なノーコードメールエディターで、ブロックを追加して要素を足していく、というもの。

Next.js等の代替となるオープンソースのフロントエンドフレームワーク・「Nue」

Nueはオープンソースのフロントエンドフレームワーク/静的サイトジェネレーターです。Next.jsおよびAstroの代替手段となるよう開発されています。

Vue.jsでフォームを開発するためのオープンソースのフレームワーク・「Vueform」

VueformはVue.jsでフォームを開発するためのオープンソースのフレームワークです。フォーム要素は基本的に全てサポート、ノーコードツールも用意されています。

再利用可能でスケーラブルなデザインシステムを構築するためのヘッドレスUIライブラリ・「Ark UI」

Ark UIは再利用可能でスケーラブルなデザインシステムを構築するためのヘッドレスUIライブラリです。ReactやVueの他、Solidもサポート、更に今後はSveteのサポートも予定しているそうです。

様々なオンラインのコンテンツを収集、保存、管理しやすいよう設計されたオープンソースのブックマークツール・「InfoHarvest」

InfoHarvestは様々なオンラインのコンテンツを収集、保存、管理しやすいよう設計されたオープンソースのブックマークツールです。Next.jsとDaisyUIで構築されておりバックエンドは不要、MITライセンスの元でソースコードが公開されています。
Ads