play.jsでHexoを使って記事を更新する
すごい時代が来た。というか完全に乗り遅れた。まさかiPadのネイティブアプリでnode.jsが動くなんて。 play.js is 何Javascript IDEを名乗るiOS/iPad OS用アプリで、モダンなJavascriptの開発環境を提供してくれます。iPad上でnode.jsのアプリが動くので、ReactやVue、Next.jsを使ったプロジェクトが開発できる!!!!すごい!!!!すごすぎる!!!!! 使い方play.js上にプロジェクトを作るか、githubなどのホスティングサービスからリポジトリをクローンします。iPadのローカルにあるgitリポジトリも読み込めるので、Working Copyのアプリ上で管理しているリポジトリを指定することも可能。これは有能すぎる。Working Copyのリポジトリを読めるということは、Textasticと連携してファイルを編集しつつ、play.js側で hexo serverし、localhostでサーバ立てながらコーディングも出来てしまう。ただ、まだそんなに安定していないのか少し経つとファイルの監視が止まって更新し...
HexoでNetlify Large Mediaを使って画像を管理する
静的サイトジェネレータで困るのが画像の管理。Gitのリポジトリに画像を含めればいいのですが、ある程度サイズが大きい画像ファイルをどんどん増やしていくのがちょっと嫌だったので、NetlifyのLarge Media機能を使ってリポジトリ上は画像ファイルを文字列として扱い、画像は別途Netlifyのサーバにアップロードできるようにします。 Netlify CLI入れるnpmで入れるか、 npm1npm install netlify-cli -g macだとHomebrewでも入れられます。 shell1brew install netlify-cli GitのリポジトリとNetlifyをリンクするshell1netlify login したあと、 shell1netlify link でリポジトリとNetlifyのアカウントをリンクします。 Netlify Large MediaのセットアップまでNetlifyのLarge Mediaプラグインを入れます。 shell1netlify plugins:install netlify-lm-plugin Gitのバージョ...
iPadでhexoを更新する
これはマジですごい。普通にvscodeがiPadで使えるぞ!!! 使うアプリ Safari これだけ。日本語入力もできるし、問題無い。 これは革命かもしれないなあ。軽くて持ち運びしやすいし、変なところもない。mac miniを持ち歩くおじさんをやっても良いけど。 設定方法Microsoft アカウントを取得普通にマイクロソフトのアカウントを取得します。 Azure の登録Azure(アジュール)のアカウントを作成します。クレジットカードの登録が必要ですが、アカウントを有料?に移行しない限りは課金されないと書いてあったように思います。 VSOnlineのvmを作成4コアCPUでメモリ8GBと、そこそこのマシンを作成します。昔code-serverをVMで立ち上げた時は4GBだと厳しかったので、それぐらい載せないと快適に動かないのかも。 作成したらLaunchして終わりです。
シェルスクリプトでtsvをcsvに変換する
tsv をさくっと csv に変換したいときに、ワンライナのシェルスクリプトで対応出来ないか調べたのでメモ。 1tr "\\t" "," < hove.tsv > fuga.csv こんな感じで、 tr コマンドで簡単に出来ました。 < のあとに入力側のファイル、 > のあとに出力したいファイル名を入力すればOK。 1cat hove.tsv || tr "\\t" "," > fuga.csv でも同じことが出来ます。 参考Linuxのコマンドでcsvをtsvに変換する | カナのLinuxLinuxコマンド【 tr 】文字の変換や削除 - Linux入門 - Webkaru
hexo-tag-flickrを使って画像をFlickrで管理する
hexoでブログをするにあたって、Wordpressみたいに何も気にせず画像をアップロードして記事に貼り付けられなくなってしまいました。プロジェクトフォルダのimagesに画像をどんどん入れていけばいいんだけど、できればプロジェクト内に記事内の画像を含めたくないので、Flickrで管理するようにしました。 使ったのはGitHub - visioncan/hexo-tag-flickr: Use image tag from Flickr on your hexo blog posts!!。 {% flickr 44409769824 %} のようにFlickrの写真IDを指定すると、 こんな感じで画像が読み込まれます。とても便利。
Puppeteerを使ってスクリーンショットを撮る
ヘッドレスChromeを扱うためのNodeライブラリであるPuppeteerを使って、サイトのスクリーンショットを撮ります。 Puppeteer is 何 Puppeteer is a Node library which provides a high-level API to control headless Chrome or Chromium over the DevTools Protocol.GoogleChrome/puppeteer: Headless Chrome Node API インストールShell1$ yarn add puppeteer Puppeteer本体を追加すると、最新版のChromiumも一緒にnode_modules内に追加されます。 使うscript.js1234567891011121314151617181920212223const puppeteer = require('puppeteer');const devices = require('puppeteer/DeviceDescr...
JavaScriptで文字列が回文かどうかを調べる
引数の文字列が回文かどうかを調べる関数を作ります。 freeCodeCampの問題が楽しいフリーコードキャンプという無料のプログラミング学習サービスに載っている問題を解くのが自分のレベルに合っていてとてもためになっています。Check for Palindromesという問題の回答例。回答の全文(全スクリプト?)を載せるのはNGなので、個人的に躓いたポイントのみメモ。 script.js12let str = 'hogehoge';let mirrorString = str.split('').reverse().join(''); // egohegohになる split()してreverse()してjoin()すれば良い。他には文字列のlengthを取り、後ろから順番に1文字ずつくっつけていく方法も。
iPhone📱でhexoを更新する
iPhoneで更新といっても、ssh出来るマシンを用意して、マシン上でhexo new post hoge.mdするので、iPhoneだけで完結という訳ではないです。本当はオールインワンでやりたい…! 使うアプリ Byword Termius GoCoEdit Bywordマークダウン対応のエディタ。ファイルがiCloudで簡単に同期できるので、下書きやメモなど、書き留めたいことがあったら基本的に何でも入れておく用に使っています。WordpressやMediumなんかはそのままPublish出来るので大変便利。 TermiusSSHクライアント。有料アプリだけど、基本的なことだったら無料でいけます。これで用意したSSH出来るサーバに接続してhexo-cliを使います。 GoCoEdit上の2つをくっつけたようなアプリ。scpとSSHでリモートのサーバに繋げて、いい感じに公開まで持っていけます。これだけ有料。 流れマークダウンで下書き何か浮かんだときにパッと書きたいときにスマホで更新したくなるので、Bywordでメモ。清書した方が良いのかもと思いながらそのまま公開してしまうこと...
Hexoのテーマ「Icarus」を使う
Hexo用のテーマicarus(イカロス)を使います。 インストール1$ git clone https://github.com/ppoffice/hexo-theme-icarus.git themes/icarus でリポジトリをクローンします。 設定themes/icarusにいる_config.yml.exampleを_config.ymlにリネーム。 変えたところthemes/icarus/_config.xml123# Commentcomment: disqus: unmnt くらい。logoやprofile、social_link_tooltip、searchは軒並みfalseに。 本体の_config.xmlは _config.yml1234# Extensions## Plugins: https://hexo.io/plugins/## Themes: https://hexo.io/themes/theme: icarus に変更。 あとは普通にhexo serverするとテーマの変更が確認出来ます。
Hexoでブログ作ってNetlifyで公開する
概要Node.js製の静的サイトジェネレータであるHexoを使ってブログを管理しつつ、Netlifyで公開します。 使うもの Cloud9 Hexo Gitlab Netlify Cloud9Cloud9クラウド型のIDE。Gitlabで作ったプライベートリポジトリをgit cloneして使います。 HexoA fast, simple & powerful blog framework HexoHexo うまい、やすい、はやい。 インストールして使う1$ npm i hexo-cli -g でhexo-cliをグローバルにインストール。 1$ hexo init プロジェクト名 でhexo用のプロジェクトフォルダが作れるので、 1$ hexo init unmnt で作成。 12$ cd unmnt // 作ったプロジェクトに移動$ yarn install で必要なパッケージをインストール。 新しい記事を作る1$ hexo new post post-name source/_postsにpost-name.mdが作られます。 テスト1$ hexo server ...

