端くれプログラマの備忘録 – ページ 37 – 最近はウェブ系アプリ中心、あとWindowsアプリちょっと

[Laravel] A modern REST API in Laravel 5

2017年6月21日2017年6月21日 @84kure

有益な記事。APIサーバー設計のテクニックに加えて、大規模システムを綺麗に作るのに役立つデザインパターン(サービス・リポジトリなど)やディレクトリ配置、例外処理などに関する解説もあり。プロジェクトが肥大化して迷いが出たら読み返すといいかも。

A modern REST API in Laravel 5 Part 0: Introduction – Esben Petersen
http://esbenp.github.io/2016/04/11/modern-rest-api-laravel-part-0/

A modern REST API in Laravel 5 Part 1: Structure – Esben Petersen
http://esbenp.github.io/2016/04/11/modern-rest-api-laravel-part-1/

A modern REST API in Laravel 5 Part 2: Resource controls – Esben Petersen
http://esbenp.github.io/2016/04/15/modern-rest-api-laravel-part-2/

A modern REST API in Laravel 5 Part 3: Error handling – Esben Petersen
http://esbenp.github.io/2017/01/14/modern-rest-api-laravel-part-3/

A modern REST API in Laravel 5 Part 4: Authentication using Laravel Passport – Esben Petersen
http://esbenp.github.io/2017/03/19/modern-rest-api-laravel-part-4/

[Webサイト制作] Nightwatch.jsを使ってフロントエンドをテストする

2017年6月20日2017年6月20日 @84kure

ブラウザを自動運転することでフロントエンドのテストを自動で実行したい。そう思ってツールを探していたところ、Nightwatch.jsが良さげ。ちなみにこういうテストはE2E(エンドツーエンド)テストと呼ばれるらしい。

Nightwatch.js | Node.js powered End-to-End testing framework
http://nightwatchjs.org/

Getting Started | Nightwatch.js
http://nightwatchjs.org/gettingstarted

環境を作って試してみる。

Node.jsのインストール

Node.js
https://nodejs.org/ja/

今回のテストマシンはMac。Node.jsは既に入っていたので軽く動作確認。

$ node -v
v6.9.4
$ vi hello.js
console.log(‘Hello World’);
$ node hello.js
Hello World

$ node -v

v6.9.4

$ vi hello.js

console.log(‘Hello World’);

$ node hello.js

Hello World

Nightwatch.jsのインストール

$ sudo npm install -g nightwatch

1	$ sudo npm install -g nightwatch

JDK 8のインストール

Java SE Development Kit 8 – Downloads
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

Java SE Development Kit 8u131をダウンロード
dk-8u131-macosx-x64.dmg (Mac OS X 226.57 MB)

インストーラを使ってインストール

$ java -version
java version "1.8.0_131"
Java(TM) SE Runtime Environment (build 1.8.0_131-b11)
Java HotSpot(TM) 64-Bit Server VM (build 25.131-b11, mixed mode)

$ java -version

java version "1.8.0_131"

Java(TM) SE Runtime Environment (build 1.8.0_131-b11)

Java HotSpot(TM) 64-Bit Server VM (build 25.131-b11, mixed mode)

Seleniumのインストール

Selenium – Web Browser Automation
http://www.seleniumhq.org/

Selenium Standalone Serverをダウンロード
selenium-server-standalone-3.4.0.jar (version 3.4.0)

実行する

$ java -jar selenium-server-standalone-3.4.0.jar

1	$ java -jar selenium-server-standalone-3.4.0.jar

ブラウザ毎にWebDriverのインストール

Selenium WebDriver
http://www.seleniumhq.org/projects/webdriver/

Nightwatch.jsは標準でFirefoxで実行される
Firefox以外のブラウザで実行するにはドライバが必要

設定ファイルの作成

とりあえずサンプルの設定ファイルをコピペ。

Getting Started | Nightwatch.js
http://nightwatchjs.org/gettingstarted#settings-file

$ vi nightwatch.json
{
  "src_folders" : ["tests"],
  "output_folder" : "reports",
  "custom_commands_path" : "",
  "custom_assertions_path" : "",
  "page_objects_path" : "",
  "globals_path" : "",

  "selenium" : {
    "start_process" : false,
    "server_path" : "",
    "log_path" : "",
    "port" : 4444,
    "cli_args" : {
      "webdriver.chrome.driver" : "",
      "webdriver.gecko.driver" : "",
      "webdriver.edge.driver" : ""
    }
  },

  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "firefox",
        "marionette": true
      }
    },

    "chrome" : {
      "desiredCapabilities": {
        "browserName": "chrome"
      }
    },

    "edge" : {
      "desiredCapabilities": {
        "browserName": "MicrosoftEdge"
      }
    }
  }
}

