新入社員ブログ 斎藤06[PHPUnitデータプロバイダ]

25年度入社の斎藤です。

 以前、斎藤04[PHPUnitについて]のブログでは、以下のようにテスト対象のクラスメソッドに対して、1つのデータだけを使って、メソッドの動作を検証しました。

※addメソッドに対して、引数(2,3)の場合のみ検証

しかし、上記の結果で得られる検証結果は引数が(2,3)の場合は正常に機能するということしか保証できません。
実際のテストでは様々な入力を用いて多角的に検証していく必要があります。PHPUnitにはそのための便利な機能として、データプロバイダ(DataProvider)があります。今回は、そのデータプロバイダの使い方について簡単に説明していきます。

データプロバイダの作成・紐づけ

 今回は斎藤04[PHPUnitについて]のブログですでに作成したテストコード(Sample_Test.php)を流用し、これにコードを追記することでデータプロバイダを利用することにします。
データプロバイダによるテストの対象はaddメソッドとします。

Sample_Test.php(以前のブログで作成済み)



1.データプロバイダの参照を追加
まず、データプロバイダがテストコード内で利用できるように以下の参照をテストコードに追加します。

2.テストメソッドを引数をとるカタチに修正
前回はテストメソッド(test_add)内で、テスト対象のメソッドであるaddメソッドを呼び出し、その引数にデータ(2,3)を直接記述しました。

以前のテストメソッド(test_add)

今回は、このテストメソッドを以下のように修正することで、任意の入力でaddメソッドを検証できるようにします。

修正1: addメソッドの引数を変数に変更する
add(2,3) → add($var1,$var2)

修正2: アサーションメソッドの期待出力値を変数に変更する
assertEquals(5,$result) → assertEquals($expected,$result)

修正3: テストメソッドがこれらの変数を引数として受け取れるようにする
test_add() → test_add($var1,$var2,$expected)

これらの修正を加えるとテストメソッド(test_add)は以下のようになります

3.データプロバイダを作成する
データプロバイダはテストメソッドの引数に合わせるように作成していきます。データプロバイダはメソッドとして作成することができ、テストメソッドの直下に記述します。以下の例(SampleDataProvider)にあるように、データの組み合わせによってパターン名を付けることをができます。このパターン名はテスト実行時に表示されるので、どのパターンの認証が成功し、失敗したのか一目で分かります。

データプロバイダの例(SampleDataProvider)


今回のテストメソッド(test_add)は

第1引数($var1): 任意の整数
第2引数($var2): 任意の整数
第3引数($expected): $var1と$var2の合計

よって、データプロバイダに用いるデータの組み合わせは以下のようなものが考えられます。
[任意の整数,任意の整数,2つの整数の合計値]
= [1,1,2][2,2,4][0,0,0][-1,-2,-3]…..etc

今回はデータプロバイダを以下のように定義します。
メソッド名: additionDataProvider

4.テストメソッドとデータプロバイダを紐づける
テストメソッド(test_add)の1行上にピッタリと乗せるように、以下の記述を追加します。これによってテストメソッドとデータプロバイダが紐づけられます。

以上で、データプロバイダの追加は完了です。テストコード全体は以下のようになります。

以下のテストコマンドを実行します。

これで、データプロバイダで作成した3つのパターンのaddメソッドの検証と1つのパターンのsubメソッドの検証が行われ、全ての検証が正常に終了したことが分かります。

最後に

 データプロバイダを使えば、テストメソッドを検証のパターンごとに何個も記述せずに済むため、テストコードがかなりスッキリしてとても便利であると感じました。特に境界値テストなど、似たようなテストを複数実行したい場合に重宝すると思います。

以上で今回のお話をおわります。
ありがとうございました。

新入社員ブログ 斎藤05[タイトル]

25年度入社の斎藤です。

今回は、お昼休憩のときに利用している弊社近辺のご飯を紹介していこうと思います。

なか卯

 弊社のある建物から徒歩10秒のところにお店がありますので、お昼休憩で食べる外食の回数、圧倒的No.1です。いつも黄身の乗った親子丼を食べています。
他のものはまだ食べたことがありません。海鮮丼やウナギ、うどんそばなど様々なメニューをとりそろえていますが、迷った末に結局親子丼を頼みます。

なか卯 三田店
https://maps.nakau.co.jp/jp/detail/2327.html

町田商店

 弊社から徒歩5分の場所にお店があります。
