プラウダ

モスクワの報道は三つのカテゴリーにわかれている。すなわち「真実」「たぶん真実」及び「真実性のないもの」の三つである。 第一のカテゴリーには時報、第二のカテゴリーには天気予報、そして第三のカテゴリーには他の全てが含まれている。

思い出したように日記を書く

土曜日は砲雷撃戦!よーい!でした。特に新刊もなかったので終始まったり。売り子とだべり続けつつたまに本売ってました。カメラ持っていってコスプレ写真取ればよかったな……。意識高いのでタブレットPC持ち込んで次の本の原稿していました*1。次は11月26日の陽炎型オンリー「カゲロウスターズ」で本出したいなと思ってます。冬コミ近いから心配。知り合いに「10月中に終わらせれば余裕っすよw」と言ったら「甘い。甘すぎる」と一刀両断。ぼくもそう思います。

いつも計画立てて計画倒れに終わるんですが、立てない遂行できる計画より立てた遂行できない計画(?)のほうがマシ(??)な気がしてとりあえず計画は立ててみました。計画を見ながら「理論値だよなァ」と呟きました。

日曜日は久々に掃除をしました。めっちゃ雑だけど掃除機かけただけで及第点。物が溢れすぎていて広い部屋に引っ越したい……。床に物おいてるのがいけないと思うのででかい棚とかにボンボンもの突っ込んで床にはルンバ走らせたいですね。そのためにも引越ししたいんですが、引っ越すなら都内だし、新しい職場考えるとめっちゃ家賃高いので勇み足。家賃が月収の半分弱というのは流石に……。試用期間終わっておちんぎん上がったら考えましょう。

そして月曜日の今日ですが、朝から同人の依頼でいい感じに色々できたので楽しい。そのままの勢いで帰ってきてから酒飲みつつもコーディングできるかと思ったけど、「ビールだけなら飲みながらコーディングできる」は幻想だった模様。正確を期すならば「ビール飲む前からコーディングしていれば飲んだあともコーディングできる」とかそんな感じ。酒飲みながらでも作業できるように知見を重ねていきたい。

2年前くらいから言ってる気がするんですけど、艦これ二次創作で小説出したい気がしてきましたね。半分は組版やりたいがためというのもあるけど、漫画より尺を伸ばした物が書きやすそうというのもあります。あとぼくの場合内面にスポットを当てたお話をよく書くのでそういうのとも相性が良いのではないか、というのもあります。とは言えSSも書いたことないのに大丈夫なのだろうか。


言質のふぁぼ……ッ!

*1:当日の新刊がなかった点はさておく

チリ・もやし・ポーク


銃・病原菌・鉄みたいなタイトルですが*1、また晩酌のつまみです。

材料(1人分には多いかもしれない)
  • 豚ロースとんかつ用でもトンテキ用でも…200g
  • もやし…100g
  • にんにく…ひとかけ
  • 唐辛子…1本
  • サラダ油…大さじ1
  • ケチャップ…大さじ3
  • 塩胡椒…適量
レシピ
  1. 豚肉を1cm幅の短冊切りにする。にんにく・唐辛子は適当に刻んでおく
  2. フライパンににんにく・唐辛子を入れて熱する
  3. 豚肉を入れて火が通るまで焼く
  4. もやしを入れて強火でさっとあおる
  5. ケチャップを入れて馴染むまで熱する

これをチリと呼称してよいのかは諸説あると思うけど、エビチリが似たようなレシピで作られることもあるし言った者勝ちなところはある。もやしにケチャップってどうなの……と思いましたがケチャップと豚肉のがっつりした味と食感の間でもやしのシャキシャキ感が光っていて面白い味でした。美味しいです。ビールによく合う。ニラあたりを入れれば彩り的にもバランスが取れていいんではないんでしょうか。その辺を怠っているあたり残り物での自炊感が否めなせんね。

*1:そうか?

鶏肉とみょうがのバルサミコ炒め


余り物処分で作ったレシピが美味しかったので紹介しておこうと思う。

