mizdra's blog

ぽよぐらみんぐ

2015年の振り返り

振り返り

2015年の振り返りをする。本当は年が明ける前に投稿したかった

"今年"は2015年、"来年"は2016年のことを指す。

プログラミングを振り返る

  • 1月: メタ言語学習
  • 2～4月: JavaFXでツール製作
  • 5月: 非IDEエディタへの移行作業
  • 6～8月: Node.jsでフロントエンド開発
  • 9～11月: ES6学習
  • 12月: TypeScript学習

1月: メタ言語学習

Sass, Jade, TypeScriptなどのメタ言語について調べた。この学習では既存のWeb言語の問題点やそれを解決する手段、メタ言語を利用するメリットを知ることが出来た。調べたついでに記事も書いた。

http://qiita.com/mizdra/items/ae766eb9bc9e562344a6

2～4月: JavaFXでツール製作

HTML以外での初のGUIアプリ作成だった。 最初に僕がJavaFXを使おうと思ったのは、FXMLと組み合わせることでHTML感覚でGUIアプリを作ることが出来ると思ったから。実際にはJavaFXを触る上で、クラスとメソッドを使ってコンポーネント操作をする際に、今までとは異なる知識が要求された。その知識を身につけるまでにかなりの時間を掛けてしまった。約三ヶ月。長かった。

ちなみにこの時期からQiitaやITニュースで技術系の記事を平日は毎日読むようになった。

5月: 非IDEエディタへの移行作業

以前までは開発環境としてIDE(NetBeans)を利用していたのだが、以下の理由から軽量な開発エディタに乗り換えたいと思うようになった。

  • 重い(起動が遅い, メモリの大量消費)
  • 使わない機能が多すぎてIDEを十分に活用出来ていない
  • 高機能ゆえにメニューが複雑
  • IDEに依存したプロジェクトになってしまう(例: NetBeansプロジェクトはnbprojectフォルダに依存している)*1

取り敢えずIDEではないエディタで当時話題になっていたものを調べた所、Atom, Brackets, Sublime Textあたりが候補に挙がった。 最終的には全て実際に使ってみて、快適そうだったBarcketsに乗り換えた。(Atomは重すぎ, Sublimeは初期設定が面倒だった)

当時はよく考えていなかったが、Node.js開発をするにあたりCLIを積極的に使うので、CLIと連携しやすい非IDEエディタを選んだのは正解だったと思う。

6～8月: Node.jsでフロントエンド開発

一年前に軽く触ってから放置していたNode.js開発を再開した。ただし一年前とは違い、サーバーサイドではなくフロントエンドの開発にNode.jsを利用した。はじめにgulp, webpackなどのビルドツールについて調べ、それからbabelの開発環境を作った。この辺りの情報は日本語のものが少なく、またすぐに古くなってしまうため、積極的に公式ドキュメントから情報収集した。僕は英語が苦手だったので読むのに苦労した。英語もっと勉強しなければ。

9～11月: ES6学習

夏に作成したbabel開発環境を使ってES6の学習を進めた。特に大規模開発に利用されるES6 Modulesを中心に勉強した。ES6学習をする中で、テストを導入してみたり、npmモジュールを作って公開してみたりと色々なことをやった。自分の作ったツールが公開されるということは、誰かに利用される可能性があるということで、他人に見られても恥ずかしくないコードを書くように心掛けた。

正直、この時点でオブジェクト指向プログラミングやソフトウェア設計について学んでおけば良かったと思う。来年はちゃんと勉強しよう。

12月: TypeScript学習

ここまでNode.js -> ES6と学習してきて、やっとTypeScriptの学習を始められた。本当はもっと早い段階でTypeScriptをやろうと思っていたのだが、CLIの操作に慣れていなかったので、先にES6学習をするという形を取った。(別にそのままTypeScriptやっても躓く要素なかったと思う)