入社前から大好きなラーメン屋だったので、入社してすぐに食べに行きました。会社の近くにあって嬉しい反面、頻繁に食べるとカロリーがヤバそうなので、我慢しなくてはいけないのが少しつらいです。
トッピングはいつもネギチャーシューかホウレンソウにしています。

町田商店 高輪ゲートウェイ店
https://shop.machidashoten.com/japan/detail/112103

バンブルビー カフェ

 [カフェタイム]14:00~17:00に訪れました。見た目もオシャレで味も大満足でした。特にパンケーキにふんだんに使用しているジャムがとても濃厚で美味しかったです。
飲み物はオレンジジュースやコーヒーなどがあり、飲み放題でした。店内の雰囲気も静かで落ち着いているのでとてもリラックスできます。
パンケーキは何種類かあるようなので、他のパンケーキにも挑戦したいです。
ランチタイムは11:30~14:00にあるそうで、その時間帯にはまだ訪れたことがないので、そちらも行ってみたいなと思っています。

BUMBLEBEE CAFE 東急ステイ高輪
https://retty.me/area/PRE13/ARE16/SUB1301/100001511154/

最後に

 今回は、私がお昼休みに利用しているご飯を紹介させていただきました。
高輪ゲートウェイ駅や田町駅周辺にも紹介したい魅力的なご飯がたくさんあるのですが、長くなってしまいそうなのでまた次回、他のブログで紹介させてください。

以上で今回のお話をおわります。
ありがとうございました。

新入社員ブログ 斎藤04[PHPUnitについて]

25年度入社の斎藤です。

 クラスやメソッド単位での動作を保証するために行う、単体テストというものがあります。今回は、テストコードを記述することで単体テストを自動化する機能をもつPHPUnitについて、Laravelのwebアプリケーションへの導入方法と使い方を簡単に説明しようと思います。

PHPUnitの導入方法

 Laravelを導入している場合、phpunitは標準でインストールされているため、特にインストール操作は必要ありません。

テストコードの作成

 PHPUnitでの単体テストは、テスト対象となるクラスとテストコードを1対1の関係で作成していきます。

Laravelプロジェクトフォルダ内で以下のコマンドを打つことで tests/units 配下に単体テストファイル(Sample_Test)を作成できます。

作成できたテストファイル tests/unit/Sample_Test.php にて以下のコード変更を行います。

※テストフォルダには、単体テストファイル用フォルダのtests/unit、結合テスト用のフォルダのtests/featureが存在します。unitフォルダ内に作成されるテストファイルは、厳密な単体テスト用のファイルとして作成されるため、デフォルトではLaravelが提供する外部依存機能機能(トランザクション、ファクトリー、シーダー、ファサード認証など)が使えません。しかし実用的には単体テストにおいても、これらのLaravelの機能を含めた単体テストを行うことがあるので、上記のコードの変更を行いました。

結果、以下のようなテストコード(Sample_Test.php)のひな型が作成できます。

Sample_Test.php

次にテスト対象として、足し算、引き算の機能を持つクラス(SampleClass.php)を作成します。

SampleClass.php

これで、テスト対象となるクラス(SampleClass.php)とテストコード(Sample_Test.php)のひな型を1対1で用意できました。最後に、テストコードを編集して、テスト対象のクラスをテストできるようにします。

テストコードファイル内で追記する主な内容は

1.テストクラス内に、テスト対象のクラスのオブジェクトを定義する
 テストクラスの中で使用するテスト対象のオブジェクトを、プロパティ(変数)として宣言します。


2.setUp関数を定義する
各テストメソッドが実行される前に毎回自動で呼ばれる特別なメソッドです。
ここでテスト対象のオブジェクトを作成します。
こうすることで、テストメソッドごとに毎回新しい状態のオブジェクトを使えるようになり、テスト同士が影響し合うのを防げます。
parent::setUp()は初期化処理を継承するために必須の記述です。


3.テスト対象のメソッドごとにテストメソッドを作成する(テストメソッド名は test….)
基本的に、テスト対象のメソッド1つに対して、テストメソッドも1つ作成します。
テストメソッドごとに、テスト対象の各メソッドをテストしていくイメージです。
実際のテスト内容をここに記述します。
テストメソッド名はテスト対象のメソッド名と対応させると分かりやすいです。


4.テストメソッド内で、テスト対象クラスのオブジェクトからメソッドを呼び出し実行する

