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を呼び出し、なければ呼ばないという感じ

イヤーカフのambieを買ってみた

ちょっと仕事中集中して作業したいけど、完全に耳を塞いでしまうといろいろと厄介なのでどうしようかと思ってたときに知ったのが ambie

ambie.co.jp

他の人のレビューを見ると低音が残念とか書かれてたりするけど、それは事実

でいくつか曲を聞いてみたけど、ジャズが非常に良い

ピアノ曲も良い

落ち着いて作業用BGMとして流しておくことだけを考えれば最高のアイテムだと思う

集中して音楽を楽しみたいのなら別のイヤホン使うし、仕事中のBGM用に割り切って持つなら全然ありです