この学習ではES6で書いたnpmモジュールをTypeScriptで書き換える作業をして、型付き言語に慣れることからはじめた。また、よりTypeScriptの機能を活かせるようにVSCodeにエディタを乗り換えて開発をした。下旬は年末で忙しかったため*2、あまり作業は出来なかった。残念。

以下は実際に作成したnpmモジュール。

GitHubを振り返る

f:id:mizdra:20160103192801p:plain

TypeScript学習を期に積極的にコミットするよう心掛けたが、全体的には殆どコミットしなかった。
開発欲はあるのに作りたいものが無い、という状態が半年くらい続いているので来年はそれを何とかしたい。

学業を振り返る

今年は大学入試を控えた受験生だった。夏休みまでは学校で勉強していたのだが、とある事情により*3、それ以降は自宅学習に切り替えた。今考えると家よりも学校のほうが勉強してたし、この選択は間違ってたと思う。今年一番後悔してる。

そんな後悔と受験への不安を抱えていたが、受かったらラッキーと思って出願した推薦入試に見事合格してしまった。
正直落ちたと思っていた。本当に良かった。

何はともあれ、自分の受験に関わった方々に感謝したい。
ありがとう先生。ありがとう家族。ありがとう大学。

今年読んだAdvent Calendar

興味をもった記事だけ読んだ。

全く読まなかったもの

一年を通して振り返る

記事とかドキュメントとか沢山読んだお陰で色々なことを学ぶことができた。また、受験を通して将来について考える時間を取れたのは非常に良かったと思う。今まで自分が何となく考えてた進路がより明確になったことで気分がスッキリした。

来年は引き続きjs、加えてGoやC++も勉強したい。入学予定の大学に詳しい人に話を聞いたところ、大学ではオブジェクト指向プログラミングやソフトウェア設計について殆どやらないそうなので、自分で勉強しようと思う。それと英語ちゃんとやろう。

おわり。

*1:単に自分のプロジェクト管理が下手なせいかもしれない。

*2:イカ楽しい。まだBの雑魚だけど。

*3:教室で騒いでる人たちがいて集中できなかった。辛い。

TypeScript学習のメモ

javascript

忘れないように学習用に使った記事を貼り付けておく。
Node.jsとかES6, ES7関連も一緒にまとめておいた。
完全に自分用。

TypeScript

公式サイト

ソース

仕様

wiki

チートシート

tsconfig.json

.d.ts

gulp

npmパッケージ

その他

VS Code *2

公式サイト

ソース

ドキュメント

Git *4

その他

Node.js

モジュール関連

パッケージとモジュールの違い

package.json

npmコマンド

その他

ES6, ES7

参考にしたリポジトリ *6

Advent Calendar 2015*7

*1:TypeScript 1.5.3が対象

*2:beta以前の記事も混ざってるので注意

*3:TypeScriptの参考プロダクトとして有用

*4:個人的に非常に使いやすい機能だった

*5:ES6仕様に基づいた解説書

*6:型定義の仕方, gulpの書き方, モジュールの書き方などを参考にした

*7:TypeScript全く関係ない記事もあるが一応貼っておいた

TypeScriptの環境構築

TypeScriptとは

簡単にいえば、現在使われているJavaScriptにJavaScript次期仕様に含まれる最新の機能、そして型システムを加えたものがTypeScriptです。

www.buildinsider.net

この記事ではTypeScriptを実行する環境の作り方を紹介します。

nvmのインストール

TypeScriptのインストールにはNode.js環境が必須です。
Node.jsは今後様々な場面で使うので、バージョンマネージャーを入れてバージョンを管理しておきましょう。

補足: ここではWindows向けにnodist, Mac向けにnvmを紹介していますが、類似のバージョンマネージャーは他にも沢山あるので自分に合ったものがあればそちらを使いましょう。

Windowsでのインストール方法

Windowsのバージョンマネージャーにはnodistを使います。

nodistのインストールは以下のサイトを参考にやって下さい。

github.com

$ nodist 4.1.2    // Node.js v4.1.2をインストール
$ node -v         // v4.1.2

Macでのインストール方法

Macのバージョンマネージャーにはnvmを使います。