setUpメソッドで作成したテスト対象のオブジェクトを使って、実際にテストしたいメソッドを呼び出します。


5.メソッドを呼び出した後、期待する結果を検証していく(assertion)

期待する結果と実際の結果が一致しているかを検証する手段として、assertion(アサーション)が用意されています。
具体例として
・予測値と実際の結果を比較するメソッド : assertEquals()
・trueかどうかを検証するメソッド : assertTrue()
・配列の数を検証するメソッド : assertCount()
などがあります。
これをテストメソッド内で利用していきます。

これら1~5の内容をテストコード(Sample_Test.php)に追加すると以下のようになります。

あとはテストコードを実行するだけでテストを行えます。
テスト実行コマンドは以下の通りです。

作成した全てのテストファイルを実行する場合

特定のテストファイルを実行する場合

テストコードを実行すると以下のような結果が得られます。
今回の二つのメソッド(add、sub)は想定通りに機能していることが確認できました。

最後に

 PHPUnitを学んで率直に感じたことは、テストコードを記述していくことはかなり労力がかかる作業であるということです。テスト対象のコードとテストコードを対にして記述していく必要があるため、単純計算で2倍程度のコードを記述することになります。小規模なシステムや修正があまり発生しないコードでは、この労力は割に合わないかもしれません。しかし、システムが大規模になり、複数人での開発や頻繁な変更が発生する環境では、自動テストによって迅速に品質を保証し続けられるメリットは大きいものなのだろうと思いました。

以上で今回の話をおわります。
ありがとうございました。

新入社員ブログ 斎藤03[Form Requestについて]

25年度入社の斎藤です。

 今回は、Laravelのバリデーション機能であるForm Requestについて、概要を簡単にまとめ、webアプリケーションへの具体的な導入方法について説明しようと思います。

Form Requestとは

 FormRequestとはLaravelの機能の一つで、フォームから送られてくるデータのバリデーション(検証)を専用のクラスで管理することができます。Form Requestには以下のメソッドが標準機能として存在します。

authrizeメソッド
バリデーションを行う前に、リクエストが認可(オーソライゼイション)されるかどうかを決定します。
return true : バリデーションに処理が進む
return false : バリデーションを行わず、403 Forbiddenを返しリクエストが拒否される

rulesメソッド
フォームデータに対する検証(バリデーション)ルールを定義します。
バリデーションが通らなければ、デフォルトでは直前の画面にリダイレクトされます。
バリデーションルール記述方法 : [ ‘form要素名’=>’ルール1|ルール2…’ ]
※ルール同士は | 記号で繋げる。また、初めのルールと最後のルールを記号で囲む

FormRequestクラスの作成

 Larvelプロジェクトフォルダにて、以下のコマンドでFormRequestクラスを継承した子クラス(今回の例ではSampleRequest)を作成します。
※○○Requestという名称にする
※ディレクトリで区切りたい場合は、クラス名指定を”ディレクトリ名/SampleRequest”とすればよい

以下のような、app/Http/Requests/SampleRequest.phpが作成されます。

今回の例では、SampleRequest内のauthrizeメソッド、rulesメソッドに対して以下のように設定します。

1.authrizeメソッドのリターンを常にtrueに変更
→リクエストが常に認可される

2.rulesメソッドにバリデーションルールを追加
フォームデータに対して以下の内容を検証する
$name : 入力必須、最大20文字
$tel : 入力任意、ハイフン区切りの電話番号形式
$email : 入力必須、メールアドレス形式
$body : 入力必須、最大1000文字

FormRequestバリデーションの実行

 以下では、フォームデータを受け取るコントローラのメソッドを用意し、FormRequestの子クラスであるSampleRequestを依存性注入することで、バリデーションを機能させます。

例として、以下のようなコントローラ(SampleController.php)を用意する
indexメソッド : Sample.indexビュー を表示
postメソッド : formリクエストを受け取る処理

このコントローラに以下の内容を設定することで、postメソッドにバリデーションを適応させる
1.use を用いて app/Http/Requests/SampleRequest を参照する
2.postメソッドの引数部分にSampleRequest $reruest を記述する(依存性注入)

この設定によってpostメソッドでは、SampleRequestで設定したバリデーションを通過したフォームデータのみを受け取ることができるようになります。

