すぐにどれがどれだったか忘れてしまうのでメモ

説明

  • マクドナルドはキャメルケースと覚える ruby のクラス名
  • 蛇は地をはってるからアンダースコアでスネークケース、rubyの変数名
  • ハイフン使うやつをチェーンケースだということを初めて知った

メモ

  • キャメルケース :
    • ローワーキャメルケース : getSnoopyAge
    • アッパーキャメルケース : GetSnoopyAgeMcDonald
  • スネークケース : get_snoopy_age,mc_donald`
  • チェーンケース : .child-comments

参考記事

ApexでAWS Lambdaファンクションを管理する | Developers.IO

http://dev.classmethod.jp/cloud/aws/how-to-manage-aws-lambda-functions-with-apex/

install

curl https://raw.githubusercontent.com/apex/apex/master/install.sh | sh

クレデンシャルの設定はaws cliと同じ

  • ~/.aws/config
  • -/.aws/credentials

次のコマンドとかで実行するとできた

aws configure

バージョンを確認

apex version
>Apex version 0.11.0

実行方法

次の形式でprofileを指定して実行することができる

apex --profile admin --region us-west-2 deploy

プロジェクトを作成

apex init

各種操作

idを指定してrest apiの一覧を取得

 aws apigateway get-resources --rest-api-id bag2eoi90g

functionの一覧を表示

 apex list

functionを実行

 apex invoke hello

全てのfunctionをデプロイする

 apex deploy

ビルドしてzipファイルを作成する

 apex build hello > hello.zip

デプロイしたfunctionを1つ前のバージョンに戻す

 apex rollback hello

functionの実行ログを表示する

 apex logs hello

functionのメトリクスを表示する

 apex metrics hello

dry-run機能

functionをデプロイする --dry-runで削除する予定のfunctionを表示できる

 apex deploy hello --dry-run

functionを削除する --dry-runで削除する予定のfunctionを表示できる

 apex delete hello --dry-run

featurespecの操作をdryにする

メソッド化

気になるgemのメモ 2016

letsencrypt-rails-heroku

let`s encrypt の無料SSL証明書をherokuで自動更新するためのgem https://github.com/pixielabs/letsencrypt-rails-heroku

railsで使用するgemを作る

gem の雛形を作る

$ rails plugin new gem_name
      create
      create  README.md
      create  Rakefile
      create  gem_name.gemspec
      create  MIT-LICENSE
      create  .gitignore
      create  Gemfile
      create  lib/gem_name.rb
      create  lib/tasks/gem_name_tasks.rake
      create  lib/gem_name/version.rb
      create  bin/test
      create  test/test_helper.rb
      create  test/gem_name_test.rb
      append  Rakefile
  vendor_app  test/dummy
         run  bundle install

$ cd gem_name

gem_spec のTODOとなっている部分を正しい情報に書き換える ここで書き換えておかないと、警告文が表示されてrakeを使ってtestを流すことができない

$ vim gem_name.gemspec

----
$:.push File.expand_path("../lib", __FILE__)

# Maintain your gem's version:
require "gem_name/version"

# Describe your gem and declare its dependencies:
Gem::Specification.new do |s|
  s.name        = "gem_name"
  s.version     = GemName::VERSION
  s.authors     = ["J.Fukaya"]
  s.email       = ["fukajun.shark@gmail.com"]
  s.homepage    = "http://fukajun.org/"
  s.summary     = "Summary of GemName."
  s.description = "Description of GemName."
  s.license     = "MIT"

  s.files = Dir["{app,config,db,lib}/**/*", "MIT-LICENSE", "Rakefile", "README.md"]

  s.add_dependency "rails", "~> 5.0.0", ">= 5.0.0.1"

  s.add_development_dependency "sqlite3"
end

この時点でtestを実行できるかどうかを確認する => ダミーのテストがグリーンになるはず

$ bundle exec rake test

gemの処理を実装していく

$ vim lib/gem_name.rb

----
module GemeName
end

class ActiveRecord::Base
  def self.hoge
    'hoge'
  end
end

testを作成する

今回は、ActiveRecord::Baseを拡張する機能を書いているので test/dummy側にActiveRecord::Baseを継承した通常のrails の modelクラスを作成していく

$ cd test/dummy
$ bundle exec rails g model user name

    invoke  active_record
    create    db/migrate/20161107165840_create_users.rb
    create    app/models/user.rb
    invoke    test_unit
    create      test/models/user_test.rb
    create      test/fixtures/users.yml
$ vim db/migrate/20161107165840_create_users.rb

----

class CreateUsers < ActiveRecord::Migration[5.0]
  def change
    create_table :users do |t|
      t.string name
      t.timestamps
    end
  end
end

いよいよテストコードを書いていく

