開発メモ
ワークフロー
ワークフローの解説は後にして、GitHubページのカスタマイズ方法です
1.GitHubのHP
GitHubは公開用のHPのデザインが準備されています。このページがまさにそれです
試してみましが、特に便利かどうかわかりません
せっかく作ったのでポイントをメモしておきます
2.ページの設定
多分リポジトリ1つについて1ページだと思います
リポジトリを作成後、そのリポジトリページのメニューからSettingsメニューを選択
GitHub Pagesという項目があるので、Click iy out here!をクリック
Sourceは、Branch:main /(root) を選択してSave
Change Theme ボタンから好きなテーマを選択
ちなみに私の場合は『Leap Day』
たぶん設定はこのくらい
3.作成が必要なファイルは3つ
リポジトリページに戻って下記の3つのファイルを作成
1.style.scss
2. _ config.yml
3.README.md
mainに置いていますが、ブランチを作りたい場合はsettingsも変更要です
以下3ファイルの説明です
1.style.scss
add fileからCreate new fileを選択し
name your file…に『assets/css/style.scss』と入力
（『/』でリポジトリの下層フォルダが作成されます）
テキスト編集エリアに下記を入力
なお、h2以下はこのサイトのスタイルシートになります
---
---
@import 'jekyll-theme-leap-day';
h2 {
font-size:12pt;
color:#ffffff;
line-height:8;
background-color: #4276b6;
}
h4 {
margin-top:20px;
font-size:11pt;
font-style: italic;
color:#4276b6;
border-bottom: solid 1px #4276b6;
}
h3 {
font-size:10pt;
color:#ffcc00;
text-shadow: 1px 1px 1px #888888;
}
2. _ config.yml （アンダーバーの後のスペースは不要です）
リポジトリ直下に作成します
私の場合下記のように、タイトルとデスクリプションを設定しています
theme: jekyll-theme-leap-day
title: AlfredWorkflowで遊ぶページ
description: Lesson30.GitHubのHPを作ってみる
『:』の後のスペースがなくてエラーとなったことがありましたのでご注意を
3.README.md
リポジトリ直下に作成します
このファイルには、HTMLタグの一部を記号で書くことができます
詳細は各テーマのサンプルを確認してみてください
ただ、改行はbrタグを書く必要があるので、それほど便利ではないかな
preタグは置き換えの記号があるのですが、コードを書く想定なので
そのままでは使いにくいかな。スタイルシートでカスタマイズすれば
ほぼプレーンテキストで書けると思います。
ある程度HTMLを意識しないと書けないですし、横の文字数は少ないですし、
これだったら自分でHTMLを作成した方が楽で自由と思うかも。
なお、2と3のファイルは、リポジトリ直下なので、ローカルに作成したものを
upload filesでまとめてアップロードする方が楽です
README.mdを更新したり、アップロードしたりすると設定した場所にHPの
index.htmlを生成しましす
2022.02.12追記
README.mdのH2タグとして『##』を使っていますが、不具合がありました
いつからかは不明ですが、『##』の後に書いた文字列が
config.ymlで指定したtitleよりも優先されてしまいました
原因不明ながらも、『##』の記述を削除したらconfig.ymlの設定通りになりました
4.裏技サイトを探す
ここからはワークフローの解説
経験上、alfred化する場合、検索サイトのラッパーとして使うか、
まとまっているサイトからパースするかだと思います
https://creive.me/archives/154/
というまとめサイトを見つけたのでパースことにしました
でも裏技が50個とちょっと少なめです。。
このサイトの裏技はliタグでまとまっています
liのあとに数字とピリオドがあって、1から50までの裏技が紹介されています
たまにbタグで強調しているので、これを除けばOKそうですね
ここまであたりをつけたらコーディングしましょう
5.コーディング
お約束通りcurlでソースを取得
改行やスペース、bタグ、を取り除いて、liタグの集合を作ります
その後でliタグ、先頭の番号を削除して、裏技の中身を配列liに格納します
このサイトで紹介している裏技は50件で不変な感じではありますが
一応、配列liの件数（最大値）を求めて、その中からランダムで3件選択します
深い意味はなく、全体が50件なので3件にしてみたという程度です
後はJSONフォーマットを作成して、はい、できあがり
6.最後の一工夫
テストをしてみると、裏技がalfred出力に全て書かれてしまうので
ちょっと工夫してみました。それは、先頭の語句だけを出力するというものです
下記のパターンにマッチした部分だけをtitleとして表示させています
『〜、』『〜：』『〜に』『〜を』『〜は』『〜の』
なお、argには裏技の文言全体をセットしています
そのため、alfred出力を選択すると、裏技の文言全体でサーチします
背景
webサーフィン中にいろいろなターミナルに関する裏技を見ていたのですが
たまたま生活の裏技に飛び火してしまい、alfred化することにしてみました
取扱説明
機能:
ランダムに裏技を表示させる
インストール:
1.alfredworkflowをダウンロード
2.ファイルをダブルクリックしてワークフローに登録
使い方:
Alfredからキーワード『waza』で起動
トップページに戻る