材料(1人分)
  • 鶏胸肉…100g
  • 片栗粉…適量
  • サラダ油…大さじ1
  • みょうが…3個
  • 長ネギ…中くらいなら1/2~2/3
  • *バルサミコ…大さじ2
  • *醤油…大さじ1
  • *トウチジャン…小さじ1/2
  • *砂糖…小さじ1/2
レシピ
  1. みょうがと長ねぎを千切りにする。鶏胸肉は一口大に切る
  2. *印の調味料を混ぜておく
  3. 鶏胸肉に片栗粉にまぶす
  4. 弱火で鶏胸肉を焼く。きつね色くらいだと旨味が出てよし
  5. 胸肉に火が通ったらみょうがと長ネギを入れさっと炒める
  6. 火を止めて*印の調味料を入れる。
  7. 強火にして調味料をからめながら水気を飛ばす

調味料がすごい組み合わせになってる上みょうがを炒める??って感じなんですけど酸っぱくさっぱりしててなかなかイケます。もも肉でも行けると思うけど胸肉のほうが好みかな。バルサミコなんてねえよって人は代わりに酢を使って砂糖多めにすればいいんじゃないかな。トウチジャンなんかねえよ!って人は……どうするんだろ。八丁味噌でも使ってください。彩りがイマイチですが、赤パプリカとか入れたら良さそうですね*1

*1:彩り足りなくて赤パプリカ入れるのあるあるじゃないですか?

プログラミング言語について徒然


って感じで流行りに乗ったハッシュタグを作ったら微妙にみんなやってくれて楽しい。自分も18個くらいやったので、自分の技術的遍歴をたどるためにもまとめておこうと思う。ところどころ加筆したりしてます。

BASIC

兎にも角にも原初に触った思い出深い言語の一つ。MSXを使って命令一つで音出たり絵が出たりするのは画期的だったと思う。サブルーチンとか関数とかの概念が自分の中になかったけど、ただ楽しかった。スプライトをキーボードで動かすプログラムで思い通りに動いたのは感動だった。プログラムを保存するのに回したテープレコーダの待ち時間は尊かった。

Javascript

多分触ってる期間は一番長い。小学生の頃ウェブサイト作る時に無闇に時計とか配置してた。ウェブサイト改装の度に触ってきた気がする。ウェブサイトで色々作っていた時はオブジェクト指向やる前だったのでなかなか規模の大きいものはできなかった。1年前にまたJavascriptに触ったもののjQueryとの戦いで疲弊し、「Javascriptはもういいかな……」ってなってたんだけど、最近ウェブサイトまた改装しようかってなってVue.js触りだしたりnpmでいろいろインストールしているうちに印象が回復してきた。今はES6を使って色々書いてる最中。

VisualBasic

むかーしゲームを作ろうとして導入。しかしできたのは時計のアプリくらいだった。タイマーの概念はおろかファイルの入出力すら理解していなかったので無理も無い。使用期間も短い。

C

やはりこいつは避けられない。メモリの使い方や基礎的なアルゴリズムはこれで学んだ。WinAPI叩いてシューティングゲームも作ろうとしてみたリもした(スクリプトを実装するのが面倒くさくて挫折)。大学ではモータの制御するプログラミングで使ったりもしたし、趣味でマイコン動かすときにも使ったし、地味に最近転職する時に書いたりもした。メモリ管理が雑だとすぐにバグになるし、そのくせコンパイル時に起こってくれなかったりするのでモダンな言語に比べるとやっぱ使いづらい。でも触ってきた中で一番コンピュータと近くて、コンピュータを動かしているという実感が得られる。そんな言語だった。

C++

オブジェクト指向はこいつで学んだ。テンプレートについて理解したのは大学に入ってから。boostだったりとかモダンなC++には触ってないので理解は浅い。でもこの言語でプログラミング技術に関して重要な部分を学習したということもあって思い出深い言語ではある。

Perl

