Web
背景 クローズドで利用できる OSS の IDE（エディタ）がほしい。 結論 どれも実用に至ると判断できませんでした。以下、試したものと所感です。 Codebox 最終コミットは3年半前 基本的な機能はある ペアプロできる Chrome だと インデント が 3以下 の場合に…
CodePen CodePen とは、ご存知、Webブラウザで完結できるフロントエンドの開発環境です。 https://codepen.io/ CodePan その CodePen の クローン OSS の CodePan というものがあります。これをインストールします。 なお、デプロイ済みのデモはこちらです。…
Portainer これです。 Shipyard という素敵なプロダクトがあったのですが、そちらが終了のためにこちらへの移行がなされています。 結論 以下のような docker-compose.yml になります。 version: '2' services: portainer: container_name: my-portainer hos…
前提 いわゆるシマンテックの証明書の問題 Chrome 70 2018年8月上旬ごろの話です この記事を読まれている時点では状況が異なる可能性があります 参考
nginx の設定ファイルのテスト (dry-run) これです。 $ sudo nginx -t 結論 /etc/nginx/sites-enabled/ 配下などのところに設定ファイルを置いていませんか。
結論 conf ファイルを以下のように書きます（抜粋）。 server { listen 12345; server_name 192.168.123.123; location / { proxy_pass http://192.168.123.124:54321; （以下省略） 上記の設定をすれば、http://192.168.123.123:12345 にアクセスすると htt…
結論 表題どおりです。Squid3 を使っています。 補足 5ch も封じられています。 さらに補足 プリンセスコネクト！Re:Dive (プリコネR)もだめでした。エラーコード「218」が出ます。 考察 さくら や AWS などに建てた場合も封じられているかもしれません。
背景 Twitter API には GET statuses/retweeters/ids: というエンドポイントが用意されており、これを用いると「あるツイートをリツイートした人の情報」を得ることができます。 しかし、このエンドポイントで取得できる人数は 100人 までです。さらに、他の…
状況 メッセージにあるようにシマンテック系の証明書（Rapid SSL）が原因です。 前提 バージョンは 70以上 とします。 結論 以下のいずれかになります。 Chrome 70 以上を使うのをやめる そのサイトを使うのをやめる（推奨） チェックする方法 以下のサイト…
結論 以下の赤枠の中の部分をクリックする。 以下はフルスクリーン時。 補足 けっこうハマりました。
結論 1. webp のパッケージをインストールする。 インストールします。 $ sudo apt-get install webp 2. cwebp コマンドで変換する もっとも単純なコマンドだと以下のようになります。 $ cwebp INPUT_FILENAME.jpg -o OUTPUT_FILENAME.webp
pre タグ 例えばデータベースから \n 込みのテキストを持ってきてそれを Webページ に展開したい場合、preタグ を使うとサクサクと改行を反映できます。が、フォントが強制されるのがつらいです。 white-space プロパティ その場合は white-space のスタイル…
MaterializeCSS とは CSS のフレームワークです。 Cards Components Materialize にはいわゆる「カード型」のコンポーネントを生成できる API*1 があります。 カードを並べると高さが揃わないことがある このカードをそのまま並べていくと、以下のように高さ…
やりたいこと Webページ にメールフォームを設置したい でもサーバサイドのコード書く（環境作る）のはめんどい XSS とか CSRF とかもめんどい 静的ページだけで完結させたい GitHub Pages とか Netlify とか そんな方へ Formspree を使うのはいかがでしょう…
前提知識 ツイートに埋め込まれた外部リンクは https://t.co/1234567890 のような 短縮URL に変換される その t.co のリンクをクリックしたとき、ユーザは以下のリンクの遷移をたどる ツイートのページ → t.co → リンク先のページ*1 つまり t.co はリダイレ…
結論 vue.js をダウンロードしてきて、直接読み込みましょう*1。 <script src="vue.js"></script> だめだったこと CDN（もちろんだめ） vue.min.js を読み込んで Vue.config.devtools = true; を書き加えた この場合、拡張機能のアイコンをクリックした際に「Vue のタブをさっそく見てみま…
概要 Oops, something went wrong. Upload failed というメッセージが出て何回アップロードを繰り返しても失敗する場合の対処としては、「ファイル名を変更してみる*1」とよいということです。 補足 何らかの条件の上で日本語が入っているとダメっぽい気がし…
Song Maker これです。 幻水IIの「回想」を作ってみた 「Cubase 使えばよくね？」となりイントロで断念したのであとはお願いします。
h5ai 以前紹介しましたこれです。 オプション設定 private/conf/options.json でオプションを設定できるのですが、以下の2つはデフォルトから変えておいたほうがよいかなと思いました*1。 *1:もちろん場合によります
ヘッドレス Chrome Chrome 59 から Headless Chrome が搭載されました。PhantomJS の現状を考えると、早めにこちらに移行するのがいいかと思います。詳しくは以下の公式ページなどを。 スクリーンショットを取得する 上記の公式ページに書かれていますが、動…
Lighthouse これです。
目標 最小限。
前提 2018/02/18 現在でかき集めた内容です リポジトリ等へのリンクを付け加えたい
結論 Developer Tools の Network タブを開いて HARファイル をウィンドウの中にドラッグ・アンド・ドロップすればよい。 補足 HARファイル を保存するためには、Network タブのウィンドウ内の適当なところで右クリックをし、出てくるメニューから「SAVE as …
追記 現在では disableHostCheck は不要です*1。この記事を書いたときにバージョンの差異があったようです。 結論 単に webpack-dev-server の実行オプションに --host 0.0.0.0 と指定するだけだではだめ*2。webpack.config.js に devServer を追加し、その…
状況 CSV ファイルを手っ取り早く Webブラウザ で可視化したい場合には CSVtoTable を使ってササッと変換すると楽です。
Yarn ご存知 Yarn です。プチハマりしたところを書いておきます。
さらに補足 Docker で Volume 指定をしたディレクトリを予め作ってしまったことが問題っぽいです（自動で作られる前に）。 Docker で Volume 指定をすると思わぬ権限で上書きされて思わぬパーミッションエラーが出るので注意しましょうということです。 補足…
minio これです。golang です。
nvm ではなく ndenv を使う理由 nvm でのバージョン管理は、ユーザ単位ですべての場所（ディレクトリ）での実行バージョンが統一されます。rbenv のように、ディレクトリごとにバージョンを使い分けたいので ndenv を使います。
