Tech Magazine

本

プラスジャムの開発者が、いろんな技術やツールを試してみた成果を綴るマガジンです。誰かのお役に立てば幸いです。

運営しているクリエイター: Web制作プラスジャムのなかやすみ

#テックブログ

【Larastan】Laravelプロジェクトのコードの品質を向上

はじめにコードの品質を保つためほとんどの開発プロジェクトではコードレビューを実施していると思いますが、型定義のミスなどわかりやすい部分はともかく、エラーに繋がるような実装ミスを見逃してしまうこともあると思います。静的解析は、コードの実行前にエラーや警告を検出するための効果的なツールです。Laravelのプロジェクトでは、PHPStanをベースにしたLarastanを使用することで、より厳密なコードチェックを行い、バグの予防やコード品質の向上を図ることができます。この記事で

BitbucketのプルリクにWebhookを設定してGASと連携

はじめに今回の記事ではBitbucketのWebhookを使って、プルリクが作成された際にスプレッドシートに情報を吐き出していく方法を共有します。開発生産性の文脈でよく挙げられる指標の一つとしてプルリク数があります。Four Keysやその他指標の可視化・分析を行うサービスも存在しますが、こういったサービスを導入する前に一旦現状を把握したい場合などに活用してもらえれば幸いです。まずはWebhookを受け取るGASを作成し、BitbucketでGASとのWebhook連携の

【Laravel】AsanaAPIでタスク管理

はじめに今回はLaravelとAsanaAPIを使って、Asanaのプロジェクト内のタスクを管理（取得、作成、削除）する方法を紹介します。なお本記事ではAsanaAPIの機能紹介をメインとするため、エラーハンドリングなどは実装していませんのでご注意ください。バージョン情報 Asana側でアクセストークンは取得済みであることを前提に進めます。もしトークンの取得方法などAPI関連で不明点があればこちらをご参照ください。 https://help.asana.com/hc

Draft Modeを活用した画面プレビューの作成

こんにちは、エンジニアのカネコです。本日は、Next.js(App Router)の新機能、Draft Modeを使って、microCMSのドラフトコンテンツを動的にプレビューする方法についてご紹介します。この機能を活用することで、開発中のコンテンツをリアルタイムで確認しながら、公開後は高速に静的ページを提供することが可能になります。この記事では、具体的な実装手順から、実際に開発する際の注意点まで詳しく解説します。このシーケンス図は、Next.jsのDraft Mo

Deployment Protectionのすすめ

こんにちは、フロントエンドエンジニアのカネコです。 web開発の世界では、デプロイメント環境のセキュリティは非常に重要です。スタートアップであれ大企業であれ、セキュリティ侵害は重大な損害とコストをもたらす可能性があります。 Vercelは、このようなリスクを軽減するために「Deployment Protection」機能を提供しています。2022年12月19日に導入されました。この記事では、VercelのDeployment Protectionがどのように機能するか、そし

【OpenAPI】Prismでモックサーバーを構築

はじめに今回はOpenAPIの仕様をもとに簡単にモックサーバーを構築できるPrismを試してみます。以前、Visual Studio CodeにOpenAPI (Swagger) Editorを入れてYAMLを書く記事を公開しましたが、実際のプロジェクトではモックサーバーが必要になるケースが多いはずなので参考にしてみてください。この記事ではテスト用のAPIの用意とPrismのインストール、動作確認まで行います。バージョン情報テスト用のAPI今回は動作確認のため、

Fuse.jsで爆速検索を手に入れろ

こんにちは、フロントエンドエンジニアのカネコです。日々の開発業務の中で、UI/UXの向上にも注力しています。今回は、Webサイトにおけるユーザー体験の重要な一環である「検索機能」に焦点を当て、その実装にFuse.js(https://www.fusejs.io/)という強力なライブラリをご紹介したいと思います。 Fuse.jsの導入 Fuse.jsをプロジェクトに導入する最初のステップは、npmを使用してパッケージをインストールすることです。コマンドラインで以下のコマ