hi3103の備忘録

こんにちは、バンジョー弾きのサトウです。

Web系のエントリーばかりのなか異色のお知らせですが、趣味でやっている音楽「オールドタイム」のジャムセッション会を主催することになりました。

アメリカの古い時代の音楽で、こんな感じのシンプルで楽しいダンスミュージックです。
※サイトトップにも動画を載せています。

日本でやっている人はだいたい知り合い、というレベルで人口が少なく、アイリッシュやブルーグラスではよくあるセッションイベントも関東ではどこもやっていない状況だったので、「じゃあ自分たちで作るか」という流れで開催が決まりました。

会場は東京・神田にある洋風居酒屋『欧風屋』さん。
リーズナブルでお酒も料理もおいしいお店です。

ジャム会に参加される方は参加費をいただきますが、お客さんは基本ノーチャージ（閲覧無料）なので、気軽に遊びに来てもらえたらと思います。

ぜんぜん違うジャンルをやっている楽器弾きさんも、もしかしたら意外と楽しく一緒にやれちゃうかも？
ぜひ相棒と一緒にお越しください！

開催概要

関東オールドタイムジャム会

クローハンマーバンジョー弾きのサトウと、フラットフットダンス勉強中のボーカル・Goshiを中心に結成したThe Time in My Handsが「関東でもオールドタイムのジャム会をやりたい！」と主催する第1回目のイベントです。

オールドタイムとは、アメリカ・アパラチア山岳地帯のルーツミュージック。

バンジョーやフィドル・ギターなどの弦楽器を中心とした素朴な音楽を気軽に楽しめるよう、定期開催を目指しています！

弾いて、聴いて、飲んで、食べて、踊って…

まだオールドタイムに触れたことがない方も、ふらっと遊びにいらしてください。

日時	9月18日(水) 19:30〜22:00
会場	洋食居酒屋『欧風屋』
料金	閲覧無料 ※ジャム会参加者のみ￥1,000

タイムテーブル

• 19:30〜 第1部 The Time in My Hands ミニライブ
  • Banjo: サトウ( @hi3103 )
  • Vocal/Flatfooting: Goshi ( @54itter )
  • Fiddle: 山崎規夫
• 20:00〜 第2部 みんなでジャムセッション
• 22:00 終了

※店舗営業は17:30スタートです。
※ジャム会に参加される方は楽器をご持参ください。
※踊りたい方、タップシューズお持ちでしたら着用可です（板用意あり）。

会場詳細・アクセス方法

会場名	洋風居酒屋『欧風屋』
住所	東京都千代田区神田司町2-21 福興ビル B1F Googleマップで開く
電話番号	03-3233-1277

参考リンク

• 公式Facebookページ
• 食べログ

アクセス方法

以下の各線・各駅より、徒歩5分

• JR山手線・京浜東北線・中央線「神田駅」西口
• 東京メトロ銀座線「神田駅」4番出口
• 都営新宿線「小川町駅」A4出口
• 東京メトロ丸ノ内線「淡路町駅」A4出口
• 東京メトロ千代田線「新御茶ノ水駅」B6出口

※JR御茶ノ水駅からも徒歩15分ほどでお越しいただけます。

お問い合わせ

参加予定人数や店舗営業状況などについては、欧風屋さんのFacebookイベントページをご覧ください。

• 9月18日(水)19:30 関東オールドタイムジャム会 Facebookイベントページ

そのほかイベントに関するご質問などあれば、この記事のコメント欄、またはTwitterにてリプライかDMいただければと思います。

• サトウ( @hi3103 )

ご参加・ご来場おまちしています！

今回解決させること

カテゴリーアーカイブのURLから /category を取り除く

• WordPressデフォルトのカテゴリーアーカイブのURL形式は以下。
  • /notes/category/カテゴリースラッグ/
• このサイトでは、個別記事のURLを以下に設定している。
  • /notes/カテゴリースラッグ/記事ID
• なので、上記にあわせてカテゴリーアーカイブのURLも以下のようにしたい。
  • /notes/カテゴリースラッグ/
• つまり、カテゴリーアーカイブのURLから /category の部分を削除したい。

/category なしURLにアクセスした際の表示不具合を防ぐ

問題の挙動

• カテゴリーアーカイブのURL形式は
  • /notes/category/カテゴリースラッグ/
• なので、以下のURLは「正しくないURL」のはず。
  • /notes/カテゴリースラッグ/
• が、実際にアクセスすると404にはならず、カテゴリーアーカイブの1ページ目が表示されてしまう。

何が困るのか？