nvmのインストールは以下のサイトを参考にやって下さい。

qiita.com

$ nvm install 4.1.2        // Node.js v4.1.2をインストール
$ nvm use 4.1.2            // nodeコマンドでv4.1.2を使うように設定
$ nvm alias default 4.1.2  // ターミナル再起動時にも設定を維持
$ node -v                  // v4.1.2

typescriptのインストール

typescriptはnpm(JavaScriptのパッケージマネージャー)のリポジトリで公開されていますので、npmコマンドを使って導入します。

npmについては以下のサイトを参考に。

npmはNode.jsインストール時にデフォルトで入れられているのでそのままコマンドを叩くだけでOKです。

$ npm install -g typescript // TypeScriptをグローバルインストール
$ tsc -v                    // Version 1.0.3.0

これでtscコマンドが使えるようになりました。
お疲れ様でした。

はてなブログで記法を変更する

どうも、mizdraです。 今回ははてなブログの記事を書く時に使われる記法の設定方法を解説します。

はてなブログでは、記事の記法として、

の3つを選択することが出来ます。

見たままモードは直感的に書けるのですが、はてな記法モード・Markdownモードは複雑な文章を簡単に記述できるので、こちらのほうがお勧めです。
その中でも、今回は Markdownモード の設定をしてみようと思います。

Markdown記法に変更する

記法を変更するには、はてなブログのダッシュボードから操作をする必要があります。 設定方法

  1. [ダッシュボード]
  2. 右メニューの[設定]をクリック
  3. [基本設定]
  4. [編集モード]
  5. [Markdownモード]を選択
  6. ページ最下部の[変更する]をクリック

f:id:mizdra:20141122182821p:plain

これで変更完了ですが、注意して欲しいことがあります。
それは、この設定した記法が反映されるのは新しく記事を書いた時のみということです。
つまり、過去の記事の記法を変更するにはその記事を削除し、新しく作成した記事に同じ内容を移すといった作業が必要になります。
過去の記事を従来の記法で編集するのは構わないという方には関係のない話なので、スルーしていただいて結構です。

お疲れ様でした。

Firefoxでアドレスバーからの検索ツールをGoogleにする。

未分類
こんばんは、みずドラです。 今回はFirefoxのアドレスバーについて少し触れようと思います。 FFURLber.png ↑赤枠で囲った部分がFirefoxのアドレスバー Firefoxのアドレスバーの初期検索エンジンは「Yahoo!」です。 Googleを普段使う私にとっては、使いづらいです。 という訳で、FirefoxのアドレスバーでGoogleが使えるよう、設定してみましょう! 使用したFirefoxのバージョンは「20.0.1」です。 ・設定方法 1. アドレスバーに「about:config」を入力し、Enterキーを押す。 2. ページが開いたら、「細心の注意を払って使用する」ボタンをクリック。 3. 「検索(R)」の欄に、「browser.search.defaultenginename」と入力。 4. 検索結果をダブルクリックし、出てきた欄に「Google」と入力。(既に設定されている場合は飛ばす) 5. 「検索(R)」の欄に、「keyword.URL」と入力。 6. 検索結果をダブルクリックし、出てきた欄に「http://www.google.com/search?lr=&ie=UTF-8&oe=UTF-8&hl=ja&q=」と入力。 7. 念のため、Firefoxのタブを全て閉じ、Firefoxを再起動する。 8. アドレスバーに適当なワードを入力し、Google検索が出来たら終了。 Google Chromeを使っているせいか、Google検索が一番使いやすく感じます。 Google好きの人は是非、試してみては如何でしょうか? ・参考にさせて頂いたサイト Firefox デフォルトの検索エンジを変更するには | シュシュ (勝手ながらリンクを張らせて頂きます)

ポケットモンスター・ポケモン・Pokémon・は任天堂・クリーチャーズ・ゲームフリークの登録商標です.

当ブログは @mizdra 個人により運営されており, 株式会社ポケモン及びその関連会社とは一切関係ありません.