Page: 9 / 105

0bf29236559118e0968d11727f49991c-20240827094319

JavaScriptTypeScript

TypeScriptで条件別に必須パラメーターを変更する方法

この記事では、Reactコンポーネントでの引数に型定義を行う際に、特定のパラメータの有無で必須となるパラメータを設定する方法を簡単にまとめています。

Okamoto Hidetaka

CloudflarePythonSaaS / FaaS

PythonアプリケーションをCloudflare Workersにデプロイしてみた

この記事は、PythonアプリケーションをWranglerでCloudflare Workersへデプロイする方法や注意点をまとめた記事です。利用できるライブラリの制限などが2024/10時点ではある様子なので、試される方はそこにご注意ください。

Okamoto Hidetaka

AngularJavaScript

AngularのスタンドアローンコンポーネントでHttpClientを使いたい時の覚書

Angularのスタンドアローンコンポーネントに関する記事で、モジュールのインポート方法の変更や過去の方法の利用などが紹介されています。@NgModuleディレクティブの問題やHttpClientModuleの非推奨メッセージに触れ、provideHttpClient()を使ってHttpClientをセットアップする方法も説明されています。NgModuleディレクティブが必要ないコンポーネントやbootstrapApplication関数を使用してのセットアップ方法も詳細に記載されています。

Okamoto Hidetaka

CloudflareSaaS / FaaS

Cloudflare PagesでPHPを対象にしたリクエストをブロックする

この記事では、Cloudflare Pagesの設定を使って任意のパスに対するリクエストをブロックする方法が紹介されています。具体的には、_routes.jsonファイルを使用して特定のパスを除外する設定を行い、不正なリクエストを防ぐ手順が詳細に述べられています。設定後には、cUrlを使用して変更が正常に動作するかをテストし、注意点やリスクについても言及されています。

Okamoto Hidetaka

AngularAWSAWS CDK

AWS Amplify ( Gen2 )でAngularアプリをホストするなら、ビルド設定に要注意

この記事では、AWS Amplifyを使用してAngularアプリをホスト・デプロイする際の注意点や設定箇所について紹介されています。AWS AmplifyはGitリポジトリからビルド＆デプロイできるため、簡単にウェブアプリケーションを公開できます。ただし、Node.jsのバージョンに注意が必要で、設定画面で変更することができます。また、AWS Amplifyの詳細設定にはNode.js以外のツールのバージョン指定もできるため、注意が必要です。

Okamoto Hidetaka

AWSAWS CDK

AWS CDKでLambdaのログフォーマットをJSONにする

AWS LambdaがCloudWatch Logsに出力するログのフォーマットをJSONに変更可能になりました。CDKを使用してlambda.Functionを作成する際にloggingFormatパラメータを追加することで設定できます。Node.jsアプリの場合もaws_lambda_nodejsを使用し、loggingFormatを設定可能です。ログフォーマットをJSONに変更することで、CloudWatch Logsの設定やJSONデータの取り扱いが容易になります。

Okamoto Hidetaka

remix

ClerkをRemixで使う際に、rootLoaderでClerk以外の処理も走らせる方法の覚書

ClerkのRemixアダプターは、デフォルトでは特定の方法でしかrootのLoaderを使えないが、他の処理と併用する方法がある。例えば、記事カテゴリ一覧を表示するために、WP APIを使用することができる。rootAuthLoaderはPromise形式でResponseオブジェクトを返すので、それに合わせてloaderを作成することができる。loader作成時には、rootAuthLoaderにClerkのPublishable Keyを渡すことが重要であり、またJSON形式で返す必要がある。

Okamoto Hidetaka

Reactremix

Remixでroot.tsxにClerkのUI Componentを使いたい

提供されたUI Componentをレイアウト要素で使用する際の覚書。Remixを使用する場合、app/route.tsxにコンポーネントを配置。ヘッダーナビゲーションコンポーネント内にログインやログアウトボタンを配置したいが、エラーが発生。ClerkProviderの外でUI Componentを使うことがエラーの原因。Layout要素をProviderの内側に配置すると問題解消。ただし、キャッシュとSSRに関して懸念があり、Cloudflareのレポートを参考に検証を行う予定。

Okamoto Hidetaka
1adde6671de223e93300c82596bc1275-20241001084709

AI / MLLLMProductsPython

Google Colaboratoryでセッション動画から、YouTubeやサイトに掲載する文章を生成する

DevRelとして企画運営に携わるJP_Stripesコミュニティでは、登壇者のセッションを動画アーカイブ化しており、Google ColaboratoryとWhisperを使用して動画の説明文やコミュニティウェブサイトの文章作成を行っています。動画のアーカイブ化により、過去のセッション内容の理解を深める取り組みをしており、Shifterを用いてウェブサイトの保守時間を短縮しています。文字起こしや動画紹介文章の生成を自動化するためにWhisperやClaude 3.5 Sonnetを活用しています。

Okamoto Hidetaka

CloudflareremixStripeSupabaseサイト制作覚書

10年続いているHeadless WordPressサイトのフロントをリニューアルしたので振り返り

. 今回のリニューアルでは、インフラ環境やフレームワークの変更など、大幅な刷新が行われました。WordPressをHeadless WordPressとして利用しているため、一般的なWordPressサイトと異なる点に注意が必要です。SaaSを組み合わせた複数のサービス構成に変更し、生成系AIやStripeなど新たなサービスも導入されました。技術選定ではRemixに置き換えたり、Clerkに認証系を変更するなど、サービスの導入や切り替えが行われました。今後は生成系AIの改善や広告管理、キャッシュコントロールの調整などが課題として挙げられます。.

Okamoto Hidetaka
Home
Search
Bookmark