$ cd ../../ # gemのrootへ戻る
$ vim test/gem_name_test.rb

require 'test_helper'

class GemName::Test < ActiveSupport::TestCase
  test "truth" do
    assert_equal 'hoge', User.hoge
  end
end

再度、テストを実行して見る、グリーンになるはず

$ bundle exec rake test

特に変わったことはない

gemの雛形を作る

bundle gem を実行

bundle gem gem_name
cd gem_name
git ci -m "init"

処理を書いていく

早速、クラス郡を書いていく

$ cd lib/
$ vi gem_name/base.rb
module GemName
  module Base
  end
end

$ vi gem_name/main.rb
module GemName
  module Main < Base
  end
end

$ vi gem_name/helper.rb
module GemName
  module Helper
    def spec_helper_method
    end
  end
end
$ vi gem_name.rb

require 'gem_name/version'

module GemName
  require 'gem_name/base'
  require 'gem_name/main'
  require 'gem_name/helper'
end

todo: gemとして完成させる

todo: specのことについて書く

使用する側で読み込む


gem 'gem_name'

使用したいファイルで普通のrubyのmoduleを読み込むときのように使う

$ vi spec/spec_helper.rb
requie 'gem_name'
include GemName
$ vi spec/hoge.rb

describe do
  it do
    spec_helper_method
  end
end 

agenda

 Reactを使ってみた話
   agenda
   作り方ポイント
   TIPS
     webpack
     webpack-dev-server
     if文
     checkedは、true か false
     this.props.children
     イベントを起こしたコンポーネントの識別
     polyfill
   ツール
     haml-jsx-loader
     react-checkbox-group
     Lodash
   その他
     deep-freeze

作り方ポイント

  • 静的なページから作り始める

    • 静的なバージョンを作る
    • 想定される初期表示用のデータを準備しておく
    • 画面をコンポーネントに分割する
    • 分割した各子コンポーネントは親からデータを受け取って描画するだけ
  • stateは最低限に絞る

    • propsを通して親から渡されるか?
    • コンポーネント内で他のstateまたはpropsの基に計算出来るものか?
    • 何度も変更されるか?
  • 参考

TIPS

webpack

const webpack = require('webpack');

module.exports = {
  context: __dirname + "/src",
  entry: {
    index:  './index.js',
    spec: './spec.js'
  },
  output: {
    path: './build',
    filename: '[name].js',
  },
  module: {
    loaders: [
      {
        test: /.js$/,
        exclude: /node_modules/,
        loaders: ['react-hot', 'babel-loader', 'haml-jsx']
      },
      {
        test: /spec\.js$/,
        exclude: /node_modules/,
        loaders: ['mocha', 'babel-loader', 'haml-jsx']
      }
    ]
  },
  devServer: {
    contentBase: 'build'
  }
}

webpack-dev-server

if文

短絡評価を使う

<div>
{value && <div>value is true</div>}
</div>

三項演算子を使う

<div>
{value ? (<div>value is true</div>) : (<div> value is false </div>)}
</div>

関数を使う

