はてなブックマーク

vue.jsのcomponentを .vue という独立した1つのファイルで管理する方法のまとめです。 vue.js公式のガイドではちらっと出たくらいで、vue-loaderなどのドキュメントを読む必要があります。 Rails5.1beta ではいきなりこの形式のhello worldが入っているので戸惑う方が多かったのではないでしょうか。 僕もその一人です。 コンポーネントと単一ファイルコンポーネントを並べて見比べる形の備忘録的なまとめです。 環境 vue: 2.2.6 vue-loader: 11.3.4 vue-style-loader: 2.0.5 vue-template-compiler: 2.2.6 webpack: 2.3.3 当方はjsフレームワークはvue.jsが初めてなのでreactなどとの比較は出てこないです。 componentとは 公式によると コンポーネントは

ベーシックアドベントカレンダー22日目です。 8日ぶり3回目の@tkhrです。 画像の遅延読み込みライブラリ比較の話です。 LPの高速化のために遅延読み込みを導入します。 対象になるLPは広告からの流入で表示するページになります。 なのでユーザの熱を冷まさせない工夫が必要ですね。 そのための工夫の一つとして今回は画像の遅延読み込みに対応します。 画像ならキャッシュがあるじゃん。と言えるかもしれませんが、広告LPなので初めてのユーザが大半なのでアテにできませんね。 なので遅延読み込みによってファーストビューが表示されるまでの時間を短縮することが狙いとなります。 遅延読み込みとは ページにアクセスした時には画像の読み込みはせず、必要になった時に画像を読み込みます。 必要になった時というのは、その画像が表示される時ですね。 それによってページにアクセスした時の読み込み時間を短縮できるので、ユーザ

みなさまこんにちは。 ベーシックアドベントカレンダー13日目です。 担当は@tkhrです。6日ぶり2回目となります。 今回はJSやCSS、PHPのコードが直に書かれたせいで肥大化しているViewをスリムにして、管理しやすい形にしようという計画です。 まずはViewにベタ書きのJSコードを引き剥がして、webpackによってモジュール化することで実現します。 before/after before スクショの右側、L159-163の約20行のJSコードです。 スクショの左側、15このファイル全てに記述されていました。 しかも、.ctpからもわかるようにViewファイルです。 after 1行になりました。 JSファイルはこんな感じ。 admin_uril.js 単純計算で300行近い重複コードを削減することができました。 (20行x15ファイル=約300行） なぜこうなるのか 原因は？ この

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

はじめに JSをほぼほぼ書いたことない私がElectronでアプリを作りながらJavaScriptを勉強すれば、JSに触れられて、HTML＆CSSの理解を深められて、今HotなElectronもできて一石四鳥じゃんと思いアプリを作り始めました。 しかし、BrowserProcessとRendererProcessの関係（あとJS自体の仕様も関係ある？）で勘違いしてハマりにハマったので、理解したイメージを図にします。 ドキュメントにはちゃんと文章で書いてありますが、イメージとしてつかんだ方がわかりやすかったです。 動作確認したElectronのバージョンは 0.37.8 です。 イメージ図 こんな感じです。解説は後述してます。 Electronとは webの技術（HTML,CSS,JS）でデスクトップアプリを作れるもの。 しかもクロスプラットフォーム対応。 AtomやSlackやVisual

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Powerlineが統一されたようですね． 過去の情報が残っていたり，統一後の情報が少なかったりで苦労したので，行ったことを残します． いろいろ試しすぎて記憶が錯綜していたり，集めることができた情報のみで記載していくので，あくまで参考でよろしくお願いします． 今回はMacを対象にPowerlineを導入します． Powerlineのバージョン2.4を対象とします。 zsh，vim，tmuxのインストールとともにPowerlineの設定をします． Homebrewを導入済みとします． 本家ドキュメントを中心にやっていきます． 環境 導入するPC環境 OS X El Capitan iTerm 2 Build 2.1.4 bash 5.2 Homebrew 0.9.9 git 2.8.1 iTerm上で作業していきます。 pyenvとかが入ってるとパスが変わってくるかもしれません（未確認）．

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

PC再起動したいけど今開いてるファイルをまた開き直すのめんどくさい… や 今日の作業は終わったからvim閉じたいけど次作業する時今の状態復元したいからvim閉じれない… vimmerなら一度は思った事があるはずです。 この記事を読めばそんなことにもう悩まされることはありません！ウヒョー まずどういう事が出来るようになるのか、gifで見てみましょう 何が行われてるかというと 1分間に1回、状態を自動保存 :qa等でvimを辞める時、状態を自動保存 プロジェクトのルートディレクトリで引数なしでvimを起動すると自動的に状態を復元 が行われてます。 状態はvimのsessionという機能で保存してます。 sessionは標準のvimで:mksessionで作成出来るのですが、今回はその:mksessionをラップしたプラグインを使用して実現しています。 設定方法 プラグインインストール