Sphereとともに

scalaとかplayframeworkとか。技術ブログにしたいなと。環境は Windows7x64, mac です。たまに声優さん情報が混ざります。最近ちょっとClojure触りました。

早めに読んでおいたほうがいい本

「経験学習」入門

「経験学習」入門

Firefoxが新しくなったけど、ツリー型タブがぼってりしてるので少しスマートにする

Firefox Quantumというらしいが、今までのアドオンがことごとく使えない

が、ツリー型タブはきちんとしたものがある。

でも、なんだか今までのものと比べてぼってりしてる

素晴らしいことに、見た目をいじれるようになっているので、変えてしまう。

about:addons (アドオンマネージャ) を開いて、ツリー型タブの設定を開くと

真ん中あたりに「サイドバー内用の追加スタイル指定」があるので、そこに↓を追加

:root {
  --favicon-size: 12px;
  --tab-height: 26px;
  --faviconized-tab-size: 28px;
}

f:id:FScoward:20171115231314p:plain

スッキリする!

・・・上のタブはどうやったら非表示に出来る? ↓あった!

qiita.com

参照:

github.com

Kindleはとても良い

今まで電子書籍って紙と違って読みにくいから、と勝手に苦手意識を持っていたが Kindle を購入してその考え方が変わった

Kindle paper white は非常に読みやすい。流石よく考えられて作られている。

また、荷物量が減るのはとても大きい

SRE本のような本を持ち歩くのではなく、Kindleを持ち歩くだけで良くなったのはかなりでかい

SRE サイトリライアビリティエンジニアリング ―Googleの信頼性を支えるエンジニアリングチーム

SRE サイトリライアビリティエンジニアリング ―Googleの信頼性を支えるエンジニアリングチーム

Kindle Paperwhite 32GB、マンガモデル、Wi-Fi 、ブラック

Kindle Paperwhite 32GB、マンガモデル、Wi-Fi 、ブラック

Akka with SQS

Akka stream

playframework上で動かすので特にインストールは要らない。(play2.5)

library

developer.lightbend.com

elasticMQ

Kitematicを利用してElasticMqをdocker上に立ち上げておく。

設定を変更してport番号9324で立ち上がるようにしておくと吉。

aws cli

pip install awscli でインストールしておく。

AWS コマンドラインインターフェイス | AWS

aws configure で適当に値を設定しておく。

キューを作成する

$ aws sqs create-queue --queue-name test --endpoint-url http://localhost:9324
{
    "QueueUrl": "http://localhost:9324/queue/test"
}

メッセージを作成する

aws sqs send-message --queue-url http://localhost:9324/queue/test --message-body "Information about the largest city in Any Region." --endpoint-url http://localhost:9324

参考

qiita.com developer.lightbend.com

Angular + firebase with playframework(scala)

Angular

app.component.ts

import { Component, OnInit } from '@angular/core';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
import { Observable } from 'rxjs/Observable';
import { AngularFireModule } from 'angularfire2';
import { AngularFireAuthModule, AngularFireAuth } from 'angularfire2/auth';
import { AuthService } from './auth.service'

import * as firebase from 'firebase/app';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
    user: Observable<firebase.User>;
    constructor(public afAuth: AngularFireAuth, public authService: AuthService) {
      this.user = afAuth.authState;
    }
    login() {
      this.afAuth.auth.signInWithPopup(new firebase.auth.TwitterAuthProvider());
    }
    logout() {
      this.afAuth.auth.signOut();
    }
    auth() {
      firebase.auth().currentUser.getToken().then(token => this.authService.auth(token).subscribe(
        s => console.log(s),
        e => console.log(e)
      ))
    }
}

auth.service.ts

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions, Jsonp } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import * as firebase from 'firebase/app';


@Injectable()
export class AuthService {
  private authUrl = '/api/auth';

  constructor(private http: Http, private jsonp: Jsonp) { }

  auth(token: any): Observable<any> {
    let headers = new Headers({ 'Content-Type': 'application/json' });
    // "Access-Control-Allow-Origin", "*"
    let options = new RequestOptions({ headers: headers });

    let data = {token: token};

    return this.http.post(this.authUrl, JSON.stringify(data), options)
                    .map(this.extractData)
                    .catch(this.handleError);
  }

  private extractData(res: Response) {
    let body = res.json();
    return body.data || { };
  }

  private handleError (error: Response | any) {
    // In a real world app, you might use a remote logging infrastructure
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }

}

playframework

package modules

import java.io.FileInputStream
import javax.inject.Singleton

import com.google.firebase.{FirebaseApp, FirebaseOptions}
import com.google.inject.AbstractModule

import collection.JavaConverters._

/**
  * Created by fscoward on 2017/05/28.
  */
class FirebaseModule extends AbstractModule {
  def configure() = {
    bind(classOf[Firebase])
      .asEagerSingleton
  }
}

@Singleton
class Firebase {
  lazy val options = new FirebaseOptions.Builder()
    .setServiceAccount(new FileInputStream("秘密のjsonファイル名"))
    .setDatabaseUrl("https://<プロジェクト名>.firebaseio.com/")
    .build()

  FirebaseApp.getApps.asScala.toList match {
    case Nil => FirebaseApp.initializeApp(options)
    case list => println(list.mkString)
  }
}

AuthController

package controllers

import javax.inject.Inject
import javax.inject.Singleton

import com.google.firebase.auth.{FirebaseAuth, FirebaseToken}
import com.google.firebase.tasks._
import play.api.mvc.{Action, Controller}

/**
  * Created by fscoward on 2017/05/25.
  */
@Singleton
class AuthController @Inject()() extends Controller {
  def auth = Action(parse.json) { implicit req =>
    val firebaseAuth = FirebaseAuth.getInstance()
    val task: Task[FirebaseToken] = firebaseAuth.verifyIdToken((req.body \ "token").as[String])
    val result = Tasks.await(task)
    Ok(result.getUid)
  }
}

Scalaスケーラブルプログラミング第3版

Scalaスケーラブルプログラミング第3版

ng-cli & angular4 & firebase でtwitter連携

ほぼ↓にあるとおりにやればいいんだけど、ちょっと変えないと動かなかったのでメモ

github.com

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';
import { AngularFireModule } from 'angularfire2';
import { environment } from '../environments/environment';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireAuthModule } from 'angularfire2/auth';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFireDatabaseModule, // imports firebase/database, only needed for database features
    AngularFireAuthModule, // imports firebase/auth, only needed for auth features
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
import { Observable } from 'rxjs/Observable';
import { AngularFireModule } from 'angularfire2';
import { AngularFireAuthModule, AngularFireAuth } from 'angularfire2/auth';

import * as firebase from 'firebase/app';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
    user: Observable<firebase.User>;
    constructor(public afAuth: AngularFireAuth) {
      this.user = afAuth.authState;
    }
    login() {
      this.afAuth.auth.signInWithPopup(new firebase.auth.TwitterAuthProvider());
    }
    logout() {
      this.afAuth.auth.signOut();
    }
}

app.component.html

<button (click)="login()">Login</button>
<button (click)="logout()">Logout</button>

{{ (user | async)?.displayName }}

{{ (user | async)?.displayName }} のところは Async pipe というものを利用していて、?は値があればdisplayNameを呼び出し、なければ呼ばないという感じ