• カテゴリーアーカイブの2ページ目以降の正しいURLは
  • /notes/category/カテゴリースラッグ/page/2
• なので、ページネーションのリンク先として生成される以下のURLは「正しくないURL」
  • /notes/カテゴリースラッグ/page/2
• 実際にアクセスすると、こちらは404が表示される。

つまり

カテゴリーアーカイブURLから /category を抜いたURLにアクセスした場合、「1ページ目は問題なく見れるのに、2ページ目以降には行けないページが見れてしまう」状態になっている。

Read More

概要

• デフォルトのFacebookシェアボタンを使わないでFacebookのシェアボタンを作った
• ざっくりした流れ
  1. Facebook for Developersに登録・アプリケーションを作成し、app_idを発行
  2. シェアダイアログを使ったシェアボタンを作成

Read More

概要

• うちのサイトトップで出力しているYouTube動画埋め込みの出力に使っている仕組みの備忘録。
• プレイリストの情報（入っている動画情報も含む）をJSON形式で取得するところまでをまとめた。
  • 応用としてチャンネル情報＆検索結果も取得して遊んでみた。
• 実際にiframe等HTMLで出力するにはJSONをパースして組み立てる必要あり。

Read More

Sublime Text 上でコードの圧縮処理をするのに、Package Control から「YUI Compressor」をインストールしようとしたがパッケージがヒットしなかったので、Terminal 上でサクッと使えないかなと思って試してみた。

YUI Compressor とは

YUI Compressor

http://yui.github.io/yuicompressor/

• JavaScript / CSS ファイルの圧縮処理ができるツール
• Javaで書かれているため、動作には Java Platform (JDK) が必要

Read More

概要

• YouTubeチャンネルは、以下のようなURLでRSSフィードを吐いてる。

https://www.youtube.com/feeds/videos.xml?channel_id=【チャンネルID】

• これをPHPのsimplexml_load_file関数で読み込み、パースして出力する。

サンプル

• https://hi3103.net/study/1905-ytrss/
  • 今回は動画IDとタイトルを取得し、リスト形式のリンクを出力してみた。

Read More

ざっくりした解説

今回は h1 要素を装飾する。左右に配置する砂時計型のブロック要素は、h1 の :before と :after で作る。

Read More

jquery.qrcode.jsとは

jquery.qrcode.js

http://jeromeetienne.github.io/jquery-qrcode/

• QRコードを生成するjQueryプラグイン
• 画像は生成されず、tableタグまたはcanvasタグで描画することができる。
• ソースはGitHubで公開されている。
  • GitHub – jeromeetienne/jquery-qrcode

使用手順

1. GitHubから jquery.qrcode.min.js をダウンロードし、jQuery本体よりあとで読み込む
2. HTML側に描画スペースを用意
3. 用意した要素に対してjQueryスクリプトを記述

Read More

SublimeLinterとは

SublimeLinter

http://www.sublimelinter.com/

SublimeText上でコードの構文チェックをリアルタイムで行えるプラグイン

手順

1. 「SublimeLinter」本体をインストール
2. 言語ごとに必要なプラグインを別途インストール

Read More

OmniMarkupPreviewerとは

OmniMarkupPreviewer is a plugin for both Sublime Text 2 and Sublime Text 3 that preview markups in web browsers.

GitHub – timonwong/OmniMarkupPreviewer

マークダウン記法で書かれたテキストを、ブラウザ上でリアルタイムプレビューできるパッケージ

導入ログ

• Package Controllから「OmniMarkupPreviewer」をインストール
• cmd + option + O でブラウザプレビュー
  • 初回、404状態になってしまった。

• パッケージのユーザ設定を追記して解決
  • Preferences > Package Settings > OmniMarkupPreviewer > Settings – User

{
	"renderer_options-MarkdownRenderer": {
		"extensions": ["tables", "fenced_code", "codehilite"]
	}
}

2020-03-28追記：404再発

• 久しぶりに使おうとしたところ、同様のエラーが再発。
• 以下のエントリーを参考にSetting – User の記述を書き換えたところ無事復活した。ありがたい。
  • OmniMarkupPreviewer 404 Not Found 解決法 – Qiita

{
	"renderer_options-MarkdownRenderer": {
		"extensions": [
			"markdown.extensions.tables",
			"markdown.extensions.fenced_code",
			"markdown.extensions.codehilite"
		]
	}
}

参考エントリー

• OmniMarkupPreviewerでブラウザプレビューすると404エラーになる | INCOMPLETE++
• Sublime TextのリアルタイムMarkdownプレビューが便利 – YoheiM .NET