株式会社wesionaryTEAM

「共創があたりまえの社会へ」を目指し、効果的なプロダクト開発と最適なプロセス構築に取り…

株式会社wesionaryTEAM

「共創があたりまえの社会へ」を目指し、効果的なプロダクト開発と最適なプロセス構築に取り組んでいます。株式会社wesionaryTEAMの公式noteです。共創によるプロダクト開発に取り組む企業様や、私たちのビジョンの実現に力を貸してくださる方に、弊社の考えや取り組みを紹介します。

最近の記事

HTMLタグの正しい使い方で、ユーザー体験とSEO効果を向上: セマンティックHTMLを解説

ウェブ開発やSEOの分野に関わっているなら、「セマンティックHTML」という用語を耳にしたことがあるでしょう。この記事では、セマンティックHTMLは何を意味し、なぜユーザー体験やSEOにとって重要かを解説します。 セマンティックHTMLとは?セマンティックHTMLとは、要素やタグがコンテンツの意味と構造を伝えるコーディングアプローチです。単にコンテンツを表示するだけでなく、その目的をブラウザや検索エンジンにより正確に伝えることが重要です。 例えば、<header>、<ar

    • GitHub Actions と Terraform で EC2 インスタンスを自動的に作成

      この記事では、GitHubアクションでTerraformスクリプトを実行する方法を説明します。 前提条件: AWSアカウント S3バケット AWSアクセスキーとシークレットキー Terraformインストール GitHubリポジトリ GitHub Action は、OSがインストールされた一時的な仮想環境を提供します。この環境にAWSプロファイルを設定します。 provider "aws" { region = "ap-northeast-1" prof

      • Goで簡単に実装!パスワード付きZIPでデータ保護を強化

        この記事では、Goでパスワード保護されたZIPファイルを作成する方法をご紹介します。具体的には、ユーザーがファイルをアップロードし、サーバー側でそれを ZIP ファイルに圧縮する実装をみていきます。 ファイルアップロード:ユーザーがファイルをアップロード Goを使用したファイル圧縮:Goライブラリを使用してファイルをZIP形式に圧縮 パスワード保護の追加:機密データを保護するため、ZIPファイルにパスワードを設定 前提条件Goは標準ライブラリを通じてZIPファイルの作

        • Go-Gin の開発とデバッグをDockerで効率化

          ローカル環境をコンテナ化することには、実行環境と非常に近い環境でシステムを開発できる利点があります。これにより、「自分のPCでは動作するが開発環境や本番環境では動作しない」といった問題のほとんどが解決されます。 この記事では、Go-Gin 開発におけるデバッグとライブリロードを可能にする方法について説明します。他の開発環境にも同様に適用できると思います。 Go の docker コンテナでデバッグ機能とコードリロード機能を探していましたが、ニーズに合うものが見つかりません

        HTMLタグの正しい使い方で、ユーザー体験とSEO効果を向上: セマンティックHTMLを解説

          Flutterでユーザー体験を考慮した権限リクエストの実装方法を解説

          アプリを開発する際、カメラやマイクなどのデバイス機能にアクセスする必要がしばしば生じます。しかし、ユーザーのプライバシーとセキュリティを確保するため、Android や iOS は、これらの機能にアクセスする前にアプリに権限を要求することを義務付けています。 この記事では、Flutter で連続的な権限リクエストをスムーズに、ユーザーフレンドリーに処理する方法について説明します。 まず、Flutterプロジェクトに「permission_handler」パッケージを追加し

          Flutterでユーザー体験を考慮した権限リクエストの実装方法を解説

          AWSアカウント間での EC2・RDS・S3 の移行手順を解説

          この記事では、EC2インスタンス、RDS、S3 を別のアカウントに移行する手順を説明します。 1. AMI(Amazon Machine Image)の作成: ソースアカウントのAWS管理コンソールにログイン EC2ダッシュボードに移動 転送したいEC2インスタンスを選択 アクション > イメージとテンプレート > イメージの作成を選択 AMIの詳細を入力し、作成する 2. AMIの共有: AMI が作成されたら、EC2ダッシュボードのAMIに移動 作成した

          AWSアカウント間での EC2・RDS・S3 の移行手順を解説

          フロントエンドのテスト自動化 Tips: Cypress と XPath による効率的な要素選択

          品質保証の重要な要素の1つが自動テストです。自動テストは、アプリケーションの信頼性と安定性を確保するのに役立ちます。利用可能な多数のテストツール/フレームワークがありますが、その中でも Cypress は、その簡潔さと効果的な機能により、人気を獲得しています。 自動テストにおいて要素の位置を効率よく安定的に特定できるようにする必要があります。要素を特定する際、XPath と CSS セレクターが中心的な役割を果たします。 本記事では、Cypress における XPath

          フロントエンドのテスト自動化 Tips: Cypress と XPath による効率的な要素選択

          ビルド時間短縮とCI/CD導入で効率的なデプロイを実現する方法

          この記事では、Monorepo 構成の React アプリを Firebase ホスティングにデプロイし、ターゲットを使用して各パッケージを異なるサイトにホストする方法を探ります。 この記事は Monorepo を対象に書いていますが、設定に若干の変更することで、モノリシックなリポジトリにも適用できます。 さらに、GitHub actionsを使用してCI/CD(継続的インテグレーション/継続的デプロイメント)パイプラインを設定し、プロセスを自動化します。簡単にするため、

          ビルド時間短縮とCI/CD導入で効率的なデプロイを実現する方法

          GCPストレージバケットのCORS設定方法:セキュリティと柔軟性の向上

          クロスオリジンリソース共有(CORS)は、WebブラウザがアクセスできるようにするためにAPIに適用されるセキュリティ対策です。CORSはサーバーのセキュリティを緩和する最も一般的な方法の1つです。CORSを使用すると、サーバー側でエンドポイントにアクセスできる対象を指定できます。 *クロスオリジンリソース共有により、通常は悪意のある行動を防ぐために禁止されている、異なるオリジン間のリソースの相互作用が可能になります。*今回は、GCP(Google Cloud Platfor

          GCPストレージバケットのCORS設定方法:セキュリティと柔軟性の向上

          Flutter開発者向け:Riverpodによる効率的な状態管理手法

          状態管理は、Webやモバイルアプリケーションを開発する上で、アプリケーションビューを管理するために不可欠です。これは、1つ以上のユーザーインターフェース(UI)コントロールの状態を制御するプロセスです。UIコントロールには、テキストフィールド、ラジオボタン、チェックボックス、ドロップダウン、トグル、フォームなど、多くの種類があります。 Flutterアプリケーションには多くの状態管理ソリューションライブラリが存在しますが、この記事はすべてのFlutter開発者に向けて、知識を

          Flutter開発者向け:Riverpodによる効率的な状態管理手法

          キャッシュ機能の導入方法:Flutterアプリのパフォーマンス向上

          キャッシュは、アプリケーションに必要な重要な機能の1つです。インターネット接続や携帯データ通信なしでユーザーがアプリと対話する必要がある場合があります。そのような場合、キャッシュが非常に役立ちます。キャッシュとは、ユーザーデータを一時的に保存することです。データをローカルに保存するため非常に高速ですが、保存できるデータ量は限られています。以下の5つのステップで、アプリにキャッシュ機能を実装できます: ステップ1: プロジェクト環境のセットアップ パッケージをインストールす

          キャッシュ機能の導入方法:Flutterアプリのパフォーマンス向上

          TurborepoでNext.jsプロジェクトを最適化し、Chakra UIとTailwindCSSをスムーズに統合する方法

          皆様、こんにちは👋。このチュートリアルでは、Turborepoを使用してモノレポを構築し、Next.jsプロジェクトを追加して、Chakra UIとTailwindCSSを統合します。さらに、共有のTS、ESLint、Husky pre-commitsの設定も行います。 概要:TurborepoモノレポにNext.jsアプリケーションをセットアップする。 TailwindCSSをセットアップする。 共有のTypeScript設定、ESLint設定、Husky pre-c

          TurborepoでNext.jsプロジェクトを最適化し、Chakra UIとTailwindCSSをスムーズに統合する方法

          Golangのコンテキスト活用法:並行プログラミングを制御する方法

          コンテキスト: これはGoの標準ライブラリの中でも特に好まれるパッケージの一つであり、エレガントで強力、そして優れた記述と十分な文書化がなされています。しかし、多くのGo言語初心者プログラマーは、私も初期段階で経験したように、これを少し混乱させるものと感じています。そこで、数分で疑問を解消できる記事を執筆しようと考えました。 シナリオI 友人が自宅に来訪し、チーズバーガーを食べたいと申し出ます。つまり、あなたは暗黙的にバーガーを調理する任務を与えられたことになります。そこで

          Golangのコンテキスト活用法:並行プログラミングを制御する方法

          優先度を考慮したDjango検索APIの効率的な実装方法

          この記事では、特定のフィールドに優先度を設定して検索結果を取得する簡単な方法を紹介します。データベースの複数のカラムに対して検索オプションを提供する必要がある場合が多々あります。 実際の問題について少し説明します: 例えば、商品を表す簡単なeコマースモデルがあるとします。 from django.db import modelsclass Product(models.Model): title = models.CharField(max_length=50)

          優先度を考慮したDjango検索APIの効率的な実装方法

          本番環境用Djangoアプリケーションの準備:主要な考慮事項とベストプラクティス

          本番環境対応のアプリケーションとは、開発され、ライブの本番環境にデプロイされ使用される準備が整ったプロジェクトを指します。これは、アプリケーションが安定性、セキュリティ、スケーラビリティ、およびパフォーマンスを確保するための厳格な開発、テスト、最適化プロセスを経ていることを意味します。 この記事では、本番環境対応のDjangoアプリケーションに必要な考慮事項について議論します。それでは、詳細に入っていきましょう。 関心の分離またはデカップリングこの原則は、システムの異なる側

          本番環境用Djangoアプリケーションの準備:主要な考慮事項とベストプラクティス

          AWS-Amplify認証を活用した安全なAxiosリクエスト管理方法

          はじめに:Axiosは、Node.jsサーバーとブラウザの両方で動作するプロミスベースのHTTPクライアントです。Reactサーバーコンポーネントの広範な採用により、APIリクエストの実行は少し複雑になり、リクエストが行われるコンポーネントの種類(サーバーコンポーネントかクライアントコンポーネントか)に依存します。また、リクエストとレスポンスのインターセプターを作成することで、レスポンスやリクエストのカスタマイズ、エラー管理などのAxiosの特性が強化され、リクエストの集中制

          AWS-Amplify認証を活用した安全なAxiosリクエスト管理方法