サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
災害への備え
muunyblue.github.io
最近React Hooksに入門してみていて、reduxを意識したuseReducerというAPIと Context APIが気になったので素振りしてみました。 あとFunctionalに書けるHooksとTypeScriptは相性が良いのではないかと思ったので すべてTypeScriptで書いていきます。 canvas animation framework yymm/hooks-canvas-sample 素振りするにあたりお題があったほうが良いので、今回はcanvasでanimation framework的なものを作ることにしました。 ※ 動いているアニメーションはそのframeworkに乱数と円軌道を使った描画関数を適当にのせたものです。 仕組み menuでrequestAnimationFrameを使用してアニメーションを開始、 Context APIを利用してframe等のデ
インフルを発症してだいぶ落ち着いてきたので転職エントリでも書いてみることにしました。 よくありそうな受託開発の会社からスタートアップへの転職話です。 私は大学の頃に物理学を選考していて、複雑怪奇な数式を見ると妙にテンションが上ってしまうような 性分であったので受託開発時代は主に数値計算系の業務をしていました。 使用していた主な言語は頻度順に、C、C++、Fortranです。 ちなみに私は大学の頃すごく理解度が低いままC言語を書いてしまっていたので(最たる例はメモリ解放の意味を理解していない)、 入社して数カ月はめっちゃ苦しんでC言語とC++を覚え直しました。 この経験から後輩にはちゃんと理解してほしいと思い後輩のサポートを進んでやるようにしていました (新人教育にC言語を使うのどうなの...) 。 仕事自体はとても楽しく話の合う先輩や後輩もいたので7年間も勤めました。 今も仲良くしたいと思
LEDの輝きと黒の透過キーキャップを活かして中二ぽい感じに仕上げてみました。 自分が感じたZen Keyboardの特徴です。 キー数は62keysで自作キーボードの中では過不足ない部類 設計者が日本人でないため少し大きめ(親指の位置はErgoDoxと同様) バックライトが使える PCBのみで形成されている bottomのPCBプレートが最下面なので厚みが最小限に抑えられ薄い アクリルに比べると硬いので打鍵時にぐらつきなどが少なく安定している 個人的にZen(またはSol)をおすすめしたい層ですが、ErgoDoxを気に入って使っているが以下のような不満がある人におすすめしたいです。 ちょっとキー数多すぎじゃないかと感じる ErgoDox分厚いなぁ、もっと薄くならないかなぁ リストレストを使っているがリストレスト自体でかいし幅取りすぎと感じる キーボード光らせたい 購入方法 Zen Keyb
VimでLanguage Serverを活用する(Rust, Vue.js)で中途半端にしていたVue.js開発がほぼ完成したのでまとめます。 これでVSCode+Veturと同等にVue.js開発ができます。 LanguageClient-neovim autozimu/LanguageClient-neovim LSPのクライアントにはこれを使います。 最近ずっと更新を追っていますが去年の12月にPythonからRust化しています。 そこからはnextブランチで活発に開発(2,3日でリリース)が進んでいます。 なので割と不安定でupdateするとうまく動かなかったりします。が次のバージョンで治ることが多いので2,3日待つと良いです。 (20180117現在最新ではうまく動かなくてv0.1.27 7d0a5ccを使っています。vim-plugなら'commit': '7d0a5cc',
"Settings > Language Supprt"を開きます。 "Install / Remove Languages"でJapaneseを選択します。 Applyすると、デフォルトでfcitxとfcitx-mozcがインストールされます。 "Keyborad input method system"でfcitxが選択できるようになるので選択します。 再起動するとfctixのKeyboardアイコンがPanelに表示されます。 アイコンをクリックして"Configure"を選択します。("Configure Current Input Method"は現在の設定なので再起度後反映されないので注意) はじめはEnglish(US)しかないので、Mozcを追加します。 "+"ボタンをクリックして、"Only Show Current Message"のチェックを外してmozcを検索/追加
遅刻しましたが Vim2 Advent Calendar 2017 22日目の記事です。 VSCodeを使っていると知らない間にお世話になっていたりするLanguage Server Protcol(LSP)ですが、便利なので少しずつVimでも活用してみています。 実際に最近使っているRustとVue.jsの例を紹介をします。 2018/01 Vue.jsのほうをまとめ直しました => Neovim/Vim8で快適Vue.js開発(Vue Language Server) ※ Neovimでしか動作検証してません・・・使っているプラグインはVim対応してるので多分Vimでも動きます プラグイン構成 補完とLinterが欲しいので以下のプラグインを入れます。 LanguageClient-neovim deoplete.nvim neosnippet ale プラグインマネージャーなお好きな
WebAssembly(以下WASM)には興味があって遊んでみたいと思っていたら、rustifyという便利な魔法が先日GitHubに現れたので使ってみました。 続編のほうが詳しいです => rustifyでWebAssembly - ライフゲームを作る ElectronでWASMを使ってランダムウォークをしてみます。 embed.ly 準備 Node.js環境をnvmで、Rust環境をrustupで準備します。 % nvm install --lts % rustup update rustifyを使うための準備です。 % rustup target add wasm32-unknown-unknown --toolchain nightly % cargo install --git https://github.com/alexcrichton/wasm-gc Rustのブロジェクトを
flask-vue.js demo yymm/flask-vuejs: Example & Tips, Flask with Vue.js. FlaskとVue.jsを組み合わせて使うサンプルリポジトリを作っています。 Vue.jsは小さく始めることが出来るので、サーバサイドのテンプレートエンジンと抱き合わせて使うことも可能です。 巷ではSPAやSSRが流行っていますが個人的にはシンプルで好きです。 Delimiterの変更 デフォルトではFlaskのテンプレートエンジンJinja2とVue.jsのDelimiterは同じものを使用していて上手く動かせません。 ですが、FlaskもVue.jsもDelimiterを変更できます。 from flask import Flask class CustomFlask(Flask): jinja_options = Flask.jinja_opt
docker-composeを使うと連携する複数のコンテナを割と簡単に構築できます。 アプリケーションコンテナや開発用コンテナからデータベースコンテナを扱う際に気になったことをまとめてみます。 ✗TOC データベースの永続化 redis mysql postgres mongo データベースを参照する方法 portの指定 データベースの永続化 データベース内のデータは永続化しないと消えてしまうので、残したい場合は明示的に永続化させておく必要があります。 公式のイメージの設定例(redis, mysql, postgres, mongo)を書きます、ホストのディレクトリにマウントする方法(data volume)を採用しています。データコンテナを使う方法は書いていません。 redis Docker Hub /dataをマウントすると良いようです。docker-compose.ymlに以下のよ
開発環境を作ってるの楽しい人種なので定期的に開発環境を見直したくなります。 Dockerを使ってポータブルな開発環境を手に入れたので紹介します。 開発用コンテナと各種データベースコンテナをdocker-composeを使って構築します。 ✗TOC Dockerポータブルな開発環境 開発用コンテナ ベース 各言語 Ruby (rbenv) Python (pyenv) Golang (1.5) Node.js (nvm) データベース データベースコンテナ 付録 Dockerfile docker-compose.yml Dockerポータブルな開発環境 "docker-compose up -d"で開発環境が出来上がります、すごい。mysqlやredis他も使える、すごい。 ディレクトリ構成は以下のようになっています。 |-- data | |-- mongo | |-- mysql |
開発中なのもありよく動かなくなっているので試したことリストの備忘録です。 公式でもなく完全な対処方法であるかの確認もしてないので参考程度にして下さい。この方法で解決できない場合はIssueかなぁという判断基準にはなるかもしれません。 順番や番号に意味はありません。 1. プラグインのアップデート 2. :CheckHealth 3. has('python3')確認 4. python3のインストール 5. neovimパッケージをインストールまたはアップデート 6. :UpdateRemotePlugins 7. Neovimが古い 1. プラグインのアップデート :call dein#update() :NeoBundleUpdate など 2. :CheckHealth :CheckHealth このコマンドを実行して出てくる内容に応じて後述の対処をします。 3. has('pyth
11月あたりからvim環境を見直して概ねまとまってきたのでメモとして残しておきます。 概要は Neovim導入 プラグイン整理(neobundle => dein.vim) Neovim/Vim/Nyaovim対応 になります。 設定ファイルはGitHubの.dotfilesにあるのでこちらを見ればこの記事は読まなくてもいいかもしれません。 embed.ly Neovimはじめました Neovimのインストールはパッケージマネージャーから 設定ファイルの場所 Nyaovimもはじめました プラグイン整理 dein.vim iceberg neoterm neomake deoplete.nvim vim-airline Vimfiler 関数内検索 Neovimはじめました Home - Neovim Neovimのterminal modeに感動してNeovimをはじめてみることにしまし
型付きPythonは静的型解析ツールであるmypyによる検査と、jediによる補完が効くという開発に役立つ便利な恩恵があります。 実行時には(まだ)型の恩恵はないですが始めるには十分な恩恵だと感じたので始めてみました。 venvとmypyを使うので、Python3と言ってもPython3.5(現在の最新版)を使います。 スタイルチェックにはflake8を使用します。 Vim(Neovim)の準備 :echo has('python') :echo has('python3') コマンドが1を返すことを確認します。もし0の場合は、Pythonを有効にします(有効にする方法は"vim python 有効"で検索)。 Python3.5のインストール ※Python3.6も出るみたいなので適宜その時の最新版をインストールしてください パッケージマネージャーでインストールするとPython3.5が
Python3.3からvenvというのが入ってきてvirtualenvを置き換えられるという感じでしたが、日本語情報では色々不便という情報が多かったのでなんとなく敬遠していました。しかし、Python3.4からensurepipという便利なものがvenvで使えるようになって、煩わしさがなくなっているようなので使ってみました。 ※Python3.4以上を対象にしています。 pyenv 使っているOSのパッケージマネージャでは新しいPythonはすぐにインストール出来ないので、Pythonのバージョンマネージャが必要です。 そこでpyenvです。 embed.ly インストールはREADMEにまとまっていますのでそちらを参考にするといいです。 インストール可能なPythonの一覧を確認して、3.5と3.4をインストールしてみます。 $ pyenv install -l $ pyenv inst
Vimに比べるとVSCodeのほうが引き継ぎのときに楽なのではと思い立ちVSCodeをはじめてみます。 エディタに求めていること 素VSCodeを眺めて普段エディタに求めている最低限のことについて考えてみます。 基礎として理解しておきたい部分 プラグイン機構 プラグインでできることと設定でできることの境目 求めること Vimキーバインド File Tree(トグル、ファイルオープン) Gitプラグイン(コマンドラインのインターフェースがあると良さそう) コードハイライト 入力補間 画面分割 コマンドラインインターフェース(makeなどそのまま叩く) しかし大事なのは余り複雑にしないことかもしれない。 (後述しますがIntegrated Terminalを使うことでgitコマンドやmakeなど普段Terminalで実行しているコマンドは全て実行することができます) 基本設定 ユーザー設定でフ
このページを最初にブックマークしてみませんか?
『muunyblue.github.io』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く