<div>
{()=> {
  if(value) {
    return (<div>value is true</div>)
  else {
    return (<div>value is false </div>)
  }
}}
</div>

こんなのもある. this.props.childrenをレンダーするかしないかを切り替えてるだけ

checkedは、true か false

undefinedで、falseと同じ動作にならない

''' var isChecked = !!value; ( ) '''

this.props.children

???

イベントを起こしたコンポーネントの識別

bindを使用する

<input onClick={this.action.bind(this, item)} />

polyfill

chrome, firefox, スマホで動作させる分にはなくても動くけど... IE

ツール

haml-jsx-loader

見た目を整える前は、シンプルなDOMのみで動作を作ってるけど、 見た目を適用すると、DOMが複雑になってJSXではシンドイ... hamlでかけて、閉じタグを意識しなくて良くなるのは便利

GitHub - dingbat/haml-jsx-loader: Inline Haml with JSX

https://github.com/dingbat/haml-jsx-loader

react-checkbox-group

思いのほか、複数選択のチェックボックスの値をイベントごとに取得してくるというのがめんどくさい、これを使えば一度にチェックボックスで選択されている値を取ってくることができる。 GitHub - ziad-saab/react-checkbox-group: Sensible checkbox groups manipulation for DOM.

https://github.com/ziad-saab/react-checkbox-group

Lodash

日頃ruby書いている人だと、とても親和性が高い

Lodash

https://lodash.com/

その他

deep-freeze

..いつの間にか思わぬ場所を破壊していることも...

deep-freeze + 'use strict;'

Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita
http://qiita.com/kiita312/items/49a1f03445b19cf407b7

Smart and Dumb Components in React - Jake Trent
http://jaketrent.com/post/smart-dumb-components-react/

GitHub - romac/react-if: Render React components conditionally
https://github.com/romac/react-if

Array.prototype.find() - JavaScript | MDN
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

babel-polyfillとbabel-runtimeの使い分けに迷ったので調べた - Qiita
http://qiita.com/inuscript/items/d2a9d5d4daedaacff924

GitHub - zloirock/core-js: Standard Library
https://github.com/zloirock/core-js

GitHub - ziad-saab/react-checkbox-group: Sensible checkbox groups manipulation for DOM.
https://github.com/ziad-saab/react-checkbox-group

GitHub - substack/deep-freeze: recursively Object.freeze() on objects and functions
https://github.com/substack/deep-freeze

node-xml-compare
https://www.npmjs.com/package/node-xml-compare

RunKit
https://runkit.com/npm/node-xml-compare

Jest · Painless JavaScript Testing
https://facebook.github.io/jest/

Resemble.js : Image analysis
http://huddle.github.io/Resemble.js/

【超トリビア】東京都庁の都議会議事堂には誰でも入れるレストランがある / しかも飲み放題が1時間600円と激安! 居酒屋チェーンかよ!! | ロケットニュース24
http://rocketnews24.com/2016/10/03/805997/

料理写真 : テング酒場 渋谷レンガビル店 - 渋谷/居酒屋 [食べログ]
https://tabelog.com/tokyo/A1303/A130301/13085575/dtlphotolst/1/smp2/

Sendagaya.rb #170 Drinkup - Sendagaya.rb | Doorkeeper
https://sendagayarb.doorkeeper.jp/events/53565

問題

似たような見た目だけど部分的に表示されてる部品があったりなかったり、 ついてるclassが少し違ったりみたいなパーシャルがあったりする。 partialにパラメータをどういうものが指定できるのか不明だったり 実際にはどういう組み合わせで使われることがあるのかが不明だったりする そんな時にすこしでも見通しをよくする方法

次のような状態を

render 'mogehoge', element: 'A or B', cart_button: 'true or false'

次のように style_name に変更してパラメータを1つにする

=> render 'mogehoge', style_name: 'A'

=> render 'mogehoge', style_name: 'A_with_cart_buton'

=> render 'mogehoge', style_name: 'B_with_cart_button'

説明

パラーメータの組み合わせ数が爆発していたのを実際に存在する パターンにもどづいて、style_name に統一することでどのパターンがあり得るかということと、 どこで使われているかみたいなことを把握しやすくなる

pyenv install

ここを参考にpyenvを入れました

pyenvを使ってMacにPythonの環境を構築する - Qiita http://qiita.com/1000ch/items/93841f76ea52551b6a97

$ git clone git://github.com/yyuu/pyenv.git ~/.pyenv

.bash_profileへ環境変数の追加の書き込み

export PYENV_ROOT="$HOME/.pyenv"
export PATH="$PYENV_ROOT/bin:$PATH"
eval "$(pyenv init -)"
$ pyenv install 3.4.1
$ pyenv rehash

tensor flow install

この辺見てやった

Tensor Flowを初心者なりに導入してみた - Qiita http://qiita.com/tamagokake_gohan/items/df969c9508d4593a9776

$ which pip3
# すでにpip3がpyenv管理下に入ってる

$ export TF_BINARY_URL=https://storage.googleapis.com/tensorflow/mac/tensorflow-0.9.0-py3-none-any.whl
$ pip3 install --upgrade $TF_BINARY_URL

テスト実行

サンプルを実行してみる

$ TFPATH=`python -c 'import os; import inspect; import tensorflow; print(os.path.dirname(inspect.getfile(tensorflow)))'`
$ cd $TFPATH
$ python -m tensorflow.models.image.mnist.convolutional

Successfully downloaded train-images-idx3-ubyte.gz 9912422 bytes.
Successfully downloaded train-labels-idx1-ubyte.gz 28881 bytes.
Successfully downloaded t10k-images-idx3-ubyte.gz 1648877 bytes.
Successfully downloaded t10k-labels-idx1-ubyte.gz 4542 bytes.
Extracting data/train-images-idx3-ubyte.gz
Extracting data/train-labels-idx1-ubyte.gz
Extracting data/t10k-images-idx3-ubyte.gz
Extracting data/t10k-labels-idx1-ubyte.gz
Initialized!
Step 0 (epoch 0.00), 4.0 ms
Minibatch loss: 12.054, learning rate: 0.010000
Minibatch error: 90.6%
Validation error: 84.6%
.....

その他URL

テンソルフローでMNISTのチュートリアル (Deep Leaning) | OpenBook https://openbook4.me/projects/238/sections/1553

GitHub - tensorflow/tensorflow: Computation using data flow graphs for scalable machine learning https://github.com/tensorflow/tensorflow

Recent Entries