こいつとは付き合いは古い。長くはないが。昔のBBSのソースをいじるために使ったのが最初。そのあと大学時代のバイトで使ったこともある。オブジェクト指向の熱に当てられてオブジェクト指向的な書き方をしてみたもののゴミを生み出して仕事をやめた。思い出深いといえば思い出深い。もう一回書けと言われたら拒否する。

php

一瞬CGIの設定で触る機会があった。とにかくソースコードが<?で始まるのが無理、という感じでそれ以来毛嫌いしてる。毛嫌いしていいと思う。

Python

RubyApple臭するからなんかやだな~~という感じで始めた言語。由来であるモンティ・パイソンはこれがきっかけで見始めた。なにげに院でのプログラムでも活躍。過度の抽象化によりゴミができてしまったが。振り返ってみるとインデント構文により括弧が少なくなるのがかなりメリットがあったように思える。その頃使い出したEmacsでTABキーを押すだけでよきに計らってくれたのも大きい。型もRubyよりはうるさいのでそういった点でのバグが少なかったように思える。そしてリスト内包表記が最高。

Haskell

始めて触った関数型言語。最初はマイナー言語やりたいなーって感じのミーハーな出来心で初めたものの、次第にその記述力に感心していく。型さえ見ればなんとかなる。型はドキュメントだ!モナドもなんとなくつかめてきた感じはある。Twitterのbioに書きつつも全然成果を出していないので出したい。ビルドツールのstackだってあるしライブラリの勘所なんかも掴めつつあるので何かしらソフトウェア作りたい。

Erlang

何故か触っているサーバ用言語。Haskell触って関数型言語かぶれたあたりで目をつけ始めた記憶。こんな簡単に並列化してよいのか……。というか並列化前提で進んでいくのが面白い。関数一つがそのままプロセスになる感じ。書き方も独特でとっつきにくいと言われるけど、個人的にはソースの見た目が好き。これ使って何かサーバ書きたい!と思わせるくらいには良い言語だと思う。OTPを制したい。

Ruby

就職で有利になるかもしれないと思いちょっと書いた。でもリスト内包表記がないのが個人的に辛い。それにゆるゆるなオブジェクト指向もかえってしんどいよなあ……と思うし。Python覚えてるしそっちのほうがトレンドになる気もするし、Railsはあれど別覚えなくていいかな……。

matlab

学部での研究に使った。触った時は?、??wwwみたいな感じだけど今思うとじっくりやればすごいことできるのかもしれない。でも個人で処理系買うには高すぎる。Raspberry Piなら無料とか言われても。モータの制御のシミュレーションに使ってて、外部プログラミングとの連携使ってシミュレーションと実機のソースを一致させて比較みたいなことやりたかったんだけど院に入って研究室が変わりお流れに。

Prolog

関数型触る前に触った。何も意識してなかったがこれがErlangにつながるのかと思うと興味深い。全くパラダイムが違う言語に触って戸惑ったものの、非常に楽しかったと思う。触った時の驚きはHaskell以上だったんじゃないかな。

TeX

チューリング完全だし入れてもいいよね!大学時代はひたすらお世話になった。数式の美しさは随一……なんだけどやっぱり書きづらいので早くいい感じの代替が出てこないかなとは思ってる。プリコンパイルする言語とか出てくればいいんじゃないかとも思うけど、いかんせん使う層が比較して少ないためそういうものも生まれてこないんだろうなあ。

Julia

流石にネタがないので「触りたい」ものも入れる。いい感じにかけて速いし関数型なオレオレ言語らしい。数学的な記述がソースコード上でもできるとか。これ使って機械学習とかそれっぽくていいですよね。『ゼロから作るディープラーニング』という本も買ったのでちょっと実装してみるのはありかなと思う。

Lisp

いつかは触らなきゃなーと思いつつ触ってない。Emacs使いなのに。括弧の多さと処理系の多さが決め手に欠ける。でもやっぱ関数型好きならな~。触りたいよな~。

Coq

プログラミング言語というか定理証明システムなんですけど、このあたりの理論的なことをきっちりやっておくとプログラミングと言うかソフトウェア開発技術につながっていきそうなのでやっておきたいなーという感じです。

