技術ブログまとめ|サイオステクノロジー(Tech.Lab)のイベント・技術情報 - TECH PLAY[テックプレイ]

サイオステクノロジー(Tech.Lab) の技術ブログ

React Router v7のブラウザ開発環境でMSWを利用する方法

こんにちは、サイオステクノロジーの遠藤です。 今回は、React Route v7のブラウザ開発環境でMSWを利用する方法について自分で導入するときに少しハマったので、備忘録的な形でまとめておこうと思います。 では始めていきましょう。 React Routerアプリを作成 まずは、React Routeのアプリを作成します。v7からviteで作成できるようになったのでviteを利用して作成しました。 ❯

React Router v7のルーティング方法 Configuring Routes を整理する

こんにちは、サイオステクノロジーの遠藤です。 今回は、WebフレームワークであるRemixとルーティングライブラリであるReact Routerが統合されたReact Router v7のルーティングについてまとめていきます。 ルーティング方法 React Router v7では、Configuring Routes、Component Routes、File Route Conventionsの3種類のルーティング方法があります。 Configuring Routes React Router v7のデフォルトで設定

【保存版】GASでAzure OpenAI APIを使いこなす!基本から並列処理まで

挨拶 最近は、「 Dify入門シリーズ 」の検証+執筆にいそしんでいる龍ちゃんです。応用的ステップとして、GASで本格運用する業務アプリの開発などもやっていました。こちらの業務アプリでは、DifyのAPIを叩くわけでなく、Azure OpenAI Service(AOAI)のREST APIで生成AIを実行しています。 今回は、参照用のサンプルコードとして「プロパティサービスを活用してアクセスキーな

OpenShift Virtualization 構築してみた

概要 こちらの記事 では既存のOpenShift上でコンテナとVMを統合管理することが出来るOpenShift Virtualization(以降、OCP-Virt)ついて紹介しました。 本記事では、実際にAWS環境のOpenShift上でOCP-Virtを構築し、簡単なVMの作成と外部公開を行ってみたいと思います。 次回の記事では、同じ仮想化基盤であるSUSE VIrtualizationの紹介をします。 前提条件 構築時の前提条件を以下に記載し

Geminiを使ってみた感想:Gemini × Google Workspace

こんにちは、 サイオステクノロジー の織田です。 最近CMでよく見る話題の生成AI、 Gemini を使ってみました!今回は、実際に使ってみた感想をブログ形式でまとめてみます。 Geminiとは? Geminiは、Google Workspaceに組み込まれた生成AI機能です。Gmail、Docs、SpreadSheetなど、普段使い慣れたアプリでAIの力を活用できるのが特徴です。同じ生成AIツールですとChatGPTがありますが、

コンポーネント「ライブラリ」ではなく「コレクション」?shadcn/uiに入門してみた

こんにちは、サイオステクノロジーの遠藤です。 今回は、 JavaScript Rising Stars で2023年、2024年と二年連続で1位に輝いたUIコンポーネントコレクションであるshadcn/uiについてまとめていきます。 では始めていきましょう! shadcn/uiとは? shadcn/uiはRadix UIとTailwindCSSを用いて作成されたUIコンポーネントコレクションです。 shadcn/uiの一番の特徴は公式ドキュメントにも This is not

【2025年2月】OSSサポートエンジニアが気になった!OSS最新ニュース

こんにちは! 今月も「OSSのサポートエンジニアが気になった!OSSの最新ニュース」をお届けします。 2025/2/6、The Linux Foundation Japan が SBOM の利用について解説した資料の日本語版である「SPDX 3.0を用いたAI部品表(AI BOM)の実装」を公開しました。 The Linux Foundation、AI部品表「AI BOM」の日本語資料を公開 https://japan.zdnet.com/article/35229116/ 生成 AI 技術「DeekSeek」のセキュリティ面

知っておくとちょっと便利!logrotate の仕組みについて2

今号では、前回紹介しきれなかったログローテーションの設定について、もう少し深堀りして見ていきます! 設定ファイルに設定可能な情報 前回、デフォルトの設定からどのような設定項目があるかを見ていきました。 今回は、それ以外にどのような設定があるのか、よく使用されると考えられる設定項目からピックアップして解説します。 ローテートの頻度 – dail

【GAS】Difyプロトタイプを本格業務アプリに!実践的な自動化

今回は、以前Difyで作成したプロトタイプ「 Dify入門ガイド:X投稿を自動生成!10分で作るブログPR効率化ワークフロー 」をGASと Azure OpenAI Service で業務アプリとして作成しました。Difyで作成したプロトタイプから、普段使いしやすいように業務アプリ化する具体的な流れについて解説していきます。 Dify版プロトタイプ プロトタイプについては、「 Dify入門ガイド:X投稿を

日本語の打鍵効率を上げる! 拡張ローマ字入力AZIKのご紹介

こんにちは、サイオステクノロジーの遠藤です。 最近はブログ執筆に精力的に取り組んでおり、キーボードでたくさんの日本語を打ち込んでいます。日本語を入力する機会が多い方なら入力効率をあげる方法はないかな?と考えたこともあると思います。 今回はそんな方におすすめな、一般的な配列を乱さず打鍵効率を上げてくれる拡張ローマ字入力AZIKをご紹介します

【2025年版】Notion AIプロンプト改善|タイトル&メタディスクリプション

今回は、「 実体験:Notion AIでブログ執筆が楽になる!3つの使い方をふんわり解説 」で紹介したタイトルとメタディスクリプション作成プロンプトを改善しました。プロンプトの紹介をしつつ、プロンプト作成の方法について紹介していきます。 プロンプト紹介 前回のプロンプトでは、タイトルとメタディスクリプションを同時に作成していました。プロンプトをより特

企業のDXを支えるコンテナプラットフォームに求められる重要なポイント解説

はじめに 近年、コンテナ技術は企業のITインフラにおいて不可欠な存在となりました。 アプリケーションの開発・運用をスムーズにする一方で、適切に管理しなければスケールやセキュリティの課題が発生します。 前回の記事でコンテナプラットフォームの概要として紹介した代表的なものとして Red Hat OpenShift や SUSE Rancher などがあり、Kubernetesを基盤としながら、運用

[Web3] Opensea API を利用した NFT の情報取得

概要 こんにちは、サイオステクノロジーの安藤 浩です。 今回はOpenseaで提供されているAPIを利用して、アプリ開発をしていますので、Opensea のAPIについて紹介していきます。 OpenSeaは NFT マーケットプレイスで、そのサービスでAPIが提供されているので、APIで提供されている機能をAPIへリクエストしながらご紹介します。 提供されている Endpoints について 大きく分けて3分

GASコード付き:URLからHTML取得&圧縮する方法|AI入力の最適化に

Google Apps Script(GAS)でURLから不要なタグや改行を削除した圧縮したテキスト情報を取得する方法について解説します。 圧縮の処理は以下になります。 imgタグのalt情報の分離 HTMLタグの削除 空白の削除 URLからHTMLを取得して情報を圧縮する まずは、ソースコード全体を貼ります。こちらは「URLを引数として受け取り、HTML情報を取得し、特定のタグ情報内に含まれる情報を

デプロイ前のコントラクトアドレスを知りたい – CREATE2 Opecodeについて –

1. 初めに PS/SLの佐々木です。 最近ContractAddressがどのように導出されているのかが気になり調べていたところ、ContactAddressの導出方法は二つがあることを知りました。その中で事前にコントラクトアドレスを計算して、デプロイ前のコントラクトに対して送金できたり、署名を作成できたりと結構面白そうだったのでまとめてみました。 Ethereumのスマートコントラクトをデ