Corredor

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

自作アプリ・ツール

GitHub リポジトリのページと GitHub Pages を行き来するブックマークレット

https://neos21.github.io/about のような URL の GitHub Pages を閲覧中、このページに対応する GitHub リポジトリのページに飛びたいな、と思うことがある。URL としては https://github.com/neos21/about のように変換すれば良いので、頑張れば相互変換で…

iOS のホーム画面にメモ付きのアイコンを置ける「iOS Memo Icon Generator」を作った

「ショートカットメモ帳」というアプリがあり、このアプリの仕組みを見て似たようなモノを作った。 参考:‎「ショートカットメモ帳」をApp Storeで このアプリは、iOS の「ホーム画面に追加」機能と、DataURL の仕組みを利用して、「オリジナルのメモが書か…

「一度しか見られないページ」を公開するサーバを作ってみる

Cicada 3301 というミームをご存知だろうか。Twitter 上に投稿された暗号パズルなのだが、その中で「最初に正解に辿り着いた人しか閲覧できないウェブページ」という内容が出てきた。 最初に正解に辿り着いた人しか閲覧できないウェブページ… 一人しか閲覧で…

Node.js で電卓 CLI アプリを作った : @neos21/calc-cli

CLI で電卓を使いたくて、Node.js でサクッと作ってみた。その名も @neos21/calc-cli : node-calc-cli。 @neos21/calc-cli - npm GitHub - Neos21/node-calc-cli: @neos21/calc-cli : CLI Calculator $ npm install -g @neos21/calc-cli # 「calc」コマンド…

Ruby で自分だけのブックマークアプリを作ってみた

プログラミング言語 Ruby作者:まつもと ゆきひろ,David Flanagan出版社/メーカー: オライリージャパン発売日: 2009/01/26メディア: 大型本 「はてなブックマーク」や「Pocket」など、ログインして利用する系のブックマークサービスを使いたくない場面が出て…

yum や apt コマンドをラップする「pmw」コマンドを作った

Red Hat Enterprise Linux 7 (できるPRO) [ 平初 ]価格: 3300 円楽天で詳細を見る 僕は CentOS 歴が長いので、Ubuntu の apt コマンドに慣れず、ついつい yum コマンドの要領でコマンドを叩いてしまう。また、Windows の Git SDK に同梱される pacman は全…

JavaScript コードをブックマークレットコードに変換する「Bookmarkletify」を作った

ブックマークレットを作る時、エディタで JavaScript コードを書き、それを難読化して縮めつつ、先頭に javascript: とプロトコルを記載したり即時関数で囲んだりする。コレを自動化するツールを作った。その名も @neos21/bookmarkletify。 既に類似パッケー…

m3u8-to-mp4 : .m3u8 ファイルから .mp4 ファイルを保存するバッチを作った

以前、.m3u8 ファイルから .mp4 ファイルを保存する方法というモノを紹介した。.m3u8 ファイルというのは、細切れにされた .mp4 ファイルのプレイリスト情報を持っているファイルだ。このファイルを元に、ffmpeg を使って .mp4 ファイルを結合・生成するコー…

Instagram に投稿された画像・動画をダウンロードする CLI ツール「igsv」を作った

Twitter から画像・動画をダウンロードする @neos21/twsv という npm パッケージを作ったが、それの Instagram 版を作った。その名も igsv。「InstaGram SaVer」の略のつもり。 先に作ったツールの紹介 以降ツールを作るまでの苦労話 以上 先に作ったツール…

Twitter に投稿された画像・動画をダウンロードする CLI ツール「twsv」を作った

Twitter に投稿された画像や動画をダウンロードする際、 画像 : Chrome ブラウザでツイートを開き、画像をアドレス欄までドラッグして開き、ダウンロード 動画 : Syncer - Twitter の動画を保存するための URL 変換器でダウンロード としていた。 コレをもっ…

iOS 13 AVCaptureMultiCamSession を使った複数カメラでの同時ビデオ録画 iPhone アプリを作った

iOS 13 から登場した AVCaptureMultiCamSession という API を使うと、1台の iPhone に搭載されている複数のカメラデバイスを同時に使用できる。例えば、バックの標準カメラで被写体を写しながら、フロントカメラで撮影者自身も同時に撮影したり、といった感…

Windows 向けの共有サーバのファイルパスを MacOS 向けに置換する

Windows 環境で共有サーバのファイルパスを取得すると、 \\127.0.0.1\Some\Path\To\File.txt file:///127.0.0.1/Some/Path/To/File.txt こんな感じのパスが取得できることが多い。 2つ目の file:/// プロトコルはまだ扱いやすいが、1つ目のバックスラッシュ…

ターミナルからツイートするだけの CLI ツール「Just Tweet」を作った

ターミナルからツイートする CLI ツール、Just Tweet というモノを作った。 GitHub - Neos21/just-tweet: ツイートするだけの CLI ツール。 @neos21/just-tweet - npm インストールは以下のように npm でグローバルインストール。 $ npm install -g @neos21/…

チートシートを検索・出力するコマンドラインツール「ch-sh」を作った

僕は自分用チートシートとして、よく Markdown ファイルにスニペットやコマンドなどを記載している。その Markdown ファイルたちが入っているディレクトリでよく grep するので、コマンド化してみた次第。その名も「ch-sh」。 GitHub - Neos21/ch-sh: チート…

文字化けを復元する Web アプリ「Garbler」を作った

