Corredor

ウェブ、プログラミングの勉強メモ。

Wikipedia の短縮 URL を取得するブックマークレットを作ってみた

Wikipedia には短縮 URL というか、ページ ID を指定して参照できる URL が用意されていることを知った。 参考:WikipediaのURLを短縮する方法 - おねむゲーマーの備忘録 たとえば「World Wide Web」のページの URL は以下のようになっている。 https://ja.w…

Mac の Finder のツールバーにアプリケーションのショートカットを配置する

MacOS の Finder の上部には、デフォルトで「戻る」「進む」ボタンや「表示形式変更」のアイコンなどが並んでいる。 このツールバーに、アプリケーションのショートカットアイコンを配置して、アプリを開きやすくしてみよう、というのが今回の試み。 まず、F…

HTML ファイルだけで Markdown を Wiki 風に表示できる「MDWiki」を試してみた

HTML ファイル1つだけで Markdown ファイルをパースして表示してくれる、MDWiki というツールを試してみた。 Markdown ファイルをパースして HTML 表示してくれるツールというと GitBook などがあるが、HTML ファイル1つだけという最強の手軽さが売り。早速…

Node.js スクリプトから外部コマンドを実行する

Node.js スクリプトから外部コマンドを実行してみる。child_process を使えば簡単にできる。 単純にコマンドを実行し、その結果を表示するだけ コマンドの標準入力に値を流し込む 単純にコマンドを実行し、その結果を表示するだけ まずは、nkf という文字コ…

Jenkins Multibranch Pipeline でワークスペースのパスが長過ぎてエラーになるのを回避する

Windows Server 上で動作させている Jenkins にて。 Multibranch Pipeline を使うと、Git ブランチごとにワークスペースディレクトリが自動生成されるのだが、このディレクトリ名にユニーク ID と思われるランダムな文字列が付与される。これのせいで、Git …

Angular の Router に関する書き方を整理する

Angular 4 以降の画面遷移、Router 周りの書き方を毎回忘れるので、自分用にまとめる。 通常のリンク URL (ルーティング) 定義 リンクする HTML 別の Component (TypeScript) から遷移する ルートパラメータ付きのリンク URL (ルーティング) 定義 リンクする…

Angular の FormArray で項目数が動的に増える入力フォームを実現する

Angular 4 以降の ReactiveForms で検証。 例えばユーザ情報を登録するフォームがあったとして、電話番号と種別 (固定電話なのか携帯なのかなど) を複数入力できるようにしたいとする。 画面のイメージとしては、電話番号テキストボックスと、種別テキストボ…

JavaScript の配列やオブジェクトは参照渡しになる…バグを生む落とし穴

JavaScript において、配列やオブジェクトは参照渡しになる。コレが思わぬバグを生むことに繋がるので、紹介しておく。 今回、「参照渡し」「値渡し」「参照の値渡し」などの議論は避けるが、オブジェクトを代入する際、以下のような挙動をすることは覚えて…

Firefox で Web Push 通知機能を完全 OFF にする方法

最近ようやく Chrome の速さを実感し、特に Mac ではワケ分かんないぐらい重たい Firefox ちゃんであるが、まだまだメインで使っている。 そんな Firefox でインターネットサーフィン (死語) している時に、Web Push 通知が鬱陶しかったので、切り方を調べた…

Mac のスクリーンキャプチャに付くウィンドウの影をなくす・付ける

MacOS 標準のスクリーンキャプチャ。Cmd + Shift + 3 とか、Cmd + Shift + 4 とかで撮れるアレだ。 このスクリーンキャプチャの画像には、ウィンドウの周りにウィンドウの「影」が付く。コレが鬱陶しいというか、ウィンドウの周りまでが透過 PNG 画像として…

Avast Passwords でパスワードを一元管理した

フリーで使えるアンチウイルスソフト Avast は最近高機能になっている。今回はそんな Avast の中に同梱されているパスワード管理ツール「Avast Passwords」を紹介する。 Avast Passwords の特徴 Avast Passwords は、複数のデバイス間で、複数のブラウザ等に…

iPhone Suica が上手く反応しない?タッチする時は、本体上部・カメラ付近をタッチする

iPhone7Plus で検証。 iPhone7・iPhone7Plus 以降で使えるようになった、ApplePay の Suica。定期券の購入もできるので、最近はカードの Suica から ApplePay に移行している。 そんな iPhone7Plus を改札でタッチしようとすると、時たまタッチに失敗してし…

Mac でザックリ grep したい時は mdfind が使えるかも

Mac には Spotlight 検索という機能がある。コレをコマンドラインでも使えることが分かったので紹介。 mdfind というコマンド名で、CLI から Spotlight 検索ができる。Spotlight 検索はファイルの中身も調べてくれるし、メタデータを使って検索するので grep…

Homebrew でインストールできる役立つユーティリティを調べてみた

MacOS の Homebrew でインストールできる、お役立ちユーティリティを調べてみた。今回は3つ紹介。 moreutils dateutils tldr moreutils 便利コマンド一式。 $ brew install moreutils インストールされたコマンドは以下のように確認できた。 $ find /usr/loc…

Homebrew でインストールできるジョークコマンド