HTML/CSS

もうマークアップも入れていいよね!扱ってる年月なら間違いなく一番長い。そらもうNetscape Navigatorが2とか3の頃から。フレーム使ったサイトとかテーブル使ったサイトも作ったしCSSもがんばった。2000年代位にHTMLは「何か作ってる人間がネット上に何かを発信するためには必須の技術」だったってのは結構すごいことなんじゃないかと思うんですよね。最近はHTML5に触り、わざわざテーブルに角丸の画像突っ込まなくても角丸ができたり、みたいなところを中心にその威力に驚いてるところです。

とまあ、そんな感じでプログラミングについて語ったのでした。色々思いはあるけれど、なんだかんだ言ってプログラミングしてコンピュータを思いのままに操るのって楽しいよね。

Vue.jsでスクロール範囲内に入るとクラス付加するやつ

ウェブサイト作りながら少し成果上がったので公開していくことにする。作ったのはスクロールして画面内に入ったらクラス付加するやつ。簡単な例だけどメモとして。

まずvueファイル。

// in-screen.vue

<template>
  <div v-bind:class="{active: isInScreen}">
    <slot></slot>
  </div>
</template>

<script>
export default {
  props : {
    offset:{
      type: Number,
      default: 0
    }},
  data() {
    return {
      scrollY: 0,
      height: 0,
      position: 0,
    }
  },
  mounted() {
    window.addEventListener('scroll', this.onScroll)
    window.addEventListener('resize', this.onResize)
    window.addEventListener('load', ()=> {
      this.onScroll()
      this.onResize()
    })
  },
  computed:{
    isInScreen(){
      if(this.scrollY > this.position + this.offset){
         return true
      }else{
        return false
      }
    }
  },
  methods: {
    onScroll () {this.scrollY = window.pageYOffset},
    onResize () {this.height = document.documentElement.clientHeight} ,
    getPosition () {
      if(this.$el){
        return this.$el.getBoundingClientRect().top +
            this.scrollY -
            this.height
        }else{
            return 0
        }
      },
    }
 }
</script>

isInScreenを算出プロパティとして定義させて必要な時に再取得させる。んだけど他のスクロール量とかはリアクティブに出来ないのかな。要検討。CSS書いてないけどのファイル内でのスコープ限定して書けるらしい。んで動かすのがこれ。

// app.js
import Vue from 'vue'
import InScreen from './in-screen.vue'

const sweetScroll = new SweetScroll();
new Vue({
  el: '#app',
  components: {
    "in-screen": InScreen,
  },
})

コンポーネントごとにファイルまとめられるのでいい感じがする。JSfiddleで動作でも作って貼り付けたかったけど、単一ファイルコンポーネントの動かし方がいまいちよーわからんかったので割愛。サイトで使ったコンポーネントはどんどん上げていきたい。

素人が選んだWebフロントエンド開発環境

はてなトップのカテゴリに開発環境について載っていて、最近ほぼイチからWebフロントエンドの開発環境を整えたぼくにとってタイムリーな話でもあり、あとで環境触った時にわけがわからないという事態を避けるためのメモとしてここに残していこうと思います。

ネットワークとか


ローカルの作業環境はこんな感じ。下のSurfaceでプレビュー見ながら上のデスクトップマシンでコード書く感じ。で、ローカルでファイルをいじっているのではなくこんな感じにリモートで編集してます。

こんなまどろっこしいやり方しなくてもローカルでサーバ立てればいいじゃーんとはぼくも思うんですが、でかい画面に繋がってるのWindowsしか無いし、WindowsUnix系のソフト使うのも使いづらいし……ってこんな感じになってます。リモートリポジトリの意味がない……。でもローカルでサーバ立てたりコンパイル走らせたりしないと重くなったりしないからいいかな。

ソフト編

1週間位でフロントエンドではやってそうなやつ全部のせって感じになりました。以下入れたもの。

  • npm
  • gulp
  • pug
  • Sass
  • babel
  • browserify
  • Vue.js
  • vueify
  • browser-sync