文字化け研究の一環として、「もじばけらった」インスパイアの Web アプリを作ってみた。その名も Garbler。 Garbler … デモページ GitHub - Neos21/garbler: Garbler : 文字化けを復元したり、文字化けさせたりします。 … GitHub リポジトリ 利用技術 文字…

2色のコントラスト比を導く Compare Colour Contrast Ratio を作ってみた

見やすい色の組み合わせかどうか。 WCAG2.0 (Web Content Accessibility Guidelines) という、ウェブアクセシビリティに関するガイドラインがある。 参考:Web Content Accessibility Guidelines - Wikipedia この中で、文字色と背景色とのコントラスト比を…

コマンドラインで動作する簡易パスワードマネージャ「Neo's Password Manager」を作った

Node.js でコマンドラインツールを作る勉強として、簡易的なパスワードマネージャを作ってみた。その名も「Neo's Password Manager」。パッケージ名は @neos21/npm。Neo's Password Manager の頭文字を取って NPM と称しているが、コマンド名は np とした。 …

Neo's Normalize で指定するフォントを見直して v1.0.11 をリリースした

少し前に、Chrome ブラウザで @font-face による游ゴシック Medium 指定が効かなくなっていたことに気付き、色々調査した記事を書いた。 neos21.hatenablog.com この調査を通じて、Neo's Normalize のフォント指定を見直したので、その内容を紹介する。 コレ…

はてなブックマークにノイズが多いのでオレオレはてなブックマーク「Neo's Hatebu」を作った

二度と視界に入れたくない記事。 僕は iPhone の「はてなブックマーク」アプリを見るのが日課なのだが、最近どうにもこうにも、見たくない話題に関する記事がホットエントリを占めるようになっていて、気分が乗らない。BTS とかいう知らない連中がどうしたと…

ポートフォリオサイトっぽいモノを GitHub Pages に作ってみた

フリーランスとして活動する気もないし、会社にも自分のアカウントは表立って知らせていないので、何のために作ったのかは分からないが、プログラマとしてのアテクシを自己紹介する的なページを作ってみた。 Neo : Front-End Web Engineer GitHub Pages とし…

Markdown ファイルを動的にパースして表示・別ファイルへの遷移もできる Angular アプリ「ngx-markdown-wiki」を作った

Markdown ファイルを動的にパースして表示し、別の Markdown ファイルへの遷移もできる Angular アプリ「ngx-markdown-wiki」を作った。Markdown ファイル同士の遷移ができるので、Markdown 製の Wiki が作れるかなー、という思いで、「Markdown Wiki」とし…

ブラウザ上で3ファイル以上のテキストファイルの差分を確認できる Angular アプリ「Multiple Diff」を作った

以前、「3ファイル以上を横並びにして差分を確認することはできないか」という話をした。 neos21.hatenablog.com 「Rekisa」という Windows 用フリーソフトが一番自分の理想に近かったのだが、コレを自分でも作って改良できないかやってみた。 結果、色々と…

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

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

オレオレノーマライズ CSS「Neo's Normalize」を作った

Normalize.css や、Bootstrap 4 から採用されている Reboot などの思想を基に、オレオレノーマライズ CSS を作った。その名も「Neo's Normalize」。 GitHub - Neos21/neos-normalize: Neo's Normalize いちばんよくわかるHTML5&CSS3デザインきちんと入門 (De…

カラーコードと RGB 表記を相互変換する ccc : Colour Code Converter を作った

NPMな彼女デス?ニッポン萌えな彼女デス?アーティスト: クロエ・ルメール(CV:丹下桜)出版社/メーカー: ポニーキャニオン発売日: 2017/07/19メディア: MP3 ダウンロードこの商品を含むブログを見る Webデザイン 色の辞典 魅せるWebサイト 売れる配色作者: 高坂…

SASS/SCSS ファイルを読み込んでブラウザ上でコンパイル・適用する「in-browser-sass」を作った

Web制作者のためのSassの教科書 改訂2版 Webデザインの現場で必須のCSSプリプロセッサ作者: 平澤隆,森田壮出版社/メーカー: インプレス発売日: 2017/09/15メディア: 単行本(ソフトカバー)この商品を含むブログを見る HTML に link 要素で SASS 記法のファ…

自サイトの開発環境を作った

Webアプリエンジニア養成読本[しくみ、開発、環境構築・運用…全体像を最新知識で最初から! ] (Software Design plus)作者: 和田裕介,石田絢一(uzulla),すがわらまさのり,斎藤祐一郎出版社/メーカー: 技術評論社発売日: 2014/04/15メディア: 大型本この商品を…

引数で指定した日付のコミットをデッチ上げる gh-contribution-that-day を作った

以前、指定の日付間のコミットを1日1つずつ作り、GitHub Contributions の草をデッチ上げるための Bash スクリプト「gh-contributions」を紹介した。 neos21.hatenablog.com 今回はそれの簡易版といえるだろうか。引数で指定した日付のコミットを生成する Ba…

template-html を Gulp プラグイン化する gulp-template-html を Fork した

現場のプロが教えるWeb制作の最新常識アップデート版 (知らないと困るWebの新ルール) [ 久保知己 ]ジャンル: 本・雑誌・コミック > PC・システム開発 > その他ショップ: 楽天ブックス価格: 2,376円 以前、template-html という npm パッケージを Fork して…

template-html を Fork してオレオレ HTML ジェネレータを作った

いまから始めるWebフロントエンド開発作者: 松田承一発売日: 2016/08/25メディア: Kindle版この商品を含むブログを見る template-html という npm パッケージがある。テンプレートとなる HTML と、それにバインディングしたいソースを持つ HTML とを指定する…