Make組ブログ

Python、Webサービスや製品開発、ライブラリー開発についてhirokikyが書きます

JavaScript

highlight.jsで行ごとに区切りつつハイライトする

highlight.js というコードハイライトをするJavaScriptのライブラリーがあります。 highlightjs.org このライブラリーで、「行ごと」にHTML要素を分割しつつハイライトする方法を説明します。 highilght.jsの基本的な使い方をおさらい highlight.jsは基本的…

Vue.jsでAPIにないフィールドはモデルにも作らないプラクティス - モデルとViewModelの区別の仕方

前回の記事はこちらです。先に読まれておくことをオススメします。 blog.hirokiky.org モデルに置く値、ViewModelに置く値の区別をつけよう Vue.jsで開発するときに、モデルに置くべき値とViewModelに置くべき値を区別できればかなりキレイに設計できます。 …

JavaScript (ES6) でAPIから受け取ったデータをモデルに入れるプラクティス

フロントエンドのJavaScriptで、バックエンドのAPIからの結果をモデルに入れるプラクティスについてまとめます (より良い方法があったら教えてください)。 まず、以下のようなレスポンスがAPIからあると想定します。 { "id": 1, "username": "hirokiky", "…

Spacemacsでvue-modeかつflycheckする

emacs(Spacemacs)+ vueファイルをずっと模索している。 というのもjs2-modeがmmm-modeに対応しないので、JSを書くときにjs-modeで不便だったりする。 web-modeを使っても似たようなものなので、なんとかしたいこの頃。 模索中の設定 .spacemacs に以下追加…

CodeMirrorでphrasesオプションを使ってUIを日本語化できるようになったという話

2018年8月25日にリリースされたCodeMirrorの5.40.0から、検索ダイアログなどのUIを日本語化できるようになりました。 New features New method phrase and option phrases to make translating UI text in addons easier. github.com 何が嬉しいのか CodeMir…

Webpack (v4) で複数のJavaScriptファイル、CSSファイルを分けてビルドする

webpackは便利ですが設定などは慣れが必要です。 僕は面倒なので、毎度自分の過去のプロジェクトからコピーして使っています。 その内容から抜粋してブログの記事にしています。 想定としてはSinglePageApplicationとしてはアプリを作らずに、フレームワーク…

framesetタグの間でjs使うとうまくいかなかった。

<frameset rows="50%, *"> <frame src="http://d.hatena.ne.jp/hirokiky/"> <script type="text/javascript"> <!-- document.write('<frame src="http://d.hatena.ne.jp/hirokiky/">'); document.close(); --> </script> </frameset> これだとフレーム下側のサイトが表示されなかったので、 ごとjsで出力したらうまくいった。