最後に

 今回、LaravelのFormRequestについて学んだことで、バリデーション処理を簡単に実装できることを知りました。
 特に便利だと感じた点は、多様なバリデーションルールが初めから用意されている点です。自分で複雑な検証ロジックを書く必要がなく、フォームデータの種類ごとにルールを定義するだけで適切なバリデーションが実行される点は、開発効率を大きく向上させると感じました。

今回の話は以上です。
ありがとうございました。

新入社員ブログ 斎藤02[CSRFについて]

25年度入社の斎藤です。

 今回は、Webアプリケーションに対する代表的な攻撃手法であるCSRF(クロスサイトリクエストフォージェリ)について、概要を簡単にまとめ、CSRF攻撃に対する一般的な対策とLaravelでどのように対策が行われているのかについて説明しようと思います。

CSRFとは

 CSRF(クロスサイトリクエストフォージェリー)は、Webアプリでログイン状態を保持している利用者に、ユーザーの意図しない不正なリクエストを送信させる攻撃手法です。
 正規のリクエスト方法とは異なるリクエストが受け入れられてしまうようなwebアプリの脆弱性が存在する場合に被害にあう可能性があります。
以下に具体的なCSRF攻撃手法の被害までの基本的な流れを銀行webアプリを例に説明します。

【前提条件】
・正規の銀行webサイト(例:https://bank.com)が存在し、送金機能をもつ
・CSRF対策(CSRFトークン)が実装されておらず脆弱性が存在する
※CSRFトークンについては後述

ステップ1:ユーザーが正規サイトにログイン
ユーザーが銀行サイト(bank.com)に正しい方法でログインします。
この際、Cookieが保存され、bank.comへのリクエスト時にはユーザーを識別するために自動的に送信されます。

ステップ2:攻撃者が作成した不正なサイトにユーザーがアクセスする
以下のような方法で不正なサイトにアクセスさせます。
・メールに記載されたリンク
・SNSの広告クリック
・掲示板に貼られたリンク
・他のサイトに埋め込まれた広告
など

ステップ3:不正なサイトのスクリプトが自動実行される

以下のフォームでは、正規の銀行webサイトに対して、攻撃者の口座(to_account)と送金金額(amount)を指定しています。

CSRF対策

 主なCSRF対策方法として、CSRFトークンを使用することが挙げられます。CSRFトークンは正規のページを表示したときにだけ発行される予測不可能なランダムな値です。
 このランダムな値をサーバーが生成してHTMLのFormに埋め込むことで、Form送信時にFormデータに合わせてCSRFトークンをserverへ送信し、フォームの正当性を担保することができます。
※CSRF攻撃では攻撃者はトークンを読み取れません

Laravel(Blade)でのCSRF対策
フォームタグ内に @CSRF を記述することで、Laravelが自動的にフォームに対してCSRFトークンを埋め込んでくれます。

※web.php(ルーティングファイル)では、@CSRFの付与されていないPOST/PUT/PATCH/DELETEリクエスト はエラーで弾かれるようになっています

jQueryのAjax通信でのCSRF対策
Ajax通信でのリクエストにもCSRFトークンを埋め込むことができます。
まず以下のようにBladeのheadタグ内にmataタグを用いてCSRFトークンを埋め込みます。

次にJavaScriptのjQuery.ajaxSetupメソッドに以下の記述を追加することで、metaタグからCSRFトークンを取得して、Ajaxリクエストに含めることができます。
※$.ajaxSetupはajax通信に関連するデフォルト値を変更するメソッド

最後に

 これまで、セキュリティ攻撃といえば不正なサイトに誘導する、webサイト自体に対して悪意ある改変を行うといったイメージを持っていました。
 CSRF攻撃はそれとは全く異なるアプローチで、攻撃者が自分のサイトから正規サイトへリクエストを送信し、ブラウザが自動的にCookieを付与してしまうことで、ユーザーの意図しない操作が実行されてしまうという「正規のフォーム外から攻撃する」という発想は、自分にとって全く考えたことのない視点であったので、非常に興味深く感じました。

今回の話は以上です。
ありがとうございました。

参考

安全なウェブサイトの作り方 – 1.6 CSRF(クロスサイト・リクエスト・フォージェリ)https://www.ipa.go.jp/security/vuln/websecurity/csrf.html

Readouble Laravel 9.x CSRF保護
https://readouble.com/laravel/9.x/ja/csrf.html

「CSRFって美味しいの?」←ハンズオンで実装して理解してみたhttps://qiita.com/Naughty1029/items/c606d4f12e994b46ba58

新入社員ブログ 斎藤01[XSSについて]

25年度入社の斎藤です。

 今回は、Webアプリケーションに対する代表的な攻撃手法であるXSS(クロスサイトスクリプティング)について、概要を簡単にまとめ、XSS攻撃に対する一般的な対策とLaravelでどのように対策が行われているのかについて説明しようと思います。

XSS(クロスサイトスクリプティング)とは

 XSSとは、脆弱性のあるwebサイト上で悪意のあるスクリプトを紛れ込ませることで、Webサイトを閲覧したユーザの環境において、紛れ込ませたスクリプトを実行させる攻撃手法です。具体的なXSSの流れを以下の簡単な例で説明します。

前提条件
・脆弱な掲示板サイトが存在
・投稿内容をそのままHTMLとして表示する仕様(エスケープ処理がない)

※エスケープ処理については後述

ステップ1:攻撃者が悪意のあるスクリプトを投稿
攻撃者が掲示板の投稿フォームに、以下のようなスクリプトを投稿する。

document.cookie:閲覧者のCookie情報を取得
fetch():攻撃者のサーバーにCookie情報を送信

このスクリプトが実行されると、閲覧者のCookie情報が攻撃者のサーバーに送信される仕組みになっている。

ステップ2:被害者が掲示板を閲覧
攻撃者の投稿内容が、閲覧者のブラウザに送信されます。

ステップ3:被害者のブラウザでスクリプトが実行される
被害者のブラウザは、<script>タグの中身を正規のJavaScriptコードとして実行してしまう。

ステップ4:攻撃者に閲覧者のCookie情報が抜き取られる

このようにして攻撃者は、盗んだCookie情報を使って被害者になりすまし、不正に被害者のアカウントでログインすることが可能になります。

今回の例は、XSSの中でも特に格納型XSSと呼ばれる攻撃手法です。ほかに、反射型XSSDOM Based XSSといった攻撃手法も存在します。

XSS対策

 有効な対策としてエスケープ処理を行うことが重要です。
エスケープ処理とは、 <script>のようなウェブページの表示に影響する特別な記号文字を無害な文字(HTMLエンティティ)に置き換えることです。
具体的には以下のような置き換えを行います。

 “<script>”であれば、 &lt;script&gt; に変換される。

Laravelでのエスケープ処理
Laravelでは {{ $変数 }} という記述方法で、変数の中身を自動的にエスケープしてくれる機能があります。


※{{}}内の変数に対して自動でhtmlspecialchars(エスケープ処理のメソッド)を施してくれます

エスケープ処理を行わずに表示させたい場合は、{{!! $変数 !!}}という記述方法を用います。

最後に

 今回、XSS(クロスサイトスクリプティング)ついて学ぶ機会を得たことで、Webアプリケーションのセキュリティに対する理解が深まりました。
特に、攻撃者がどのように悪意のあるスクリプトを実行させるのか、ブラウザのCookie送信の仕組みをどう悪用するのかといった、攻撃の手順と仕組みを理解することで、知らないことに対する不安から、知識に基づいた適切な警戒心へと意識が変化したことが、今回の学びの最も大きな収穫だと考えています。

今回の話は以上です。
ありがとうございました。

2025年 新入社員ブログ 遠藤01 [フォローアップ研修]

2025年4月入社の遠藤です。

今回はフォローアップ研修についてお話いたします。
われわれ2025年度入社社員一同は4月より、約二か月間外部での研修を受けさせていただいておりました。
そこでは、ITとは何かという情報基礎の学習から、実務で用いるようなコードの書き方、アプリ開発まで多くのことを学びました。
今回の研修は、その後のフォローアップ研修という位置づけで、ビジネス基礎を学びました。社会人としての仕事への姿勢を学ぶことが目的です。

研修で学んだこと

・業務の振り返りと仕事への心構え
入社してから今までの業務を振り返る。
仕事への心構えを再認識し、効率よく円滑に業務に取り組むためにすべきことを改めて考える。

・ビジネスマナー
人間関係を築き、より良い組織づくり。
自分の対応が会社の評価となることを自覚する。

・コミュニケーション
コミュニケーションが組織を守り、自分も守る。
相手に何がどのように伝わったのかを意識する。

・キャリア
地位、役職が同じ人物でも、仕事への興味や、やりがいの違いが個人やチームでの成長への違いとなる。

・ストレスコントロール
ストレスとうまく付き合い、どのように解消できるのか、何が原因なのかを考える。
また、自己効力感を高めることで、そもそものストレスを感じることが減少する可能性がある。
しかし、適度なストレスが達成感や良い緊張感を生み出すこともあるため、一概にすべてのストレスが悪いわけではない。
そのため、ストレスをコントロールすることが重要になる。

今後について

今回の研修で、PDCAサイクルを上手に回すこと、スピードを意識した業務をすることで作業の効率をあげることができると学びました。
スピードを意識することでその業務への集中力が増し、質の高いものを作ることができるという観点は、今まで自分にはなかったものなので新鮮でした。
また、コミュニケーションにおいては、互いに尊重しあい、調和したコミュニケーションを図ることで、誰もが働きやすい環境づくりが大切であると感じました。
できることを増やし、与えられたチャンスを逃さず様々なことに挑戦していくことで、成功も失敗も経験し、すべての出来事を成長につなげていきます。

今回の研修のお話は以上となります。
ありがとうございました。

2025年 新入社員ブログ 高田06 [MySQLバックアップ・リストア方法まとめ]

こんにちは、2024年4月に入社した高田です。
入社してから数ヶ月が経ち、社内研修を終えて、少しずつ実際の業務に携わるようになりました。最近は、実務の単体試験の一環としてMySQLのデータベース操作を行う機会があり、その中でデータベースおよびテーブルのバックアップとリストアを行いました。
今回は、MySQLのバックアップ・リストア方法について、手順やポイントを説明します。

MySQLのバックアップ方法

1. 単一のデータベースをバックアップ

以下のコマンドを使用すると、特定のデータベース全体をバックアップできます。
なお、「-h ホスト名」は、リモートサーバーに接続する場合に指定します。ホスト名が「localhost」の場合は、-h localhost を省略してもデフォルトで「localhost」に接続されます。


2. 特定のテーブルをバックアップ

特定のデータベース内の一部のテーブルのみをバックアップしたい場合は、以下のコマンドを使用します。


MySQLのリストア方法

バックアップファイルから特定のデータベースにデータをリストアする場合、バックアップファイルが単一のデータベース全体であっても、複数のテーブルを含む場合であっても、以下のコマンドでリストアできます。「-h ホスト名」については、バックアップ時と同様です。ホスト名が 「localhost」の場合は、省略してもデフォルトで「localhost」に接続されます。


実例

社内研修で使用した「laravelDB」というデータベースを使ってデータベースおよびテーブルのバックアップとリストアを実施します。
「laravelDB」データベースは「users」テーブルと「prefectures」テーブルの2つのテーブルを含んでいます。

データベースのバックアップ・リストア手順

1. データベースのバックアップ


2. リストア用のデータベース作成


3. データベースのリストア


以上の3ステップを実行すると、「laravelDB」データベースのバックアップデータを使用して、「laravelDB_restore」データベースに復元できます。復元後のデータベースには、バックアップ時点のデータやテーブル構造が再現されていることを確認できます。

テーブルのバックアップ・リストア手順

1. テーブルのバックアップ

2. リストア用のデータベース作成

3. テーブルのリストア


以上の3ステップを実行すると、「users」テーブルと「prefectures」テーブルのバックアップデータを作成し、新しく作成した「laravelDB_restore_tables」データベースに復元できます。データベース全体ではなく、特定のテーブルのみを対象としてバックアップ・リストアを行うため、復元後のデータベースにはバックアップしたテーブルのみが含まれ、それ以外のテーブルは存在しません。

まとめ

今回は、MySQLの基本的なバックアップおよびリストア手順について学びました。研修では、SELECT文、UPDATE文、DELETE文、CREATE文の使用方法を中心に学習しましたが、バックアップやリストアもコマンドを使用することで手軽に実行できると知りました。
本番環境のデータを扱う際には、事前にバックアップを取得し、万が一のトラブル時にも迅速にデータをリストアできるよう備えておくことが重要だと思いますので、今回学習した知識や技術をしっかりと整理し、必要なときに迅速に活用できるようにしていきたいと思います。

2025年 新入社員ブログ 高田05 [ローカル環境構築の利点と感想]

こんにちは、2024年4月に入社した高田です。
社内研修で Laravel を使用して会員登録フォームを作成しました。その際、ローカル環境は Docker を用いましたが、別の方法でも環境構築を試してみたかったため、Vagrant を使って同じ構成のローカル環境を構築しました。
今回は、ローカル環境構築における利点と、DockerやVagrantを学んだ感想について紹介したいと思います。

ローカル環境構築の利点

1. プログラムの動作確認が手軽に行える

Laravel を使って開発を進めるには、PHP や Web サーバー(Apache など)が動作する環境が必要ですが、一般的なWindows PCにはPHP や Web サーバーはインストールされていません。作成したプログラムを動かすには別途Webサーバーを用意し、Webサーバーにプログラムファイルをアップロードする必要があります。
しかし、Webサーバー用のPCを新たに用意するのは場所や費用の問題もあるので難しい場合があります。このような課題は、ローカル環境を導入することで解決できます。
ローカル環境を導入すると、自分のPC がサーバーとして動作するような状態となるため、新たにWebサーバー用のPCを用意する必要がありません。
また、同一PC内でWebサーバーが動作する形となるため、設定次第でWebサーバーにプログラムファイルをアップロードする手間を省くことができます。
ローカル環境を導入することにより、修正や確認のサイクルが短縮され、プログラム開発効率が大幅に向上します。

2. ローカル環境構築を通じたインストールと設定の習得

ローカル環境を構築する過程で、以下のようなWebアプリケーションを動かすための各種ソフトウェアについて、インストール方法や設定方法を学ぶことができました。
・PHP
・Web サーバー(Apache)
・データベース
具体的には、PHP を Web サーバーと連携させる仕組みや、MySQL などのデータベースとアプリケーションを接続する方法を学びました。コマンドでインストールを行うため、コマンドの使用方法についても復習出来ました。

3. 実務での開発安定化

ローカル環境を持たず、1つの開発サーバー上のファイルを複数人で直接編集すると、以下のようなトラブルが発生することがあります。
・他人が編集していることに気付かずにファイルを上書きしてしまう可能性がある
・誰がどの変更を加えたのか把握しにくくなる
ローカル環境を構築することで、上記のようなトラブルを防ぐことができます。結果として、安定した開発が可能になります。

Docker・Vagrant を学んだ感想

1. Linux、ネットワークの知識が必須

Docker や Vagrant を学ぶ上で、Linux やネットワークに関する基礎知識は不可欠だと感じました。基礎知識があることで、環境構築の全体像を把握しやすくなり、作業を効率的に進められます。さらに、エラーが発生した際や情報を検索する際も、技術記事の内容をスムーズに理解できるようになります。
一方で、Linux やネットワークの知識が不足していると、設定やエラー対応に時間がかかり、調べた情報を十分に活用できず、環境構築が思うように進まないことがあります。

2. 初心者が使用する場合はVagrantの方が簡単

Vagrantを使った環境構築は、手順がシンプルで初心者でも取り組みやすいと感じました。特に、Vagrantfileの記述だけで仮想マシンを構築できる点が大きな利点です。
仮想環境を使う場合、ホストOS(自分のPC)と仮想環境(VagrantやDockerなど)の間でファイルを共有するための仕組みとして「マウント」があります。マウントを設定すると、ホスト側で編集したファイルが仮想環境内にも反映されるため、設定が重要です。
ただし、Vagrantでマウントを設定する際、意図したとおりに機能しないことが多く、調べながら試行錯誤する必要がありました。初心者にとっては設定の難しさがハードルになりやすいと感じました。
Dockerを使用する場合、Dockerfileに加えて複数のコンテナを管理するためのdocker-compose.ymlファイルも必要になります。コンテナの仕組みや設定ファイルの記述方法を理解する必要があり、環境構築の経験が少ない初心者にとっては難易度が高いと感じました。
環境構築のしやすさを考えると、Vagrantの方が初心者には導入しやすく、理解しやすいと感じました。

まとめ

今回は、ローカル環境構築の利点と、DockerやVagrantを学んで感じたことを紹介しました。社内研修用に作成したローカル環境ですが、今後は実務でも新たにローカル環境を構築する機会が増えると考えています。
実務では、単にローカル環境を構築するだけでなく、メンバー間での手順やローカル環境ファイルの共有方法、複数人で進める際の利点にも注目しながら活用していきたいと考えています。

2025年 新入社員ブログ 高田04 [郵便番号から住所自動入力機能]

こんにちは、2024年4月に入社した高田です。
社内研修の一環として、Laravelを使って会員登録フォームを作成しました。その中で、住所登録時に郵便番号から住所を自動入力する機能を実装することになり、対応方法をいくつか調べてみました。
調査の結果、いくつかの実装方法があることがわかりました。今回はその中から以下の2つの方法を選び、それぞれを実際に実装してみたので紹介したいと思います。

1. YubinBango.jsを使用する方法
2. Zipcloud APIを使用する方法

まず、実装の下準備として、郵便番号、市区町村、その他を入力するテキストボックス、および47都道府県を選択するプルダウンメニューを作成しました。以下にそのコードを記載します。

ブラウザで表示すると以下のようなフォームが表示されます。

方法1:YubinBango.js

YubinBango.jsは、郵便番号から住所を表示する機能を簡単に実装できるJavaScriptのライブラリです。使用方法は非常にシンプルで、指定されたclass属性をHTML要素に追加するだけで機能します。
実際に実装したコードは以下の通りです。

ライブラリを埋め込み、class属性を指定する事で実装することができました。
実際にブラウザで確認すると以下のように、郵便番号(例:1080073)を入力した段階で郵便番号以降の項目(都道府県、市区町村、その他)が自動入力されます。

方法2:Zipcloud API

Zipcloudは、日本郵便が提供する郵便番号検索APIです。入力された郵便番号に基づいて対応する住所情報(都道府県、市区町村、町域など)を取得するためのサービスです。無料で利用可能で、JSONP形式で住所データを取得できます。

以下のURLにアクセスしてください。

https://zipcloud.ibsnet.co.jp/api/search

ブラウザにはこのように表示されます。

続いて以下のURLにアクセスしてください。

https://zipcloud.ibsnet.co.jp/api/search?zipcode=7830060

先ほどの画面とは異なり、ブラウザには住所が表示されています。

「https://zipcloud.ibsnet.co.jp/api/search」は、APIにリクエストを送信するための特定のURLであり、エンドポイントと呼びます。クライアントは、エンドポイントに対してリクエストを送信します。リクエストはインターネットを通じて送られ、APIサーバーに届きます。リクエストを受け取ったAPIサーバーは、内容を解析し、必要なデータをデータベースから取得します。
APIサーバーは、取得したデータを整理し、JSON形式などでレスポンスを作成します。作成したレスポンスはクライアントに送られます。
クライアントは受け取ったデータを解析し、画面に表示します。

今回のように、エンドポイントに「?zipcode=7830060」というクエリパラメータ(リクエストに含まれる追加情報)を付け加えてリクエストを送信すると、郵便番号「7830060」に対応する住所データを取得できます。

Zipcloud APIを使用して、郵便番号から住所自動入力機能を作成すると以下のようなコードになります。

実装の流れは以下の4ステップで行われています。

1. 郵便番号の取得
ユーザーが郵便番号を入力すると、その値をjQueryで取得します。取得した郵便番号が7桁の時に次の処理が実行されます。

2. APIへのリクエスト
入力された郵便番号を基に、Zipcloud APIへリクエストを送信します。APIは指定した郵便番号に対応する住所データを返します。

3. レスポンスデータの解析
APIから返ってきたJSON形式のデータを解析し、都道府県、市区町村、その他の情報を取得します。

4. フォームへの値の反映
取得した住所データを、都道府県のプルダウンメニューや市区町村・その他の入力フィールドに設定します。

ZipCloud APIによる住所自動入力機能は、jQueryの基本的な構文の知識があれば実装可能です。

参考
郵便番号検索API – zipcloud
新卒エンジニアがWebAPIを超わかりやすく解説します #初心者 – Qiita
郵便番号の自動入力「YubinBango.js」の使い方と都道府県コードを使う方法 | 大阪のシステム開発なら 株式会社ウィズテクノロジー
【jQuery】郵便番号検索APIを使って住所を自動取得する(zipcloud) | eguweb(エグウェブ)
【Javascript】郵便番号から住所を自動入力する方法 #JavaScript – Qiita
【初心者向け】郵便番号で住所検索をする外部APIを叩く #JavaScript – Qiita
実践jQuery講座 Ajaxの実装方法 | Inoma Create

まとめ

2つの方法を実装しましたが、YubinBango.jsはとても実装が簡単でプログラミング初心者におすすめできます。Zipcloud APIはjQueryの知識が必須のため、jQueryの基本的な構造や書き方に慣れてから使う方がよいかもしれません。今後もAPIやライブラリをうまく使えるようにjQueryやAPIの仕組みなどしっかりと学んでいきたいと思います。