プラウダ

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

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


って感じで流行りに乗ったハッシュタグを作ったら微妙にみんなやってくれて楽しい。自分も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にするやつ

やりたいことの雑多なメモ

技術ってのは使わないと衰えるもんで。そんな理由もありまして現在有給をぶち込みつつウェブサイトを改装すべくいろいろ調べてます。調べた結果Gitのリポジトリ作り出す羽目になってるのは???ってなったけどちゃんと理由があってのことなんですよ。やりたいこと優先度高い順に書き出すとこんな感じ。

Gitによるソースコードの管理はこんなページもあったので参考にしたい。
qiita.com
VPSアカウント持ってるんでそこにオレオレリポジトリを作りいい感じで開発できたらな~という感じ。感じが多くてイメージがふわふわしてる。

Vue.jsは簡潔に書けるって噂なので試したいですね。jQueryプラグインでゴリゴリやってみたけどオリジナルのモーダルボックス出すだけでソースコードがさっぱりわけの分からない感じになったのでその辺を簡潔に書きつつリッチなUIを実現したい。Sassも素のCSS書いてるとよくわからないクラスとかでてきて混迷を極めてくるのでやはり導入したいところ。

4つ目のテンプレートエンジンの導入はちょっとむずかしいところ。作品ページに個別URL振って見せたいんですけどそうなるとテンプレートエンジン使って静的にページを生成するしか無いのかなと。.htaccess使ってサーバサイドでスクリプト動かすにしても結局サーバ側での処理が必要だろうと思うし。でもVue.jsのルーティングで解決できるのか……?リサーチ不足なのでなんとも。

最後のBrowsersyncみたいなのを作るのは完全に趣味なんだけどやりたい。構想としてはファイルの変更を察知したらWebsocket経由でHTMLに組み込んだJavascriptに命令を送り込んで自動更新する、みたいなやつを最低限やりたい。それに加えテンプレートエンジンとWebサーバも組み込んで静的ページを生成するフレームワーク的なものを作りたい……まで行くとちょっと風呂敷を広げ過ぎな感じはしますね。

そんな感じで妄想だけは続くのだ。

思考のジャンプ

Erlangで何かくだらないものを作ろうとしてたらいつの間にかnginxをDockerで動かす方法を調べてました。もともとやりたかったことからずれてくる、そんなことありませんか?

女の子の絵書こうとして狙撃銃の採用実績調べてたり、モータの制御調べてたら物理シミュレーション自前で書いてたり、島風漫画描いてたら自衛隊コールサイン調べてたり……。必然を重ねたつもりがやりたいことの全体から見ると全然別の場所にたどり着いたりすることがよくあります。必然だけどそこまでいらねえだろとかどうしてそうなった的な。本人もよく原因がわかっていなく、よく困惑することがあります。そのおかげで艦これのお話とかできたりするので悪いものではないんですけど、コントロールしたいよなとは思います。

そして冒頭の「Erlangで何かくだらないものを作ろう」の前には「サーバアプリケーションを理解しよう」があり、その前に「メールの実装を理解しよう」があったのを思い出して途方にくれているところです。

払ったリソースによる「たが」

今月はブログを更新していきたい。「お金払っちゃったので使っていかないともったいない」というみみっちい理由があったりするのだが。

と言っても趣味にお金払ったからと言って継続したことがあるか考えてみるとちょっと心が痛む。ギターに7万円払ったものの最近全く触っていないし、15万円のロードバイクもあまり使わず手入れが悪いので大分痛んでしまっているし。カメラは……カメラはまだ使っている方なのでまだ大丈夫と信じたい。活躍する場はたくさんある。

つまり払ったお金が対価を得られるよう努力するための「たが」として機能するかというと、ぼくの場合あんまり機能しないのではないか、と思う。単純に飽きっぽいというのもあるけど、払ったリソースにそこまで未練がない感じがある。

なのでブログあんま書いてなかったら「ああ、『たが』が機能しなかったんだな……」と憐れんどいてください。