なんかめっちゃソフト多いけど、Webフロントエンドじゃ普通なんですかねこれ。以下ざっくりと感想とか。

pug

とてもソースが見やすくなった。Emacsにpug-mode入れておけばあとはTAB押してればよきに計らってくれるので非常に楽。特に難しいこともなく雰囲気で書ける。入れてよかった。このあと複数ページ生成する時又役に立ちそう。

Sass

ファイル分割できるだけで文明を感じる。Sass記法ならインデントだけでネストできるのに文明を感じる。この二つのおかげで雰囲気で書いててもごちゃごちゃにならないので文明を感じる。

babelとbrowserify

ファイル分割でk ES6まだそんなに書いてないけどちょいちょい良さを感じる。やっぱりファ

browser-sync

神。無神論者なのに神と言いたくなる。ファイル変更を察知して自動で更新してくれる。マルチディスプレイにしなくてもタブレットをそばにおいて似たようなことができる。とてもいい。

Vue.js + vueify

まだちょろっとしたものしか書いてないけどVueのコンポーネントの良さがわかってきたような気がする。値勝手に変わってくれるの楽。

入れたものはこんな感じで。以下は導入見送った物。

webpack

Browserify+gulpで同様のことできるし特にいらないんじゃないか……?といった感じ。これ以上ツールを増やす必要が見られず保留。

CoffeeScript

括弧も少ないしいいんじゃなーい?と思ったけど各所からオワコン扱いされてたし、ES6のこともあるしそこまでJavascript辛くない気もしてきたので見送り。

Purescript

とても色物くさくて大好きなんですが実際のところで使えるかって言うと……。あとで実験的に触ったりしたいところではありますね。

知識のインストール、バーストモードで

雑に取った有給をウェブサイトの構築に費やしてます。いや、ウェブサイトの構築というよりかはツールの使い方でしょうか。昨日から今日にかけてGit、Sass、pug、gulpの使い方をとりあえず覚えた。node.jsがJavascriptってだけで毛嫌いしてたけど、本当にすみませんと言うしか無い。アプリケーション使うだけならめっちゃ便利でした。

2日間でめっちゃ知識をインストールした感じあるけど、実際のところ負荷はそんなにない感触。せいぜいツールの使い方だけだしSassなんかはCSSに色つけた感じだしね。Sassのイディオム的なものは検索して見つかるけど、どんな感じにファイル分けするかとかどこでどう変数使うかみたいなノウハウってどうやって手に入るんだろう。というかCSS書いてた時代も雰囲気で書いてたし、そのへんの知識がまるでない。

あとVue.jsを触りたいんだけど現状前に作ったHTML・CSSをpug・Sassに変換するのがやっとという感じ。pugはともかくSassの方は単純に変換しただけではメリットないのでそのへんの共通化とかも考えないといけないので更に辛い。Sassっぽい書き方というのがつかめれば楽なんだろうけどなー。Javascriptに関してはCoffeescriptの導入も考えましたが「最近イケてない」らしいので見送り。TypeScriptは導入するメリットそんなないかなと思ったので結局素のJavascriptに戻るのであった。辛い。Purescript*1も楽しそうだけど、流石に学習コストが高い。

そうそう、gulpでAの処理終わってからBの処理するってのを書いてたんですが

gulp.task('pug-reload',['pug'],function(){
		return browserSync.reload();
});
gulp.task('sass-reload',['sass'],function(){
		return browserSync.reload();
});
gulp.task('js-reload',['js'],function(){
		return browserSync.reload();
});

って感じにボイラープレートになってしまって何かいい方法ないんかなって頭捻ってます。

gulp.task('seq-reload',[引数],function(){
		return
 		(引数に書いてあるtask実行)
		browserSync.reload();
});

みたいに引数で処理分けることができればいいんですが。「gulp 引数」でググってもコマンドライン引数についてしかでてこないし。

*1:HaskellJavascriptにするやつ