タグ

ブックマーク / akabeko.me (7)

  • 技術の流行についてゆくこと - アカベコマイリ

    以下の記事とはてブを受けての所感。 【翻訳】 2016年にJavaScriptを学んでどう感じたか - Endo Tech Blog はてなブックマーク - 【翻訳】 2016年にJavaScriptを学んでどう感じたか - Endo Tech Blog JavaScript による Web フロントエンド開発環境について総括する記事があると、はてブでは拒否反応が多く見られる。特にフレームワークやライブラリの乱立や JavaScript/CSS の Transpiler 周りに忌避感があるようだ。 確かに複雑である。しかし「それが何の問題を解決しているのか?」に注目すれば単純な要素技術の集合であることが理解できるはず。 例えば Browserify、webpack、Babel などの Transpiler/Bundler 系と ES2015 や TypeScript の関係は、JVM や

  • Electron を試す 3 - 簡易音楽プレーヤー - アカベコマイリ

    これまでのシリーズで Electron の開発環境が固まってきので実際にアプリを作成してみたい。サンプルとしてある程度の複雑さがほしいから以前に nw.js を使ってみる 5 - 簡易音楽プレーヤーで実装したものを移植することにした。 設計方針 移植にあたり単純に動かすだけなら NW.js 版の実装を Renderer プロセス部分へまるごとコピーするだけでよい。 しかし今回は Electron らしく Main/Rendrer を分割、ダイアログ表示や音楽ファイルのメタデータ読み込みは Main プロセスで実行させて Main/Rendrer 間の連携は IPC に限定する。 remote を利用すれば Main プロセス部分の機能を Renderer プロセスから簡単に呼び出せるけれど却下。便利な反面 Main/Renderer が密結合になりやすい。特に双方の Object を参照し

  • Electron を試す 2 - パッケージ化におけるプラットフォーム固有処理とコンパイル分岐 - アカベコマイリ

    Electron を試すで残された課題を解決したので、その内容を記録しておく。 2015/10/5 追記 記事のはてブにて id:Pasta-Kさんより .ico ファイルを反映させるために wine が必要との指摘があった。試してみたところ OS X 環境でもアイコンとバージョン情報変更を反映した Windows 向けパッケージを生成できたので追記した。 electron-packager の --icon オプションに .ico ファイルを指定すると OS X でエラーになる問題だが Windows 環境で実行したらパッケージ化に成功。一方、Windows 環境だと OS X 版のパッケージ化がスキップされる。Linux 版は特別なオプションがないためか OS X と Windows のどちらでもパッケージ化できた。 この状況から察するに、アイコンの埋め込み処理などでプラットフォーム

  • Electron を試す - 開発環境の構築 - アカベコマイリ

    これまで NW.js を使ってきたが同じ Chromium + Node 系のフレームワークとして最近は Electron のほうが勢いあるようなので試したくなった。使用感を把握するため、まずは開発環境を構築してみる。 更新履歴 2015/11/5 npm-scripts を babelify 7.2 (Babel 6.x) を採用した内容へ更新。また最新 watchify の Windows 対応について追記した。これらの詳細については babelify v7.2 を試すを参照のこと。 2015/10/19 npm-scripts を最新へ更新、Main プロセスのビルド説明に Browserify の --node オプション解説を追加。 設計方針 package.json と npm だけを使用 AltCSS は Stylus を採用 ユニット テスト対応 コード ドキュメント対応

  • gulp なしの Web フロントエンド開発 - アカベコマイリ

    Web フロントエンド開発において gulp は非常に便利だ。しかしあまりにも gulp に依存しすぎており、これなしで開発できるだろうか?という不安もある。というわけで gulp を利用せず package.json と npm だけで同等の機能を実現する方法を検討してみた。 2015/11/4 追記 babelify v7.2 を試すで babelyfy 7.2 ( とその中の Babel 6.x ) について調べ、npm-scripts の変更が必要なことを確認したので追記。また Windows 環境の動作検証をおこなったところ、最新の watchify なら -o オプションが通ることを確認できた。よって記事の最後の課題が解決したことになる。 2015/9/23 追記 cpx と rimraf を試すの内容をファイル処理に反映して簡略化。 2015/9/15 修正 Stylus

  • React.js を試す - ツリービュー - アカベコマイリ

    前に書いた node-webkit を使ってみる 2 の最後で「簡単なファイラーでも作ってみようと思う」などと宣言したのだけど UI をなにで実装するか迷っていた。 ファイラーの UI は典型的なツリー ビューを採用するつもりだった。しかし長らく愛用してきた jQuery だと内部的なデータ構造と DOM を対応づけるような管理が面倒なのでファイラーみたいなものには向かなそう。 例えばツリーのどこかがクリックされて紐づく内部データを処理したいとるする。jQuery だと DOM 構築で要素の id や class にインデックスを割り当てておきイベント ハンドラで取得判定...という感じになるだろう。しかしこうした連携の仕組みを自前で実装するのはとても辛い。 jQuery、静的 HTML に対して簡単に装飾するならよいのだけど動的な部分が増えると難易度が跳ね上がる。いま仕事で取り組んでいる

  • iOS の動画再生を試す - アカベコマイリ

    iOS アプリで動画を再生しくなったので方法を調べてみた。標準の動画再生 API としは MPMoviePlayerController と AVPlayer の 2 種類が提供されている。そのため両方を利用したサンプルを実装してみる。 再生対象となる動画の選択 はじめに再生対象とする動画の選択方法について考える。 最も簡単なのはアプリ内のリソースとして動画ファイルを組み込む方法である。しかし静止画に比べ動画はかなり大きいため、アプリのサイズに影響する。再生対象が固定になる点もイマイチ。そこで今回はカメラロールから動画を選択するようにしてみる。先月書いた iOS でグリッド表示という記事で作成したサンプル プログラムを元に動画だけ選択する画面を実装。 今回のサンプルでは対象とするグループを ALAssetsGroupSavedPhotos に限定して ALAssetsGroup でコンテン

  • 1