MacOS の Homebrew でインストールできるジョークコマンドを調べてみた。 ベースは以下の記事。 参考:仕事の役には立たない、Linuxにおけるジョークプログラムの話 - Qiita Homebrew のインストール方法については以下の記事をドウゾ。 インストールコマン…

Express サーバで CORS を許可する・PUT や DELETE メソッドの通信を許可する

Express で作った Web API サーバに対し、SPA なアプリから GET 通信を試みたら、以下のようなエラーがブラウザコンソールに出てしまった。 Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is …

コマンドライン上でサクッと四則演算をする

以前、以下のような記事を書いた。 neos21.hatenablog.com この記事で紹介していない手法を見付けたので紹介。 expr コマンド bc コマンドにヒアストリングで渡す expr コマンド Bash には expr コマンドという、そのものズバリなコマンドがあった。 $ expr …

package-lock.json を生成しないようにする

npm v5 から、package.json とは別に、package-lock.json というファイルが生成されるようになった。npm パッケージの依存関係が膨らんできて、「依存パッケージの依存パッケージがパッチアップデートしたことでツールが動かなくなった」といった事態が起き…

Adobe Audition CC で音声ファイルのボーカル削除・アカペラ化が簡単にできた

Adobe Audition CC 2017 で検証。 Adobe Audition は、オーディオ編集を行うためのソフト。MIDI や VSTi といった音楽「作成」に関する機能は皆無だが、Adobe Premiere Pro と連携できたりすることから、映像作品のオーディオを編集することに特化したアプリ…

Express と SQLite を使って REST API サーバを作ってみた

Express で REST API を構築、SQLite でデータ永続化を実現して、Node.js オンリーで Web API サーバを作ってみた。 作成したソースコード一式が置いてある GitHub リポジトリは以下。 GitHub - Neos21/node-js-rest-api-sqlite-db: Node.js + Express + RES…

Bash で tree コマンドを入れずに tree 風表示

以前、Windows コマンドプロンプト以外の環境でも、コマンドをインストールすれば tree コマンドが使える、という記事を書いた。 neos21.hatenablog.com しかし、しがないニホンノエスイーの皆さんの中には、インターネットに接続できない職場環境の人もいる…

VSCode の設定を同期する「Settings Sync」を使ってみた

Atom エディタを使っていた時に「sync-settings」というパッケージを紹介したが、今回はコレの VSCode 版である、「Settings Sync」を紹介する。 neos21.hatenablog.com VSCode の環境設定を GitHub 上の Gist にアップロードしておいて、別の環境からソレを…

VSCode 拡張機能を作って公開してみた : non-italic-monokai

ふと思い立って、VSCode 拡張機能を作って公開してみた。 今回作ったのは、non-italic-monokai : Non-Italic Monokai というカラーテーマ。よくある Monokai のテーマはイタリック (斜体) になるシンタックスがあるのだが、個人的にはイタリックが見づらいの…

mermaid.js・mermaid.cli を使って UML 図を描く

昨日の PlantUML (node-plantuml) に引き続き、Node.js 環境で UML 図を描くツールを試してみる。次は mermaid.js と、それをコマンドラインで実行できる mermaid.cli というツールを使ってみる。 mermaid.cli - npm 今回も以下のリポジトリに素振り環境を作…

Node.js で PlantUML を描く : node-plantuml

テキストベースで UML が描ける PlantUML というツールがある。これは元々 Java 製なのだが、Node.js でも使える node-plantuml というパッケージが用意されている。 node-plantuml - npm これを使って UML を描くための素振り環境を作ってみた。 GitHub - N…

npm パッケージとして配信するブログを作ってみた : @neos21/neos-npm-blog

npmjs.com は npm パッケージをホスティングするレジストリである。アカウント登録さえすれば誰もが npm パッケージをアップロード・公開できる。 ということは、npm パッケージの体裁さえ取っていれば、極端な話、好きなファイルを npm publish して、npmjs…

Markdown の強調構文で使う「アスタリスク」と「アンダースコア」の違い

Markdown 記法の中で強調するための記号には2種類ある。アスタリスク * とアンダースコア _ だ。 **これで強調される** __これでも強調される__ これらの2つの違いと、なぜ2つあるのか、というところを調べてみた。 アスタリスクとアンダースコアの違い 「別…

プロジェクトで使う VSCode 拡張機能の導入を推奨する方法

VSCode を使ってチーム開発をしている時、VSCode 拡張機能を導入して Lint チェックエラーを表示させたり、自動フォーマット機能を利用したりしたいが、チームメンバがどのような拡張機能を入れているかは分からない。「あの人、拡張機能を入れれば自動化で…

Mac でも Windows のように「ウィンドウの最大化」をしたい!「SizeUp」を使う

Mac で Windows と同様の「ウィンドウの最大化」を実現するためのフリーソフトを探した。 Mac の「ウィンドウの最大化」はダサい SizeUp のダウンロード・インストール 設定項目 以上 Mac の「ウィンドウの最大化」はダサい Mac における「ウィンドウの最大…

Windows コマンドプロンプト以外でも Tree コマンドが使いたい!

Windows コマンドプロンプトで唯一便利だと思うのは tree コマンドだ。カレントディレクトリ配下のファイル構成が一目で分かる。 今回はコレを Mac や Linux でも使えないか調べてみた。 MacOS で tree Linux で tree Windows で tree 以上 MacOS で tree Ma…