はてなブックマーク

あらすじ 春ですね。新人研修の準備をしましょう。 動作環境 babel-preset-env はこの記事を作成している時点では version 1 を使っています。しばらくすると version 2になるかもしれません。 % cat package.json { "name": "practice-frontend", "version": "1.0.0", "main": "index.js", "license": "MIT", "dependencies": { "babel-cli": "^6.26.0", "babel-preset-env": "^1.6.1", "http-server": "^0.11.1", "webpack": "^4.1.1", "webpack-cli": "^2.0.12" } } 準備1: 静的サーバーを用意 mkdir practice-fro

あらすじ Nginx + Node.js + React.js + Mongodb で Web Application の構築手順を説明する必要があるのですが、Dockerfile をドキュメントとして扱う事になりました。 % docker --version Docker version 17.06.2-ce, build cec0b72 % node -v v8.1.0 % create-react-app --version 1.4.0 % mongo --version | head -n 1 MongoDB shell version v3.4.9 準備 一応 Todos アプリのような感じの Web API を backend で用意して React がそのデータを描画する、までの簡単なサンプルアプリを作成しつつ Docker について説明します。 先ずは以下のコマンドを実行し

あらすじ ISUCON7 でまたもや予選敗退したんですが来年に備えて復習しておきたいので環境を構築してみました。 やること [訂正]ディスクプランは HDD ではなくて SSD でした。 さくらのクラウドで 1GB/1仮想コア、ディスクプランは SSD 。これを3台構築。あとスイッチを1台追加してこれとサーバーをつなぎます。host名をそれぞれ app1, app2, app3(db) として、最初に app1 を作ってから app2 と app3 をクローンしていきます。 完成予想図はこんな感じです。さくらのクラウド触った事がある人だったら簡単だと思います。私は初めて触ったのでちょっと手こずりましたが。 やった事 ほとんど README.md に書いてあるんですが、まあこの記事は自分の為の備忘録なので... github.com ubuntu でログイン sudo apt update