$ vi nightwatch.json

{

"src_folders" : ["tests"],

"output_folder" : "reports",

"custom_commands_path" : "",

"custom_assertions_path" : "",

"page_objects_path" : "",

"globals_path" : "",

"selenium" : {

"start_process" : false,

"server_path" : "",

"log_path" : "",

"port" : 4444,

"cli_args" : {

"webdriver.chrome.driver" : "",

"webdriver.gecko.driver" : "",

"webdriver.edge.driver" : ""

}

"test_settings" : {

"default" : {

"launch_url" : "http://localhost",

"selenium_port" : 4444,

"selenium_host" : "localhost",

"silent": true,

"screenshots" : {

"enabled" : false,

"path" : ""

"desiredCapabilities": {

"browserName": "firefox",

"marionette": true

}

"chrome" : {

"desiredCapabilities": {

"browserName": "chrome"

}

"edge" : {

"desiredCapabilities": {

"browserName": "MicrosoftEdge"

}

テストコードを書く

$ vi demo.js
module.exports = {
  'Demo test Google' : function (client) {
    client
      .url('http://www.google.com')
      .waitForElementVisible('body', 1000)
      .assert.title('Google')
      .assert.visible('input[type=text]')
      .setValue('input[type=text]', 'rembrandt van rijn')
      .waitForElementVisible('button[name=btnG]', 1000)
      .click('button[name=btnG]')
      .pause(1000)
      .assert.containsText('ol#rso li:first-child',
        'Rembrandt - Wikipedia')
      .end();
  }
};

$ vi demo.js

module.exports = {

'Demo test Google' : function (client) {

client

.url('http://www.google.com')

.waitForElementVisible('body', 1000)

.assert.title('Google')

.assert.visible('input[type=text]')

.setValue('input[type=text]', 'rembrandt van rijn')

.waitForElementVisible('button[name=btnG]', 1000)

.click('button[name=btnG]')

.pause(1000)

.assert.containsText('ol#rso li:first-child',

'Rembrandt - Wikipedia')

.end();

}

};

テストを実行

$ nightwatch

1	$ nightwatch

参考サイト

javascript – switch to a frame with Nightwatch.js – Stack Overflow
https://stackoverflow.com/questions/27548030/switch-to-a-frame-with-nightwatch-js

Nightwatch.jsをE2Eテストフレームワークとして実プロジェクトに適用する時のtipsまとめ | MMMブログ
http://blog.mmmcorp.co.jp/blog/2015/09/24/use-nightwatch/

WebアプリのUIテストを手軽に自動化できるNightwatch.jsの使い方 – WPJ
https://www.webprofessional.jp/javascript-functional-testing-nightwatch-js/

姫路のホームページ製作屋WILDWEST-SERVICE
https://www.wildwest-service.com/nightwatch/

以下はフロントエンドテストに関する参考ページ

フロントエンドにテストを導入 – Qiita
http://qiita.com/howdy39/items/cdd5b252096f5a2fa438

フロントエンドのテストに真面目に向き合う – Qiita
http://qiita.com/okmttdhr/items/cc58e83c259aa0049538

[Laravel] 認証にJWTを使ったAPIサーバーのサンプル

2017年6月20日2017年6月20日 @84kure

APIサーバーを作る必用に迫られていたところへ良く出来たサンプルを見つけたので覚書リンク。APIサーバーの何たるかとLaravelでの実装例を同時に学ぶことができて有益。作者に感謝。

How to Build an API-Only JWT-Powered Laravel App — SitePoint
https://www.sitepoint.com/how-to-build-an-api-only-jwt-powered-laravel-app/

認証にはJWT (JSON Web Token)を使っている。

JSON Web Tokens – jwt.io
https://jwt.io/

このサンプルが利用するモジュールは以下３つ。

GitHub – dingo/api: A RESTful API package for the Laravel and Lumen frameworks.
https://github.com/dingo/api

GitHub – tymondesigns/jwt-auth: JSON Web Token Authentication for Laravel & Lumen
https://github.com/tymondesigns/jwt-auth

GitHub – barryvdh/laravel-cors: Adds CORS (Cross-Origin Resource Sharing) headers support in your Laravel application
https://github.com/barryvdh/laravel-cors

途中段階のプロジェクトがGitHubにある。これをベースに記事を読みながらコードを追加すれば完成する。リポジトリはLaravel 5.4ベースだけど記事は少し古いバージョンのLaravelベースなので、コードを若干いじる必要あり。

GitHub – francescomalatesta/laravel-api-boilerplate-jwt: An API Boilerplate to create a ready-to-use REST API in seconds.
https://github.com/francescomalatesta/laravel-api-boilerplate-jwt

APIのテストにはPostmanが超便利。API開発には必須のツールだな。

Postman | Supercharge your API workflow
https://www.getpostman.com/

同じ作者によって、このAPIサーバーを使ったAngularJS製のフロントエンドのサンプルも公開されている。時間があるときに、こちらも勉強してみたい。

How to Consume Laravel API with AngularJS — SitePoint
https://www.sitepoint.com/how-to-consume-laravel-api-with-angularjs/

[PHP] JSONの取り扱い

2017年6月19日 @84kure

覚書リンク。

JSON の紹介
http://www.json.org/json-ja.html

PHP: json_encode – Manual
http://php.net/manual/ja/function.json-encode.php

PHP: json_decode – Manual
http://php.net/manual/ja/function.json-decode.php

[Go言語] LIGが自社サービス開発にGo言語を採用したお話

2017年6月13日2017年6月13日 @84kure

覚書リンク。参考になる。

PHPとGoって何が違うの？LIGが自社サービス開発にGo言語を採用したお話 | Go Golang！
https://liginc.co.jp/284306

PHPからGoへ乗り換えるリスクとは？LIGが自社サービス開発にGo言語を採用したお話 | Go Golang！
https://liginc.co.jp/295527

【GO言語のパッケージ管理：決定版】「Glide」を使ってみよう | Go Golang！
https://liginc.co.jp/305623

「言語を移行するためのAPI」LIGが自社サービス開発にGo言語を採用したお話 | Go Golang！
https://liginc.co.jp/313982

【はじめてのGo言語】Go言語について詳しく知ろう〜Go言語で何ができるの？〜 | Go Golang！
https://liginc.co.jp/320855

【はじめてのGo言語】Go言語でアプリケーションを作ってみよう〜こんにちは、世界編〜 | Go Golang！
https://liginc.co.jp/327259

【はじめてのGo言語】Go言語でアプリケーションを作ってみよう〜Webサーバー編〜 | Go Golang！
https://liginc.co.jp/333868

[MongoDB] Laravel用パッケージ

2017年6月13日 @84kure

検索してみたので覚書リンク。自分では試してない。

GitHub – jenssegers/laravel-mongodb: A MongoDB based Eloquent model and Query builder for Laravel (Moloquent)
https://github.com/jenssegers/laravel-mongodb

Laravel Migrations with Moloquent and MongoDB (with MySQL still present) | Verron Knowles
http://www.verronknowles.com/laravel-migrations-with-moloquent-and-mongodb-with-mysql-still-present/

Getting Started – Moloquent
https://moloquent.github.io/master/

Getting Started with Laravel 5.4 and MongoDB – Markus Tripp – Medium
https://medium.com/@markustripp/getting-started-with-laravel-5-4-and-mongodb-1ad2892e473f

[Amazon DynamoDB] Laravel用パッケージ

2017年6月13日 @84kure

検索してみたので覚書リンク。自分では試してない。

GitHub – aws/aws-sdk-php: Official repository of the AWS SDK for PHP (@awsforphp)
https://github.com/aws/aws-sdk-php

GitHub – aws/aws-sdk-php-laravel: A Laravel 5 (and 4) service provider for the AWS SDK for PHP
https://github.com/aws/aws-sdk-php-laravel

GitHub – baopham/laravel-dynamodb: Eloquent syntax for DynamoDB
https://github.com/baopham/laravel-dynamodb

Dynamo session driver for Laravel 5 · Issue #8464 · laravel/framework · GitHub
https://github.com/laravel/framework/issues/8464

[Laravel] Pivotテーブルにカラムを追加する

2017年6月9日 @84kure

マイグレーションでカラムを作成し、モデルにも以下のようにカラムを定義する。

public function products()
{
    return $this->belongsToMany('App\Products')
        ->withPivot('products_amount', 'price')
        ->withTimestamps();
}

public function products()

{

return $this->belongsToMany('App\Products')

->withPivot('products_amount', 'price')

->withTimestamps();

}

アクセスは->pivotを経由で行う。

foreach ($shop->products as $product)
{
    echo $product->pivot->price;
}

foreach ($shop->products as $product)

{

echo $product->pivot->price;

}

参考サイト

Pivot tables and many-to-many relationships – Laravel Daily
http://laraveldaily.com/pivot-tables-and-many-to-many-relationships/

[Webサービス] REST API 参考リンク

2017年6月9日 @84kure

RESTとは – IT用語辞典
http://e-words.jp/w/REST.html

REST – Wikipedia
https://ja.wikipedia.org/wiki/REST

REST入門基礎知識 – Qiita
http://qiita.com/TakahiRoyte/items/949f4e88caecb02119aa

REST APIとは？ – API設計のポイント
http://wp.tech-style.info/archives/683

REST な API とは何か – ボクココ
http://www.bokukoko.info/entry/2014/10/12/REST_%E3%81%AA_API_%E3%81%A8%E3%81%AF%E4%BD%95%E3%81%8B

認証を含む API 開発で検討すべきこと – ボクココ
http://www.bokukoko.info/entry/2015/12/20/%E8%AA%8D%E8%A8%BC%E3%82%92%E5%90%AB%E3%82%80_API_%E9%96%8B%E7%99%BA%E3%81%A7%E6%A4%9C%E8%A8%8E%E3%81%99%E3%81%B9%E3%81%8D%E3%81%93%E3%81%A8

WebAPI学習ソースまとめ – Qiita
http://qiita.com/y-some/items/7e05540d7563f7c1c101

APIの使い方まとめ | SYNCER
https://syncer.jp/web/api/

[Webサービス] マイクロサービス参考リンク

2017年6月9日 @84kure

Microservices
https://martinfowler.com/articles/microservices.html

James Lewis/Martin Fowlerの”Microservices”日本語訳 – 自由課題
http://kimitok.hateblo.jp/entry/2014/11/09/211820

マイクロサービスに関する資料のまとめ | Ryuzee.com
http://www.ryuzee.com/contents/blog/7050

マイクロサービスのトレードオフ | 開発手法・プロジェクト管理 | POSTD
http://postd.cc/microservice-trade-offs/

マイクロサービスは本当に必要？–失敗を避けるための8つのステップ – ZDNet Japan
https://japan.zdnet.com/article/35102174/

30分で作るマイクロサービス・アーキテクチャ
https://nobusugi246.github.io/building-msa-in-30-minutes/MSAin30min_ja.html

『マイクロにしすぎた結果がこれだよ！』──Gunosyにその舞台裏を聞いてみた｜CodeIQ MAGAZINE
https://codeiq.jp/magazine/2017/02/48478/

マイクロサービスアーキテクチャにおけるオーケストレーションとコレオグラフィ – Qiita
http://qiita.com/kawasima/items/17475a993e03f249a077

マイクロサービスアーキテクチャにおけるAPIコールの仕方とHTMLレンダリング – Qiita
http://qiita.com/kawasima/items/356d54e253c54d730fb0

これからAPI開発するための勉強メモ – Qiita
http://qiita.com/shoichiro-s/items/cd351e9d7f1a85ef8b78

綺麗なAPI速習会 – Qiita
http://qiita.com/shimastripe/items/e9b0e1f8f8d77b89373f

マイクロサービスのための綺麗なAPI設計 | Wantedly Engineer Blog
https://us.wantedly.com/companies/wantedly/post_articles/32977

HerokuのAPIデザイン | SOTA
http://deeeet.com/writing/2014/06/02/heroku-api-design/

APIのバージョニングは限局分岐でやるのが良い – Hidden in Plain Sight
http://kenn.hatenablog.com/entry/2014/03/06/105249

Kong を使った Microservices Architecture API Gateway Pattern の実現方法 – Qiita
http://qiita.com/awakia/items/235cf6fd299634391ce6

APIエコノミーの作り方｜連載一覧｜サーバ/ストレージ｜解説/事例記事
https://news.mynavi.jp/itsearch/series/hardware/api.html

Go言語での決済システムとマイクロサービス化について | eureka tech blog
https://developers.eure.jp/tech/golang-payment-microservices/

クックパッドにおける最近のMicroservices事例 – クックパッド開発者ブログ
http://techlife.cookpad.com/entry/2016/03/16/100043