Page: 7 / 105

スクリーンショット 2024-08-31 10.12.42

JavaScriptReactremix

GravatarとRemixでプロフィール画像や自己紹介文を集約管理する

この記事では、Gravatarを使用してプロフィール情報や画像を効率的に管理する方法が紹介されています。Gravatarに登録したデータをREST APIで取得したり、Remixアプリで利用する方法が解説されています。APIを活用した情報取得やプロフィール構築の手順が詳細に説明されており、新しい挑戦に向けた展望も示されています。Gravatarを活用することで情報管理や更新作業が容易になり、他のサイトへの切り替えも検討されています。

Okamoto Hidetaka

AI / MLLLMSaaS / FaaS

生成AIを使ってウェブアプリを作ってみた( lovable編 )

この記事では、生成AIを使ったアプリ開発の手法を紹介しています。Lovableを使用すると、ノーコードでアプリを作成し、GitHubやGoogleアカウントで無料で試すことができます。テンプレートを活用することで簡単にアプリをセットアップでき、生成されたアプリはSupabaseやGitHubと連携して公開できます。日本語にも対応したモデルを使用し、ReactやShadcnを使ったアプリ開発が可能です。生成AIを活用した手法を試してみる価値があります。

Okamoto Hidetaka

AngularAWSIonic

Ionic AngularアプリケーションをAWS Amplify( Gen2 )へデプロイする

この記事は、AWS Amplify ( Gen2 )でIonic Frameworkを利用したAngularアプリケーションをデプロイする方法を紹介しています。「AWS Community Builders Advent Calendar 2024」の9日目記事で、Ionic Frameworkで構築したウェブアプリケーションをAWS Amplifyでホストする手順やAmplify CLIコマンドの使い方などが詳細に説明されています。記事では、Angularを選択し、Amplifyのセットアップからデプロイまでの流れが解説されています。AWS AmplifyやIonic Frameworkの公式ドキュメントも参考にされています。

Okamoto Hidetaka

AI / MLDifyLLM

Difyのワークフロー機能（ベータ）を触ってみた

この記事では、Difyのベータ版提供中のワークフロー機能について紹介しています。Difyはノーコードで生成AIを使ったアプリケーションを作成できるオープンソースプロダクトで、AWSやローカルマシン、マネージド版の利用も可能です。ワークフローを作成する際はビジュアルエディタを使用し、ブロックを追加して線で接続することで処理を設計できます。複数ステップや条件分岐も可能で、作成したアプリはAPIやブラウザから利用できます。

Okamoto Hidetaka

CloudflareLINE

Cloudflare ZarazでWordPressサイトにLINE Tagのトラッキングコードを追加する

この記事では、Cloudflare Zarazを使用してLINEのトラッキングタグ（LINE Tag）をWebサイトに追加する方法が紹介されています。LINE TagはLINE公式アカウント向けのトラッキングタグで、Webサイトからの流入やコンバージョンを測定するのに活用されます。WordPressサイトを変更せずにトラッキングコードを追加することが目指され、Cloudflare Zarazを使用することでCDNエッジからコードを挿入します。料金や無料枠の管理には注意が必要です。

Okamoto Hidetaka

Next.js

Next.js App Routerでshadcn/uiのセットアップが失敗した時に読む記事

この記事では、Next.jsアプリケーションにshadcn/uiを追加する際に発生したエラーとその対処方法について紹介しています。Reactのdependencyの解決で問題が発生し、npm config set legacy-peer-deps trueコマンドを実行することで解決できることがわかりました。また、追加したファイルが原因でエラーが起きる場合もあるため、components.jsonファイルを削除してから再度実行する必要があることも記載されています。

Okamoto Hidetaka

AI / MLLLM

Amazon Bedrockの管理画面で、モデルの比較を行う

この記事では、AWSマネージメントコンソールを使用して複数の生成AIモデルを比較する方法が紹介されています。モデル選定はアプリ開発において重要なステップであり、Amazon Bedrockを使用することで簡単に比較検証が可能です。モデル間の生成結果・精度・入出力のバリエーションを確認できるだけでなく、テキスト生成結果やトークン数、生成時間などを比較することもできます。将来的にはEmbeddingなど他の機能も比較できるようになることが期待されています。

Okamoto Hidetaka

JavaScriptNext.jsReact

Next.js のApp RouterでREST APIを作る時は、型定義にPromiseをお忘れなく

この記事では、Next.jsのApp Routerを使用してREST APIを作成する際のTypeScript型定義に関するTipsが紹介されています。パスパラメータを受け取るAPIを想定し、v15以降でのビルドエラー回避方法やコードの変更点が説明されています。Page RouterやRemixに慣れている人も戸惑うかもしれないが、理解すれば問題ない内容です。

Okamoto Hidetaka

AI / MLLLM

生成AIを使ってオープンデータを活用したWebアプリを作ってみた話

この記事では、オープンデータを活用したアプリの企画や雛形作成に生成AIを使用。京都市の地下鉄の最終電車発車時間を表示するシンプルなアプリをNext.jsで実装し、AWS Amplifyにホスト。Claudeを使用してオープンデータからアプリの企画を考え、データ変換スクリプトやビルドに関する課題に取り組んだ。生成AIのコードレビューや仕上げ作業で自身の知識や経験が必要であることを振り返り、今後は通知機能などの追加を検討している。

Okamoto Hidetaka

AI / MLLLM

Claude 3 (Opus)で公開しているライブラリの説明文を作らせてみた（パッケージ編）

この記事では、Claudeを使って複数ディレクトリ・ファイルで構成されたアプリケーションやライブラリについて説明できるAIチャットを作る仕組みを検討した記録が紹介されています。目標はGitHubリポジトリに関する質問に回答できる仕組みを作ることで、RAGでプロンプトに挿入する最適なテキストを検討しました。AWS Lambda関数でAPIGatewayのレスポンスを構築するためのライブラリ群について詳細な説明があります。

Okamoto Hidetaka
Home
Search
Bookmark