あらすじ ユーザー画面と管理画面を SPA で作りたいんだけど component とか再利用したい時のお話です mkdir practice-webpack-output && cd $_ mkdir -p src/{app,admin} www/{app,admin} npm init -y npm install --save-dev webpack babel-core babel-loader babel-preset-es2015 create .babelrc echo '{"presets": ["es2015"]}' > .babelrc create webpack.config.js const path = require('path') const webpack = require('webpack') module.exports = { entry: { "

あらすじ react-router@v4 にしたら色々な変更が入っていて全く動かなくなったので react-router の機能を確認しました。 追記: 2017-03-23 16:30 withRouter について追記しました。 言及すること <Route> の挙動が v3 と異なる <Switch> と <Route exact ...> の挙動を理解して対処しましょう browserHistory.push から `this.props.history.push へ変わった <NavLink> が追加されました Nested Routes が廃止された？ withRouter 準備 create-react-app practice-react-router4 && cd $_ npm install --save react-router-dom <Route> 最初に src/

あらすじ Provisioning を継続インテグレーションしたくなったのですが、そんな時は CircleCI で Docker を使えばいいんじゃないかと思いました。 コンテナ内で ServerSpec を実行する方法などがあると思いますが、ここではコンテナ内に SSHD を使って外部からプロビジョンします。 テストに関しては Serverspec などがあると思いますが、ここではシンプルに 外部から SSH でコマンドを実行して結果の確認をするだけにします。 ソースコード ここで紹介しているソースコードは下記の置いてあります。 github.com 準備 mkdir circleci-docker-provisioning && cd $_ mkdir -p keys provisioning/inventory provisioning/roles/nodejs/tasks touc

https://atnd.org/events/85292 hachioji.pm #63 に参加してきました。#0から始まっているので64回目です。 Hachioji.pm #37 以来なのでちょうど3年ぶりらしい。そんなに時間経ってるんだ... 八王子の居酒屋で未来を体験する LT一覧 酔っ払いながらメモしているので情報が正確でないかもしれませんのでご了承ください。 hkoba: git submodule のお話 独自のディレクトリ構成のサービスに抵抗するために開発したシェルスクリプトを紹介してくれました。 hirobanex: Line bot API のお話 なぜか資料がマインドマップ。ピャッとしたりヒャッとしたり。 hide_o_55: Rust のお話 今年は Rust をやるそうです。次は Rust が来るのか!? myfinder: Azure なら Perl で Lin

Pytestの備忘録 py.test の書き方について重要なところだけまとめてみました。 大体以下のことがつかめればOKだと思います。 autouse と pytest.ini の関係 scope の使い方 request.addfinalizer autouse tests/test_my.py を用意 # -*- coding: utf-8 -*- import pytest @pytest.fixture() def create_fixture(): print '[create_fixture]' class TestMy(object): def test_101(self): print '[test_101]' def test_102(self, create_fixture): print '[test_102]' def test_103(self): print '

あらすじ そろそろ最初から国外を視野に入れてサービスを始めるご時世のようです。 準備 mkdir practice-i18 && cd $_ npm init --yes echo 'node_modules' > .gitignore git init && git add . && git commit -m 'initial commit' npm install express i18n --save npm install supertest power-assert --save-dev 以下は個人的な設定 echo '**/node_modules/' > .eslintignore curl -sO https://raw.githubusercontent.com/nodejs/node/master/.eslintrc sed -i -e 's/require-buff

テストスクリプト CREATE TABLE test_user_item ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 'ID', `user_id` int(10) unsigned NOT NULL COMMENT 'ユーザーID', `name` varchar(12) NOT NULL COMMENT 'アイテム名', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8 COMMENT='テスト'; INSERT INTO test_user_item (user_id, name) VALUES (1, 'どうのつるぎ'), (2, 'どうのつるぎ'), (4, 'どうのつるぎ'), (3, 'どうのつるぎ'); SELE

mongoDB の stream を使おうとしてサンプルコードを探すと意外と見つからないのでメモ var MongoClient = require('mongodb').MongoClient; function getIds (db, callback) { var condition = {}; // something var stream = db.collection('userActionLog').find(condition, {userId:1}).stream(); stream.on('error', function (err) { db.close(); return callback(err); }); var seen = {}, var ids = []; stream.on('data', function (doc) { if (!seen[doc.u

Perl だと Caputre::Tiny というモジュールがあるのですが、じゃあ PHP だとどうするんだろうっていう話 <?php ob_start(); echo 'hogehoge'; $str = ob_get_contents(); ob_end_clean(); var_dump($str); // string(8) "hogehoge" こうでした。

purpose これは以下のケースで有効な作業かもしれません。 開発環境を VirtualBox の中に構築している 開発環境は社内LANネットワークに参加させない iPhone 実機から VirtualBox 内の WEB サーバーにアクセスしたい 別の言い方をすると Vagrant で開発していて config.vm.network :public_network にするとネットワーク管理者に迷惑をかけるので dnsmasq を使って何とかしたという記事です。 network iPhone は MacOSX の air port でインターネット共有しているものとします。 VM(192.168.33.10) <===> Mac OSX(192.168.33.1) Mac OSX(192.168.2.1) <===> iPhone(192.168.2.2) tools 簡易 DNS サー

mysql-build で MySQL をインストール mysql-build は root権限のみが実行するという前提でインストール 環境 # cat /etc/redhat-release CentOS release 6.3 (Final) やってみる % sudo su # cd # git clone git://github.com/kamipo/mysql-build.git # echo 'export PATH="$HOME/mysql-build/bin:$PATH"' >> ~/.bashrc # exec $SHELL mysql client は 全ユーザーが使うようにするので専用のディレクトリを作成する mkdir -p /mysqls mysql-build -v 5.1.70 /mysqls/5.1.70 使用するディレクトリを作成 # mkdir -p /

xaicron/mysqlenv を試してみました。 で、エラーが出てしまったので以下備忘録。 現象 xaicron/mysqlenv (version 0.01) で root ユーザーで MySQL5.1 をインストールする際にエラーが出る。 やりたかったこと。 開発環境の構築をする際に mysqlenv で簡単にセットアップできそうな気がしたので試したみました。 試した環境はAWSのEC2です。 % cat /etc/redhat-release [~] CentOS release 6.3 (Final) 作業ログ root ユーザーのディレクトリに mysqlenv をインストール。 一般ユーザーが mysql コマンドを叩く前提にするので /usr/local/ に移動 sudo su cd ~ curl -kL http://bit.ly/mysqlenv | bash mv

あらすじ svn から git 移行が叫ばれる今日この頃ですので git に慣れるためのドリルを用意しました。 準備 適当なディレクトリを用意して git init する。 % mkdir git-practice % cd git-practice % git init % touch content.txt % git add content.txt % git commit -m 'initial commit.' ドリル開始 develop branch を作成 % git branch develop % git checkout develop develop から分岐する feature branch A,B を作成 % git branch feature/A % git branch feature/B 最初は feature/B branch で作業を開始する % gi

追記あり 2013-02-25 innodb って Permissible Index Types が BTREE だったっていう あらすじ 流れのフリーランスやってるとよく面接行くはめになるんですが、そうすると大体「クエリチューニングの経験ありますか？」「これまでどういったチューニングしましたか？」とか聞かれます。 いつも思い出すのに苦労するので忘れないように問題にしておきました。 問題 以下のクエリが遅いので何かしらの対処を考えるように、とインフラチームから連絡がありました。何かしらの対処を考えなさい。 なお、type と delete_fg は常に等価であるかどうかのクエリしか発行しないものとする。 SEELECT count(*) FROM product WHERE type = 'N' AND delete_fg = 'N'; 現状ではプロダクトテーブルは以下のスキーマとなって

javascript の配列はこんな感じで空かどうかを判定できたりします。 var array = ['fuga', 'moga']; console.log(array.length > 0); // true で、オブジェクト(Perlでいうとhash)のプロパティが一個以上あるかどうかを調べたい場合は for in 使うのなんかやだなので調べたらこういう書き方ができたっていう話。 var hoge = { fuga: 1, moga: 2, }; console.log(Object.keys(hoge).length === 2); // true ひさびさに書いた記事がこんなのでごめん。

JavaScriptのテスト作法を考えるきっかけができたのでえいやと考えました。 実務で使うというより日曜プログラマ向けの内容だと思います。たぶん。 それはある日突然起きてしまった youtubeのApiを利用して「KYOSUKE HIMURO GIG at TOKYO DOME」のコマーシャル動画情報を取得したいなあ。という事で次のようなコードを書きました。 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Youtube Api Sample</title> <script src="http://code.jquery.com/jquery-latest.js"></script> <meta http-equiv="X-U

環境 この記事で紹介しているコードはmacでしかたぶん動きません。ご注意下さい。 % sw_vers ProductName: Mac OS X ProductVersion: 10.6.8 BuildVersion: 10K549 雛形作成 % mkdir Practice-JsTestDriver % cd Practice-JsTestDriver jsTestDriverを取得 % mkdir bin % curl http://js-test-driver.googlecode.com/files/JsTestDriver-1.3.3d.jar -o bin/jsTestDriver-1.3.3d.jar 設定ファイルを作成 % vi jsTestDriver.confserver: http://localhost:4224 load: - root/js/mylibs/*.j