ねこづきあゆむのブログ

めもです。メンテ開始前misskey-dev/misskey/main をベースにブランチ (AyumuNekozuki/misskey/original-202x.xx.x)作成作成したブランチ -> AyumuNekozuki/misskey/develop_mashiro-site に PR/mergeAyumuNekozuki/misskey/develop_mashiro-site で各種修正AyumuNekozuki/misskey/develop_mamashiro-site -> AyumuNekozuki/misskey/mainhiro-site に PR/mergeAyumuNekozuki/misskey/main_mashiro-site から Release 作成メンテ開始後

この記事は Fediverse Advent Calendar 2023 12日目の記事です。前日は Morikapu さんの「色々なサーバーを運営してみた」でした。

この記事は Misskey Advent Calendar 2023 12日目の記事です。前日は 高橋牧場 さんの「MissFARMにおける快適なタイムライン体験のための取り組み」でした。

前置きこの記事は「Misskeyは Misskey.io 以外にも広大な世界が広がっているんだよ。それを知って、楽しんでいって欲しいな」という考えのもと執筆・作成されました。その為、一部箇所に偏りが発生する場合があります。それを踏まえた上でご覧いただければと思います。はじめにみなさま、初めましての方は初めまして。そうじゃない方はお久しぶりです。ねこづきあゆむ（@AyumuNekozuki@mi.mashiro.site）です。Misskeyインスタンス「みすほわいと」の管理人をしています。さて今回は、最近Misskeyを知った方向けに、おすすめのインスタンスを紹介していきます。「Misskeyってそもそもなんぞや」って方はこちらを、

みすきーねこづき（Misskey自鯖）を v12系からv13系にアプデする際にめちゃくちゃハマり倒したので、メモ書きです。参考にならないと思いますが、参考にどうぞ。環境AWS EC2 / Ubuntu Arm64 / t4g.medium (テスト環境は t4g.small )公式のInstall Shell Scriptを使わず、こちらの記事を参考に手動で構築Repo: AyumuNekozuki/misskey branch: v12.119.2-nekozuki -> v13.x-nekozuki へアプデTL;DR# misskeyを止める $ sudo systemctl stop misskey # node v18系へアプデ (nで管理します) $ sudo npm install -g n $ sudo n lts $ hash -r # postgresql 15へアプデ $ sudo sh -c 'echo "deb http://apt.postgresql.org/pub/repos/apt $(lsb_release -cs)-pgdg main" > /etc/apt/sources.list.d/pgdg.list' $ wget --quiet -O - https://www.postgresql.org/media/keys/ACCC4CF8.asc | sudo apt-key add - $ sudo apt update $ sudo apt -y install postgresql-15 $ sudo pg_dropcluster 15 main --stop $ sudo pg_upgradecluster 13 main  $ sudo pg_dropcluster 13 main # pnpm のインストール $ sudo npm install -g pnpm # ユーザー misskey へ切り替え & 移動 $ sudo -iu misskey $ cd misskey/ # git pull $ git pull $ git checkout v13.x-nekozuki $ git pull $ git submodule update --init; # 構築開始 $ pnpm run clean $ NODE_ENV=production pnpm install --frozen-lockfile => ErrorMemo 01(後術) $ NODE_OPTIONS=--max_old_space_size=3072 NODE_ENV=production pnpm run build => ErrorMemo 02(後術) $ NODE_OPTIONS=--max_old_space_size=3072 pnpm run migrate => ErrorMemo 03(後術) $ exit # 再起動 $ sudo apt update -y $ sudo apt full-upgrade -y $ sudo reboot # systemctlの設定ができていれば再起動で自動的にMisskeyが起動しているはず # そういえばリリースノートに書いてあったけどやってなかったから後からやった（これは一体なんなんだろう） $ sudo corepack enable躓いたところErrorMemo 01: pnpm install でコケる本番時には発生しなかったんですが、規模を縮小したテスト環境で事前に試した時に、pnpm installが最後まで回らずに途中でコケました。（途中で Killed が表示されて処理が止まっちゃう） 原因はいまいちわからなかったんですが、おそらく環境が小さいとコケるっぽい？ラズパイでMisskey構築してる人たちどうするんだ……。そもそもpnpm自体、npmやyarnと比べると圧倒的に文献が少なく、原因とかを調べるのにもものすごく苦労しました……。というか、yarn-error.logみたいにコケた時ログ出してくれるとありがたいんですけどねpnpmくん……。ErrorMemo 02: xxx not found. でコケる多分01の影響です。僕の場合は、packages/backend - tsc not found - tsc-alias not found packages/frontend - vite not foundが発生。それぞれ、$ cd packages/backend/ $ pnpm install tsc $ pnpm install tsc-alias $ cd ../frontend/ $ pnpm install viteで事を納めました。ErrorMemo 03: module not found でコケる多分01の影響＆02と同様の事態です。僕の場合、re2 がないよ！って怒られたので、プロジェクトのルートで、$ pnpm install re2 -wで事を納めました。-w がついているのは、プロジェクトのルートだからです。ない状態で叩くと、ルートでやるならオプションつけろよオラァって怒られます。おわりにpnpm、情報がなさすぎて、調べようにも、欲しい情報が見つからないのが辛いですね……。

年末振り返りです。多分結構長いので、目次活用してね。はじめにどうも、ねこづきあゆむです。毎年恒例、年末振り返り記事です。多分過去のやつはタグからいけると思うので探してみてね。と思っていたけれど、直近は放送してたのでないんでした。ボカロ10選はあるので見てみてね。2022年ボカロ10選今年の僕がめちゃくちゃ良いと思った楽曲10選です。良いと思ったら色々聞きに行ってみてください。

はじめにこれは個人的な備忘録です。Misskeyの自鯖を立てました。ここです。@AyumuNekozuki@mi.nekozuki.me環境Oracle Cloud Infrastructure Always Free で建てるよこちらの記事を参考に立てたよOracle Cloud Infrastructure Always Freeを使ってタダでMisskeyインスタンスを立てよう ARMはインスタンスがいつまで経っても立てられないのでAMDで建てました本題bashスクリプトでの導入なんですが、知識がない方が成功します。Misskeyを立てたことがあったり、Dockerの知識があったりすると、無駄にいじってしまって失敗します。example.comのURL、Postgres / redisのパスワード、iptable以外は基本Y/Enterで。設定項目としては、Docker Use, DockerHub, Nginx, iptable で選択、example.com, Postgres / redisのパスワードだけちゃんと入れてください。僕の場合は、最初、gitrepoからDLして失敗し、そのままDockerをやって失敗し……で５時間ほど詰まってました。そうなったらもういっそインスタンスごと立て直した方が早いです。はまり方bashスクリプトの途中で、misskeyのチェックがNGとなり詰むError: connect ECONNREFUSED redis: EAI_AGAIN

明けましておめでとうございます。１２月です。もう残す所あと１ヶ月かぁとなっている僕です。いろいろ、本当にいろいろとあって、メンタルやばかったんですが、とりあえず安定化しつつある？気がしているので、ちょっとだけ１１月を振り返ろうと思います。配信をやめ、Twitterもやめ、僕は何をやっていたのかと言うと、何をしてたんだっけ。通話しながら、ゲームしたり……ぐらいしかやってない気がしてます。あ、ちなみに、ポケモンSV、ヴァイオレットを買ったんですけど、とりあえずクリア(初回殿堂入り)しました。そっから先やる気が起きねぇんだわ……。そしてなぜか、ポケモン過去作をやりたくなってしまって、ちょうど今日、近くのゲオでアルセウス（未プレイ）と、BW（プレイ２回目）を中古で買ってきて遊んでます。それ以外にも、VALORANTにはまってここ最近毎日のようにやっていたり、ライザとか積んでたゲームを色々片し始めてます。それだけ配信とかって時間取られてたんだなぁ…と、自分でもちょっとびっくりしてるまぁそんなこんなで過ごしている僕ですが、精神的には、実は結構危うい気がしてます。かれこれこの状態２ヶ月、３ヶ月？ほど続いてますが、前と比べて明らかに悪化してる。自分の中のボーダーラインすれっすれを掠めてってるような、そんな感じ。実は、って言っても知ってる人もいそうですが、高校入学頃、一度鬱になって不登校ひきこもりになってまして（その後N高に転校して配信ガッツリやってメンタル戻してった）、その時を100としたとき、数日前ぐらいの感情値が95とかぐらいで、ちょっと次帰省した時にもっかい心療内科行った方がいい気がしてます。まぁ、自分で判断できるだけまだマシですが…話変わるんですが、数日前、やばくて、今大丈夫なの、日記のおかげかなって気がしてます。耳鼻科の初診の日…11/22から毎日日記をつけていて、その日の感想（適当でおｋ）と、達成度☆５段階評価（当社比）を、Notionに放り込んでます。これ結構良い気がしてて、どのタイミングでメンタルやってたってのと、その日何があった、どう言う感情だったかっていうのが振り返れてとてもよい。あとある種の吐き出し口的な面にもなってる気がしてます。自分の中では珍しく続いてる部類（大体４、５日でやめちゃうことが多かった）ので、ちょっとまずは年末、年明けまで続けて様子見ていこうと思います。本題：Twitterをスマホから消して１ヶ月ぐらい経ちましたさて、ここまで色々書いたので本題にいこうと思います。Twitterの話です。まぁ色々あってTwitterをスマホから消しました。あくまでスマホから消しただけで、PCからは見れるし、アカウントも残してあります。けれど、スマホから消しただけで生活が一変するぐらいには効果があるっぽいです。やべーな。Twitterを消してよかったことまずはTwitterを消してよかったところから。無駄な時間が減った電車の中とか、寝る前ベッドとか、暇さえあればTwitterを開いてしまっていたんですが、それがなくなりました。代わりに何になったかと言うと、マンガとか小説とかを読む時間になりました。あんまり変わってないね。ただ、積んであった諸々を消化できるので、これは良いことです。（確信）ストレスが減った当社比です。Twitterから通知がやってこないのでストレスが減りました。やったね。Twitterを消して困ったこと情報入手の機会が減るこれはマジで困ってます。結構、新しい技術の話とか、良いアイデアの素とか、推しの諸々の情報とかをTwitterから拾ってきてたりしてたんですが、新しい情報に出会えなくなってしまった感がすごいあります。ちょっとこれは困りもの。総じて、時間とストレスが減るのと引き換えに情報がもらえなくなります。うーん。ただ、情報に関しては、いろんなニュースアプリだったり、Mastodonの連合TLにもちょこちょこ流れてくるのでなんとかなりそう感はある気がしてます。まぁ、当分、Twitterは消しっぱなしにしておきますね。Twitterを消したと同時に、Mastodon（自鯖）に基本浮上するようになりました。アカウントはこちらです @AyumuNekozuki@mstdn.nekozuki.me 一応改めてにはなるんですが、流行りに乗ったわけではないです！！イーロンさんのTwitter騒動でMastodonが話題になるのと、Twitter削除タイミングが噛み合い過ぎてて誤解されそうなんですよね……ｗｗ自鯖、今年６月（前鯖もいれればもう3年前？）には立ててるので。なんならその前から friends.nico に僕居たので。まぁ、このままだらだらと書いてもいいんですが、長くなるので、今回はここらへんで。メンタル死んでますが、ちゃーんと生きてます。安心してください。次は多分年末振り返りかな。

備忘録的な何かです。環境はこんな感じ。MacBook Pro (14-inch, 2021)Apple M1 PromacOS Monterey 12.4Cubase Elements 12 Version 12.0.40 Build 317 (Rosetta 2)きっかけワイ「Cubase、オーディオIFにくっついてきたやつだとやっぱり機能限られるからあれやなぁ」ワイ「おっ！上位版セールやってんじゃん！買っちゃえー！！」＝＝購入後＝＝ワイ「よっしゃインストールできたで！早速適当に収録……」ワイ「あれ？マイク音声入らんのやけど？？？」ワイ「あー、OSのマイク権限許可でてないんか。どおりで認識するのに音声反応しないんか。」ワイ「んで、その許可ポップアップ、どうやって出すん？？？」試行錯誤してみるマシン再起動ワイ「だめやな」Cubase再インストールワイ「だめやな」色々ファイル諸々消してもっかいインストールワイ「だめやな」🤯色々試して思った。ワイ「正攻法で無理なら、コマンドで無理やり権限与えればいいんじゃね？」色々調べてみるワイ「さーて、とりま調べてみっか」サイトA「システム環境設定.appから、セキュリティとプライバシーに入って、そこからマイクの権限いじれるで」ワイ「いや、マイク権限のアプリリストにCubase出てこんからいじれないんやが……」サイトB「システム環境設定.appから……(ry」サイトC「システム環(ry」サイトD「シs(ry」ワイ「全然情報ないやんけ！！！」ワイ「日本語なさそうだし、海外のサイトだけで絞るか……」WebSiteA「tccutilってコマンドで権限リセットできるで」ワイ「それや！でもやりたいんリセットちゃうしなぁ」ワイ「いや待てよ……権限リセットできるなら付与もできんちゃう？」＝＝色々試して＝＝ワイ「付与できんかー」WebSiteB「有志が作ったtccutil.pyあるで」ワイ「それや！！！」本題：ターミナル上でマイクの権限を付与するワイ「まずこっからファイル落として……こうじゃ！」$ sudo python tccutil-1.2/tccutil.py -e -id com.steinberg.cubasesoft12 --microphone Allowed the app to access Microphone!ワイ「よっしゃきた！！」Cubaseくん「マイク入ったで」ワイ「っしゃああ！」おわり

やぁやぁやぁ、猫月遥歩（ねこづきあゆむ）です。唐突に始まる話なんですけど、自分文章書く時だけ人が変わるっぽいんですよね。めちゃくちゃ筆が乗る……現代的に言うと、キーボードに乗る……？なんだそれ。まぁともかく文章書く時だけめちゃくちゃ筆が乗ることに気づきました。とはいえ、語彙力が無いのは相変わらずなので、先日もボカロタイムズの選曲＆コメント執筆していて、何度も「歌い上げる」とか「マッチして……」とか同じ単語ばっかり使っちゃって悩んでました。自分のもった感情・感想を言葉にするのって難しいなぁと改めて実感した今日この頃です。今日の議題議題というか話題というか。そんなものは今回ないです。ただただ雑に書き殴ってます。とはいえそのまま長文をつらつら書くのはそれはそれでクソほど見づらいので、適度にセクション分けぐらいはしようと思います。PCの人だけになっちゃうけどサイドバーに目次あるので気になる話題探してみてね。メインブラウザをSafariに変えましたMacを使い始めてはや2年。iPhoneユーザーかつMacユーザーかつiPadユーザーなのにも関わらずこれまでずっとChromeを使ってきましたが、とある理由でSafariに乗り換えました。きっかけは、iPhoneからです。iPhoneとSafariって結構親密につながっていて、いくつか自分の知るWebサービスの中には、iOSユーザーの人はSafari使ってね！！みたいなものも結構あります。それにぶつかってChromeからURLコピってSafariに移って……ってするの疲れた！！！！！！！！ってところからでした。最初はiPhoneでSafari使うんだったら、履歴とかもろもろ共通できるようにMacでもSafari使おっかみたいな感じで軽いノリで使い始めたんですが、これが案外使いやすい。拡張機能が足りてないってところを除けばめちゃくちゃ便利です。といっても自作の「niconico Darkmode」と「ニコニ広告ex.」に関しては、ローカルでビルドし直すだけでSafariでも使えるし、他の拡張機能は、実はちゃんと使ってたの「1Password」ぐらいなので、普通にストアにあったのでDLしました。そんな感じで、結構導入コスト的なもの低かったのは結構良かったです。ただ、Safariに変えたことならではの不便なところもありました。他ブラウザでちゃんと動作する機能が微妙にオカシクなってたり（特にニコニコ）、進む戻るのトラックパッドでのフリックが、全画面挙動なせいで結構うってなります。ただ、それ以外はめちゃくちゃ良いので、あんまり気にしてなかったりもします。そんな感じで、Macユーザーの皆さん、Safari結構良いのでありかもしれません。今期のおすすめアニメの話Engage Kissとリコリコはいいぞ。完。お前いっつもそればっかり言ってんなって感じですが。マジで。良いので。みてください。Engage Kissはね、まじで、やばい。さえかの♭好きな人は絶対好きなのでみてほしい。丸戸先生だし。やばいよあれは……。結局語彙力無くなりましたね、ごめんなさい。ともかく、めちゃくちゃ良いのでみてみてくださいな。タスクと進捗のお話近況報告と銘打ったからには、報告しない訳にはいかないでしょう。今の積みタスクと進捗はこんな感じです。歌ってみたCollection 投稿用動画作成歌練習中。09/23スタジオ収録予定。その日中に音源をMIX師さんに投げるのでなんとか間に合いそう？クリエイターサポート用サポーターカードイラスト＆デザインラフあらかた。清書は……誰か描いて？（遠い目）ポータルサイト nekozuki.me リニューアル計画デザイン考え直し。進捗巻き戻ってるんですが……。ざっとこんな感じであんまり芳しくないです。これ以外にも動画とか動画とか動画とか作りたいし、ゲームだってしたいので、タスクなんとかしないとなぁみたいな感じあります。さらにまだ言えない依頼系のタスクとか、リアルのタスクとかも混ざってくるので、まぁ大変。死なない程度に頑張ります。いくつかお知らせ？『The VOCALOID Times（RC） 2022年08月号』リリース……じゃなかった発行しました。今月はずんだもん特集なのだ。よかったら好きな動画探してみてほしいのだ。

先にお知らせごとから。お知らせ動画が2本上がります。

どうも。ブログでは久々ですね。なんか最近色々考え込むことが多くて。ちょっと頭の整理と近況報告用のブログを書くことにしました。最近、放送もできず、動画も上げず、Twitterにも現れず。コンテンツを消費する側に回りかけている気がしていますが、意外と色々作ってます。最近もちゃんとモノ作ってるんですよ？ラノベチックな見出し文になりましたが、まぁ、この記事の後ろの方で話すと思います。ブログでも更新しましたが、「きりふぇす」「ニコニコバーチャル動画投稿祭」のWeb周り全般（デザイン・システム含む）を担当しています。近々また、ちょこっと更新を予定しているので、色々準備中です。

どうも、ねこづきあゆむです。タイトル通り、このブログ、以下の更新をしました。公開日時と改訂日時を分けて表示「技術部」タグを整理サムネがない記事のOGPがちゃんと表示されるようにしました公開日時と改訂日時を分けて表示しました元々、公開日時だけ表示してたのを、とあるタイミングから改訂日時だけ表示するようにしていました。ですが、このブログ、過去のWordPressとかブロマガで書いていた記事を移行してきた都合上、改訂日時＝移行日の日付になってしまってました。その為、その記事がいつ公開されたのかわからない状態でした。なので、以下のように、公開日時と改訂日時を分けて表示するように改修しました。カレンダーマークが公開日時、鉛筆マークが改訂日時です。これで色々楽になるよ！やったね！「技術部」タグを整理しましたもともと、「技術小話」というタグだったものを「技術部」タグに直して、技術関連の記事は全てここに纏まるようにしました。このブログ自体、自分がただ記事を書いて個人ブログとして運用していたのですが、色々と技術系の記事も流すようになり、まとまっていた方が色々楽だなと気づいたので、タグでまとめました。そのうちカテゴリも再編すると思います。サムネがない記事のOGPがちゃんと表示されるようにしました（当記事みたいに）サムネを設定してない記事をTwitterに共有した際になぜかOGP画像がFaviconになって見た目的にもSEO的にもよろしくなかったので、ちゃんとOGPが設定されるようにしました。元々設定していたはずなんですが、なぜか、meta_imgにどこかのタイミングでfaviconが代入されるらしく...まぁ治せたので良かったです

今回、ブログとポータルサイトをPWA化しました。PCだとアドレスバー、スマホだとホーム画面に追加から、Webアプリとして実行できるあれです。そんなPWAを導入するにあたって、色々と覚え書きを書いておきます。NuxtjsでのPWAの導入導入はクソほど簡単。最初のyarn create nuxt-app <project-name>の中でPWAの選択項目があるので、それを選択して入れればとりあえずOK。モジュールが入ったら、nuxt.config.js に色々書き加えます。正直何が必須で何が任意かよくわからなかったので、適当に書きました。 pwa: { manifest: { name: 'ねころぐ', lang: 'ja', short_name: 'ねころぐ', description: 'ねこづきあゆむの過去ログ倉庫です。', display: 'standalone', start_url: '/', theme_color: '#7f7fff', background_color: '#EFEFFF', }, icon: { source: '/static/icon.png', fileName: 'icon.png' } },上から順にmanifestname: サイトの名前lang: 言語short_name: アプリの短縮名（ホーム画面に出てくる簡略化した名称）description: 概要文display: 実行モード（いろいろあるらしい）start_url: アプリのメインURLtheme_color: テーマカラーbackground_color: 背景色iconsource: アイコンの位置fileName: アイコンのファイルネームこれでとりあえず完了です。あ、開発環境で確認したい時は dev: trueをつけてください。キャッシュが残りすぎて記事が更新されない問題とりあえず実装したはいいものの、キャッシュ周りでごちゃごちゃし始めました...。PWAは仕様上、キャッシュ優先で拾ってくるので、記事が更新されていても表示上更新されていないように見えることになります。なので、workboxでキャッシュ時間を指定してあげるといいっぽいです。（ネットで拾ってきたものをそのままやってるのであまり理解してないので、今後理解したい） workbox: { dev: true, offline: false, skipWaiting: true, clientsClaim: true, runtimeCaching: [ { urlPattern: `/api_nicorepo/*`, handler: 'staleWhileRevalidate', method: 'GET', strategyOptions: { cacheExpiration: { maxAgeSeconds: 60 * 15, // 15分 }, cacheableResponse: { statuses: [200], }, }, }, { urlPattern: `/api_mc_nekolog/*`, handler: 'staleWhileRevalidate', method: 'GET', strategyOptions: { cacheExpiration: { maxAgeSeconds: 60 * 30, // 30分 }, cacheableResponse: { statuses: [200], }, }, }, { urlPattern: `/api_mc_nekozukime/*`, handler: 'staleWhileRevalidate', method: 'GET', strategyOptions: { cacheExpiration: { maxAgeSeconds: 60 * 60 * 3, // 3時間 }, cacheableResponse: { statuses: [200], }, }, }, { // デフォルト（最後に記述する） urlPattern: '/*', handler: 'networkFirst', method: 'GET', }, ], }あと、microCMSでWebhook投げれるので、microCMSで記事更新 → Vercelで受け取ってデプロイ させてます。とりあえず覚え書きでした。

最終更新： 2022/01/30 17:00はじめにこの記事は、当該環境のM1Macで動作したソフト・動作しなかったソフトをまとめたものです。各環境での動作を保証するものではありません。あくまで自己責任でお願いいたします。筆者の環境MacBook Pro（14インチ、2021）チップ: Apple M1 Proメモリ: 16GBOS: macOS Monterey v12.1Parallels Desktop 17 for Mac Standard Edition v17.1.1(51537)ゲームモードで動作中Windows 11 Home (ARM64) 21H2 22000.438Windows 機能エクスペリエンス パック 1000.22000.438.0

どうも、猫月遥歩です。先日、ポータルサイト nekozuki.me をリニューアルしました。リニューアルの経緯や、各所に急に出てきた紫のねこについては、後日また告知(?)します。この記事では、リニューアルの時に触った @nuxtjs/axios についての覚え書き記事です。@nuxtjs/axios の Proxyまわりについて@nuxtjs/axios、ネット上にいろんな記事が出ていて、特にproxy周りで情報が錯綜しています。proxy: trueを入れるとか入れないとか。調べた感じ、公式ドキュメントがやはり一番っぽいので、ドキュメントベースで進めてみてください。いろいろ使ってみて、とりあえず 2022年1月現在で動作したものをここにメモしておきます。// nuxt.config.js // Axios module configuration: https://go.nuxtjs.dev/config-axios axios: { // Workaround to avoid enforcing hard-coded localhost:3000: https://github.com/nuxt-community/axios-module/issues/308 prefix: '/', proxy: true, }, proxy: { '/api_hoge/': { target: 'https://example.com', pathRewrite: { '^/api_hoge/': '/v1/example/' } }, },// pages/example.vue //基本的な使い方 $axios.$get("/api_hoge/"),axiosで複数箇所から取ってくる場合の最適化１ページで複数からaxiosで叩くと、ページのロードに時間がかかります。そのため、Promise.all でまとめて取得すると、時間がかからずに取得できます。 async asyncData({ $axios }) { let [hogea, hogeb, hogec] = await Promise.all([ $axios.$get("/api_hoge_a/v1/schedule"), $axios.$get("/api_hoge_b/"), $axios.$get("/api_hoge_c/v1/article"), ]) return { hogea, hogeb, hogec, }; },@nuxtjs/axios を動かしてると何故か microcmsのNuxtモジュールが動かないなぜかmicroCMSモジュールでエラーが出ます。なので、いっそのこと、microCMSもaxiosで取得しましょう。APIKEYについては、proxyの方に設定しておくと楽です。 proxy: { '/api_mc_nekozukime/': { target: 'https://hogehoge.microcms.io', pathRewrite: { '^/api_mc_nekozukime/': '/api/' }, headers: { "X-MICROCMS-API-KEY": process.env.MC_API_KEY }, }, },// queries なし $axios.$get("/api_mc_nekozukime/v1/schedule"), // queries あり $axios.$get("/api_mc_nekozukime/v1/makes?filters=type%5Bequals%5Dextentions&orders=createdAt"),クエリは、microCMS管理画面の APIプレビュー > cURLを選択して調節すると楽に書けると思います。

もう年の瀬ですね…。猫月遥歩（ねこづきあゆむ）です。猫月遥歩の2021年のボカロ10選をご紹介します。なんか…（いい意味で）やばいリストになりました。▼マイリストはこちら

どうも、猫月遥歩（ねこづきあゆむ）です。先日、ニコニコ情報調査室SmileS内 で 「テーマなしLT」企画があり、それに参加してきました。クローズドな場所で行われたのですが、スライド等公開してもいいよってことだったので、公開しておきます。

この記事は N・S高等学校 Advent Calendar 2021 6日目の記事です。はじめにどうも、N高卒業生（21年3月卒）の猫月遥歩（ねこづきあゆむ）です。現在専門学生なのですが、うちの学校にはアドカレのような文章としてアウトプットしようみたいな取り組みが少ない（というか無い）ので、今年もN高のアドカレに参加させていただいてます。さて、今回は、今みなさんがこの記事を読んでいる個人ブログ「ねころぐ」を最近リニューアルしたので、その話をしようと思います。動機リニューアル前は、静的サイトジェネレーター「Hexo」× Netlify で構築していました。Markdownで記事を書ける等のメリットから利用していたのですが、使っていくうちにいくつかの問題が出てきました。ローカル環境が破損しやすいテーマ（デザイン系）リポジトリとHexoのメインリポジトリが別なので、デザイン修正するには行ったり来たりして修正しないといけない画像周りの管理がめんどいこれに合わせて、ニコニコで活動する上での情報をまとめるのに利用していた「ユーザーブロマガ」がサービス終了したこともあり、ブログのリニューアルを行うことにしました。必要用件ブログ記事更新がしやすいブログ記事で利用する画像の管理がしやすいNuxt.js で作成できる以上の観点から良さげなものを探した時に、友人から「これおすすめだよ〜」と教えてもらったのが microCMSでした。なぜmicroCMSなの？調べていくうちに、目的と合致すること以外にも、ドキュメントが整理されている公式ブログに言語ごとのチュートリアル的なものがたくさん上がっているので、とっかかりしやすい等のメリットがあったため、利用することにしました。いざ、実践！といっても、8割方、公式ブログ通りなので、以下の関連リンクから調べてみてくださいmicroCMS + NuxtでJamstackブログを作ってみよう(microCMS公式ブログ)microCMSのNuxt.js用モジュールを公開しました(microCMS公式ブログ)デザインは、BootstrapVueを利用しながら、Hexo時のデザインを踏襲しつつ作成しました。この記事では、つまずいたことをメインに書いていこうと思います。① Nuxt-linkで移動するとOGPが死ぬNuxt-link とは、aタグ同様、リンクを移動する時に使うやつです。クリックすると、設定したそのページに飛びます。Vueを知る人は、router-link に似るものといえばわかると思います。aタグとの違いは、移動先がNuxt.jsの内部ページであれば圧倒的にパフォーマンスが良いという点です。今回何が問題だったかというと、パフォーマンスが良い代わりにOGPが死にます。正確には、移動前のページのOGPをそのまま受け継いでしまい、Twitterなどへの共有ボタンが機能しなくなるという点です。解決法、知る方いれば教えてください。（今回は諦めて、aタグで妥協しました）② Jamstack化するとOGPが死ぬOGP、おまえ、いっつも死んでんな....先ほど紹介した記事通り、最初は作っていたのですが、一通り作り終え、試しにgenerateすると、なんということでしょう！全ての記事のOGPが、とある１つの記事になっているではありませんか！！なんで...？こちらも、結局解決策がわからず、Jamstackを諦め、SSRで構築しています。③ nuxt-highlightjsで特定のテーマが利用できないこれは大丈夫です。解決済みです。Nuxtで構築するにあたって、便利そうなものをもろもろと入れています。その中にHighlightjsもあります。Highlightjsとは、以下のようにコードを書くと、ハイライトをかけてくれるライブラリです。var message = "Hello world"; console.log(message);nuxt-highlightjsで、テーマ「GitHub Dark」が利用できませんでした。色々試しましたが、正攻法では利用できず、結果、テーマのSCSSを nuxt.config.js で直読みしています。 css: [ '~/assets/icomoon_fonts/icomoon-style.css', 　//オリジナルsvgフォントファイル '~/assets/style/github-dark.scss', //HighlightJS テーマ '~/assets/style/main.scss' ],感想約２週間の突貫工事だったため、まだ色々と足りていない部分があります。先ほどあげたつまづきも、力技でなんとかしているだけなので、いつかちゃんとした解消法を見つけて直していきたいです。今後について今後は、ページ移動時のレスポンスの遅さを解消Disqusの再導入あたり進めていきたいなと思っています。おわりにいかがでしたでしょうか。作っていて楽しかったです。みなさんもぜひ、Nuxt.js × microCMSでブログを作ってみてはいかがでしょうか。N・S高等学校 Advent Calendar 2021 、明日以降もまだまだ続きますので、ぜひ、引き続きご覧ください。以上、猫月遥歩（ねこづきあゆむ）でした。Thank you for Reading!

この記事はWordPressから移行した記事です。 お久しぶりです。 先日、AppleWatchを買いました。 普通は９月（新機種発表会）まで待つんだけどね、待てなかったｗｗ てことで簡単なレビュー的なものです。 買ったのはこれ。 Series4 GPS 40mm スペースグレイアルミニウム + ブラックスポーツバンド まず、一言。買ってよかった。 買ったのはGPSモデルなんでiPhoneないと使いものにならないけど、この時代、スマホを持ち歩かないことなんてないと思うので全く問題はないです。 支払いもこれだけで….って言いたいところなんだけど、LINE Pay派で、しかも鹿児島（市バス市電はSuica使えない）なのであんまりそこらへんは役に立ってないです。（たま～にJR乗るときにSuica使えるくらい） あと結構使ってるのが「再生中」と「タイマー」。 再生中はスマホ置いてアニメみたりってときにわざわざスマホ持って音量調節しなくても手元でできるからめっちゃ楽。歩いてる時とかもカバンから出さずに音量調節できるのでめっちゃ重宝してます タイマーはカップラーメン作る時に楽です。 HEY Siri タイマー３分　で勝手にやってくれるのでｗ まぁそんな感じで使ってます 気になる人は買ってみてね 余談 WWDC2019見ましたか？Watch OS 6が来るらしいです 個人的に計算機アプリと、watch単体でAppStoreが使えるようになるとこが嬉しいです ついでに、iOS13。ダークモードキターーー！！ 気長に待ちましょう。以上、猫月遥歩でした。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

この記事はWordPressから移行した記事です。 いままでご愛読していただいた皆さん、ありがとうございました。 決断理由はいくつかありますが主にこんな感じです。 ・iframeを埋め込むにはビジネスプラン以上出ないと使えない　ボカロ曲の紹介とかしたいので… ・そこまで更新しないブログにお金払う必要ある？ ・そもそも契約理由はドメインのみ こんな感じです。 今後の流れとしては ①こちらのブログは別ドメインで維持予定（無料プランのため広告が表示されるかも？） ②メインブログをブロマガに戻す 以上2点です。 今までご愛読していただいた皆さん、ありがとうございました。 ブロマガでもよろしくお願い致します。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

この記事はブロマガから移行した記事です。 元記事はこちらhttps://ch.nicovideo.jp/nekozuki_blog/blomaga/ar1873503 お久しぶりです。猫月あゆむです。 先日まで（というかさっきまで）WordPressのブログをメインにしていたんですが、メインブログをコチラに戻すことにしました。 今回の動機はコチラから。 ○今後の動向現在、「nekozuki.me」のドメイン移管を行ってます。 というのも、ドメインと同時にブログを買ってたので、WordPressにくっついてたんです。それを切り離して、ドメイン単体をお名前.comに移管、旧ブログは無料ドメイン（nekozukime.wordpress.com）でアーカイブとして残す予定です。 移管したドメインは、GitHubPagesかなんかで「猫月あゆむポータル」的なものを作ろうと思ってます。 こちらのブロマガでは、これまでどおりのブログとしての運用をする予定です。また、前のブログでできなかった、iframeを埋め込んでボカロ曲紹介とかもやろうかなと思ってます。 ○終わりにほぼいつも思いつきで行動してるので急な発表（？）になったかもしれませんが、今後も猫月あゆむをよろしくお願い致します。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

※ 現在各所調整中なので、背景チカチカしたり、ところどころ崩れちゃったりしてます。後日治すのでそれまでお待ちを….！ はじめまして。猫月あゆむです。普段はニコニコ生放送で放送してたり、バーチャル空間で遊んでたりしています。リアルでは、高校3年生です。 これまで、ブロマガ → WordPress → ブロマガ と使ってきたんですが、なかなかオリジナリティを出せず、あまり書けていませんでした。そんなとき、友人の一人がhexoでブログを立てているのを見て、これちょっとやってみようということで作っています。 「hexoでブログを立てるシリーズ」では、このブログを作る上で起こった小話をちょこちょこ投稿できたらなと思っています。技術寄りのやつはQiitaに持っていくので、そこまで難しくないよ～～ と、ここまで書きましたが。hexoでまともなブログ文章書くの、これが初めてなんです。いざプレビューしてみたら、フォントが変！なに、タイトルのちっちゃい「つ」ww 大きくなってるしwまぁテーマが中国の方のものをお借りしているので、自力で修正するしかないんですけどね….（後日やります） とりあえず、話を戻しますｗ その１：数回リセットした話。というのも、試行錯誤の繰り返しでした。 1度目。導入に成功するものの、GitHub Pagesで正常に公開できない。なんでだろ～と小4時間探した末、わからなかったので全消去して再度入れ直しました…. 2度目。↑でダメならnetlifyを使おう！ってことでセットアップ始めて、1度目終わりのところまで来たんですが、その後がエラー祭り。頭の中が全て？？？で埋まって思考停止したので、その日は諦めました。 ネット超会議が過ぎ、昨日。 そう言えばということで3度目の構築をはじめました。やはりエラー祭りでしたが、なんとか構築できた～よかったねという話でした。 その２：背景がおかしい現在進行系でおかしいです。 背景、スライドショーになってて（PC/Tabのみ）、特定ディレクトリ内をランダムで流してくれるんですが、はっきりいって鬱陶しい。ということで切りたいんですが、今の所切り方を見つけられてません。 なので代替策で、白画像用意して1枚だけにすれば…！って思ったんですけど、なぜかブラウザが落ちる（←なぜ？？？） 1枚ダメ、2枚ダメ….というふうにしていって現在6枚で動作中です。 なんとかしてスライドショー切りたい…. その３：これはココ！っていうのを探すの楽しいｗhexo って普通のHTMLブログのいわば “ジェネレーター” なんですよ。なので、サイドパネルのところとかバッラバラに分散してて、それがどこにあるのか探すの楽しかったです。 そして案外、簡単な仕組みで書かれていることを知ったので、数分でTwitterとかも埋め込んでみましたｗ 結構オリジナリティ出せそうですが、流石にテーマ１からというのはレベルが高そうです。 おわりに。今後の予定ということで簡単な小話でした。 今後はこんなことをやる予定です。 表示崩れ/バグ修正・背景のチカチカ・フッターが読みづらい・検索ボックス入力時、表示がうるさい・検索システムが動いてない・中国語→日本語の翻訳作業 仕様変更・各リンクなどのベース色をきみどりに・フォントを日本語ベースに(特に漢字) 追加機能・カスタム絵文字の追加・RSSの追加・サイトマップの追加・ロゴ/ファビコン作成・各記事からのSNS拡散ツール導入 hexoブログの作成がある程度終わったあと・今年度の新ポートフォリオ作成・猫月あゆむPORTAL(β)の改修 やることたくさん……バイトがコロナの影響でお休みになってる今、できるだけじゃんじゃんやりたいことをやっていこうと思います！！ それでは今日はここらへんで。ノシノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

ども、猫月あゆむです。 だいぶデザイン変わりましたね。それもそのはず。テーマを変えました。 個人的に、いわゆる「ダークテーマ（ナイトモード）」が好きで、最初に入れた「gal」というテーマと、「Amazing」というライト＆ダークが切り替えられるテーマ。どちらにするかめっちゃ悩んでました。 ▼ 昨日のスクショ（テーマ「gal」のリメイク） なんで変えたの？前回お話した、「背景チカチカ問題」が修正できず、ただ時間だけが流れてしまっていたので、いっそテーマを変えてみようということになりました。 当初悩んでいた「Amazing」はダークモードへの切り替えができたんですが、「Icarus」というテーマをベースに追加追加してできていたものだったので、日本語への翻訳・細かい箇所の修正ができませんでした。 そんなとき、「Amazing」ダークモード変更の根幹部分のものを見つけたんですが、確認してみたら、Amazing入れるよりよっぽどやりやすい！ということで、結果「Icarus」+ night をテーマとして選択しました。 サイト右上の電球をクリックで明るくなります。 「Icarus」nightの導入方法はコチラ ※ 英語＆中国語 今日やったこと今日は、上述した テーマの変更・導入・各所修正 をしました。 次に、「サイトロゴ」「ファビコン」を設定しました。サイトの上下にある「ねころぐ」っていうやつと、タブのところにあるアイコンです。なぜかSVGで作ったら読み込んでくれなかったので、仕方なくpngです….. それともう一つ。お気づきの人もいるかと思います。自作Webフォントを追加しました。 今回導入したのはこの２つ。 ニコニコテレビちゃんと新しい生放送のアイコンの子。 fontawesomeさんと競合しちゃってずっと奮闘してましたが、なんとか導入できました！！右上フォローボタンの下にずっといる予定です。 今後の予定ざっとこんな感じです。 ・記事下共有ボタン追加・Aboutページの作成・カスタム絵文字の追加・RSSの追加・サイトマップの追加・フォントを日本語ベースに(特に漢字) hexoブログの作成がある程度終わったあと・今年度の新ポートフォリオ作成・猫月あゆむPORTAL(β)の改修 って感じです。昨日よりは減りましたｗ というわけで夜も遅いので今日はココまで。ノシノシ～ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも、猫月あゆむです。３日目です。明日以降、３日坊主にならないことを祈って書いてます。 今日は、細かいけどでかい変更祭りです。 今日の機能追加今日は色々追加したので、一つずつ説明します。 ① 共有ボタンを追加しました。この記事の一番下とかに共有ボタンができてます。よかったらここから拡散よろしくね。 ② コメント機能を追加しました。DISQUSというコメント機能を追加しました。記事ごとにコメントを付けれます。コメント書くときのマナーは守ってね コメント機能について - About ③ 404 ができましたできてしまいました。ページがないところに行くと自動的に404に飛ばされます。404に共有ボタンはないけど、コメント機能あえて残してるので、雑談にでも自由に使ってくださいｗｗ 404 - Page not found ④ RSS / サイトマップができましたテレビちゃんの右のアイコンからRSS見れます。 RSSリーダーをお使いの方はご利用ください。 サイトマップもできました。検索から人が来やすくなる…はず…（たぶん） ⑤ Googleアナリティクスを導入しました導入したところで…ほぼ見ないと思う。気になる方はCookieをオフにお願いします。 データ収集について - About ⑥ トップページに「お知らせ」を作りました。無理やり感半端ない。 日付10年後になってるしｗｗいつか、初来訪時のデフォルトをナイトモードにしたいです。（今はライト） 今日の変更変更点はそこまで無いです。 ① フォントを変更しました。「今」とかの漢字の中国感がなくなったと思います。 ② カテゴリページへの動線を消しました どうせカテゴリ設定しないし。タグ乱用するひとなので、タグ一覧からどうぞ。 タグ一覧 カテゴリ一覧 ←からっぽ ③ 記事最後のタグ表記を ＃ から に変えました一番下、共有ボタンの上です。後で見てみてね おわりにざっとこんな感じです。変更点の羅列だけで結構長くなっちゃいました… 今後の予定今後の予定はこんな感じ。 ・カスタム絵文字の追加 hexoブログの作成がある程度終わったあと・今年度の新ポートフォリオ作成・猫月あゆむPORTAL(β)の改修 ブログ改修も残り少しとなりました。その後何しようかなって考えとかないとですね… というわけで今日はココまで。ノシノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

３日坊主にならなくてよかったよ。どうも猫月あゆむです。 今日はトップに画像はありません。画像貼っちゃうとトップページに乗ったときにくっそ長くなってしまったので… ということで、画像を貼ります。ペタリ そう。今日はスマホです。docomoユーザーで、充電が84%で…とか言う話ではなくて、 PWA のお話です。 PWAとはなんぞや？ PWA（Progressive Web Apps）はグーグルがモバイルユーザーのユーザー体験向上を目的とし、今までのWebアプリ（サービス）にWebとアプリの両方の利点を兼ね備えた仕組みのことです。 引用元 : Webディレクターが知らないとマズい！Googleの注目プロジェクトPWAって何？ らしいです。簡単に言うと、Webサイトをアプリケーション化すると言ったほうがわかりやすいでしょうか。 Twitterとか、ニコ厨だったらわかるビビットアーミー（広告がうるさいやつ）なんかも対応してます。 PWAの利点利点としてはこんな感じ。 ・アドレスバー、タブボタンとかがないので、誤タップが減る・各OSのアプリストアを使わなくて良い　→ 審査で引っかかることがない・GPS取得ができる（IPアドレス補足じゃなくてガチのGPS）・プッシュ通知ができる 利点でも欠点でもない（人による）・ブラウザ → メニュー → ホーム画面に追加しないと使えない 欠点・https（SSL）じゃないと使えない ざっとこんな感じです。 利点でも欠点でもないやつは、アプリストアを使わなくて良いという利点と、ホーム画面に追加が初見勢にとってはわかりにくいという欠点が合わさってできているから。 なぜ導入したの？ねころぐに導入したのは、単に興味本位です。簡単に導入できるライブラリがあったので、入れてみました。 一応Aboutにも書いてますが、GPSなどの位置情報は取得してないし、今の所プッシュ通知も行かないと思うので大丈夫です。 他の変更点その１、GitHub Emoji を導入しました。😄ホントはTwemojiを導入したかった。いずれTwemojiに変わってると思います。 その２、リポジトリに MIT License を付与しました。詳しくは About ページ、メインリポジトリのRead.mdをご確認ください。 当ブログに書いた、猫月あゆむ個人の発言は CC BY-ND 4.0 で利用可能です。 また、後術するGitHubリポジトリに記載されている当サイトのデータは MIT ライセンスで利用可能です。 引用元 : ねころぐについて おわりに今日で、カスタム絵文字以外のブログ構築が終わりました。カスタム絵文字は、絵文字データを登録するだけ（GitHubEmojiさんにカスタム機能がついてた）なので、暇なときにでも追加していくと思います。 せっかくここまで、連日ブログを書いてるので、明日以降も何かしらのブログを書こうと思います。 明日からは、今年度のポートフォリオを作成します。デザイン案とかは結構前にできてるので、中身をバンバン作っていくよ～～お楽しみに。 後でもう１本ブログ上げるかも。ノシノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも猫月あゆむです。ブログ構築2日目の記事 で、自作フォントを導入したよ！っていうお話をしたと思います。ツイッターで質問が来てたのでそれの詳しい解説です。 導入方法導入方法自体は結構簡単でした。 参考：Webアイコン「IcoMoon」の使い方とアイコンの追加方法 まず、フォント化したい画像、アイコンとかを SVG 形式で用意します。画像が用意できたら、icomoon というサイトを利用してフォント化します。 フォント化方法ざっとこんな感じ。わからないことあったらコメント欄へGO 右上インポートからSVGを読み込む 入れたいアイコンを選択し、右下「Genelate font」をクリック アイコン名、大きさなどを調整 画面右下ダウンロードの隣の をクリック 項目を以下のように改変 理由としては、 Class Prefix　fontawesomeとの競合避けその１ Use i　hexoで色んな所で使うにはfontawesomeと合わせないと、_config.ymlから編集できない（うまく反映されない） って感じです。 設定できたらダウンロード。 hexoへ導入ここから先は、利用しているテーマによってかなり変わってきます。当ブログでは「Icarus」を利用しているのを前提に解説します。 まず、DLしたファイルを以下のように配置します。 12345678910blogdir/ └ themes/ └ icarus/ └ source/ ├ css/ ├ img/ └ fonts/ //なければmkdir ├ style.css //DLファイル ├ selection.json //DLファイル └ fonts/ //DLファイル 次に、head.jsx を編集します。head.jsxは以下の場所に格納されています。 1...blogdir/themes/icarus/layout/common/head.jsx そして以下のように書き換えます。 head.jsx1234- <link rel="stylesheet" href={iconcdn()} />+ <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.13.0/css/all.css" /> + <link rel="stylesheet" href="/fonts/style.css" /> _config.ymlで指定している fontawesomeを切って、直で読み込ませます。あと、さっきの自作フォントも読み込ませます。 直で読み込ませてるのは競合対策です。 これで、<i class="icon2-niconico"></i> ってすると 読み込めます。 おまけ：プロフィールに自作フォントを使うthemes/icarus/_config.yml12345678910111213social_links: Github: icon: fab fa-github url: 'https://github.com/AyumuNekozuki' Twitter: icon: fab fa-twitter url: 'https://twitter.com/nekozuki_2525' niconico: icon: icon2-niconico url: 'https://www.nicovideo.jp/user/45048152' RSS: icon: fas fa-rss url: /atom.xml 以上。何か質問あったらコメント欄へどうぞ。 最後に一言。アウトプットは大事。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも、猫月あゆむです。昨日寝たら、めっちゃ足が痒くて途中で目が覚めました；； ということで、朝になって真っ先にマツキヨに行って薬を買って塗りました。 しもやけって寒暖差で起こるんですね。自分、年中末端冷え性なので結構辛いのです。 去年そこまで起こらなかったので大丈夫かなぁと思ったんですけどね。 今夜も鹿児島は寒くなるらしいです。暖かくして寝ます。 今日は短いですがここらで。（昨日3本上げたので… ノシノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも、猫月あゆむです。初のレビュー記事です。画像は無いです。 初のレビュー記事となる今回は Beats Studio3 Wireless を書いていこうと思います。 なぜ買ったのか実を言うと、3月中旬にとある用事で東京に行く予定でした。ですが、コロナの関係でその予定がなくなってしまったので、その余った旅費で買いました。 自分が買ったときは Amazonで税込 ￥37,959 でした。（旅費の残りは貯金） 今思うと、なぜ買ったの！？って気もしますが、買ってよかったです。 買ってよかったと思える面その１：iPhone/iPadとのペアリングが楽これはApple傘下にいることならではでしょう。 まじで初回のペアリングが楽だった。beats起動 → iPhone画面に接続文字が出てくる → タップ → 終わり！ まじでこれは神仕様ですわ。 その２：バッテリーの持ちが良いくっそ良いです。24時間ずっと聞いててほぼ１日持たないぐらいです。ただ、普通に考えてずっと聞いてることなんて滅多にないと思うので大丈夫でしょう。 ちなみに↑の持ち時間は「ノイズキャンセリング」オン時なので、オフにすればもっと持つはず。 その３：ワイヤレスなのに音がいいAirPodsと比べ物になりません（当たり前だ） その４：有線でも使えるこれ強いのでは。 付属（市販でもOK）のAUXで繋げば普通に音が聞けます。ただしバッテリーがないと動きません。（ノイキャンとかあるんで…） イマイチだった点その１：長時間つけると耳が痛い３，４時間ほど付けてると耳が痛くなってきます。このヘッドホン自体の重さがある程度あるんで、結構つらいです。 たぶん、多少頭の大きい、ヘッドホンにフィットする人なら大丈夫かなと思います。 その２：ノイキャンがそこまで…完全なノイキャンではないです。まぁ完全なノイキャンだと逆に危険なのでまぁ良い点なのかもしれませんが。 普通に車通りの多い道を歩いていると、ぶーんっていう音が聞こえてきます。そこまで車通りないなら全然大丈夫。 飛行機は試す機会がなかったのでまた今度。 個人的には、昔持ってた ウォークマンS10シリーズ のノイキャンのほうが優秀でした。 その３：WinPCの電源を付けると強制的にWinPCに持っていかれるこれは完全に誤算でした… こういうシチュエーションで起こります。 iPhoneで音楽を聞いていて bluetoothペアリング済みのWindowsPCの電源を付けると iPhoneとの通信が切れ、WinPCと強制的に接続される これ、なんとかならんかね…… その４：値段が高いそりゃね… こんな人にオススメ！身の回りの環境をApple製品で揃えている人ペアリングのしやすさ・各端末の切り替えやすさはダントツですね AppleWatchを持っている人ヘッドホン本体にボリューム、再生・一時停止ボタンはありますが、Prev/Skipボタンがないです。出先で、スマホを取り出さずに、ささっと曲を切り替えたいならばAppleWatchが必須でしょう。 ちなみに、AirPodsのようなジェスチャー機能はないです。 総評個人的総評 ★★★★☆　（星4つ） かなり良い製品だけど、あと1歩が…って感じ。ただ、身の回りをApple製品で揃えている人で、AirPods/AirPodsProで物足りない、イヤホンよりヘッドホン派という人は選択肢に入れても良いかも。 Android派の人は、別にこれじゃなくても感。 自身の財布としっかり相談しましょう。 いかがだったでしょうか。また1ヶ月後ぐらいに、次は中古で買った “名機”nasne と ニコニコ実況 のお話をしようと思います。 それでは～～ノシノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも、猫月あゆむです。プリンセスコネクト！Re:Dive 復帰しました。 というのも、アニメ見てたら久々にやりたくなったんです１話＆最新話無料なのでぜひ プリンセスコネクト！Re:Dive 第1話「冒険の始まり ～夕焼け空にきのこのソテー～」 もともと、半年前ぐらいまでちょこっとやってたんですけど、いつの間にかログインしなくなっちゃって。 この前ログインしたら… 189日ぶりジュエル x18000スタミナ x2536 やべぇｗｗそしてこれを約３日で溶かしましたｗｗｗ いまスタミナなくて困ってます… 😣 ちなみに、コッコロたん推しです★６コッコロの素材集め（メモリーピースとか）終わったけれど、シャドウコッコロが強すぎて今のレベルじゃ倒せない… パーティーはこんな感じ。 いろいろ足りてないですね頑張ります こんな僕にフレンド組んでくださる方いればお願いします…！（残り２９人分枠空いてます） クランは、ちょっと入りたいクランあるんで、そこのクラン落ちてたら拾ってください…！ プリコネ復帰したっていうお話でした。 ちょっと宣伝！ バーチャルキャストラジオ企画、略して「Vラジ！」新しく運営メンバーに就任しました！ 次回放送は 5/14 (木) 21:30～ 予定です！ぜひ御覧ください！！ 放送コミュはこちらから。 【ニコニコ動画】Vラジ（仮）放送局 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

タイトル通りです。編集中にファイルが逝って、3回目の書き直しです。最初は前文面白いこと書いてたんですけど、めんどくさいので本題に移ります。 構築するdocker-compose で以下の環境を構築するイメージは今回は公式イメージを利用。 php:7.4.16-apache mysql:5.7 phpmyadmin/phpmyadmin docker-compose.ymlを書く書いた 1234567.├ school_workspace/├ nnn_workspace/├ nekozuki_workspace/├ docker-compose.yml├ php.ini└ httpd.conf docker-compose.yml123456789101112131415161718192021222324252627version: '3.5'services: php: image: php:7.4.16-apache volumes: - ./php.ini:/usr/local/etc/php/php.ini - ./httpd.conf:/usr/local/apache2/conf/httpd.conf - .:/var/www/html ports: - 8080:80 mysql: image: mysql:5.7 volumes: - ./mysql:/var/lib/mysql environment: - ぱすわーどとか phpmyadmin: image: phpmyadmin/phpmyadmin environment: - ぱすわーどとか links: - mysql ports: - 4040:80 volumes: - ./phpmyadmin/sessions:/sessions はい。 動かす1$ docker-compose up 動いた！けど。 123456789.├ school_workspace/├ nnn_workspace/├ nekozuki_workspace/├ mysql/├ phpmyadmin/├ docker-compose.yml├ php.ini└ httpd.conf 色々邪魔だなぁ。 サブディレクトリから起動するディレクトリこうしてみる。合わせてdocker-compose.ymlも修正。 12345678.├ school_workspace/├ nnn_workspace/├ nekozuki_workspace/└ docker/ ├ docker-compose.yml ├ php.ini └ httpd.conf docker-compose.yml123456789101112131415version: '3.5'services: php: image: php:7.4.16-apache volumes: - ./php.ini:/usr/local/etc/php/php.ini - ./httpd.conf:/usr/local/apache2/conf/httpd.conf - ../:/var/www/html ports: - 8080:80 mysql: 略 phpmyadmin: 略 起動。 1$ docker-compose -f ./docker/docker-compose.yml up わーい。rootも綺麗。 12345678910.├ school_workspace/├ nnn_workspace/├ nekozuki_workspace/└ docker/ ├ mysql/ ├ phpmyadmin/ ├ docker-compose.yml ├ php.ini └ httpd.conf でも起動時のコマンドが長いな… .shから起動する1234567891011.├ school_workspace/├ nnn_workspace/├ nekozuki_workspace/├ docker/│ ├ mysql/│ ├ phpmyadmin/│ ├ docker-compose.yml│ ├ php.ini│ └ httpd.conf└ start_php.sh 123#!/bin/shdocker-compose -f ./docker/docker-compose.yml up 1$ ./start_php.sh できたー！ あとがきできるだけdockerに慣れ親しんで使えるようになりたいので、今後も色々触っていきたいです 参考文献 docker-compose を用いて Apache・PHP・MySQL の開発環境を構築してみた 他のフォルダのdocker-compose.ymlを実行する方法 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

学校の授業でサブスクについての話題になり、最近確認してないなと思ったので一度確認してみる。 とりまチェック。主に、月払いのサブスクと年払いのサブスクがあるので確認していく。実際に払う金額でないと実感が出ないので、全て税込み価格。 月払いサブスクを確認する サブスク 金額 ニコニコプレミアム ¥550 ニコニコチャンネル（dアニメ支店） ¥440 ニコニコチャンネル（SmileS） ¥1980 pixivプレミアム ¥550 ドメイン維持費（nekozuki.me） ¥110 Google Workspace Enterprise Standard ¥2260 iCloud（200GB） ¥400 Discord NITRO CLASSIC $4.99 (¥526前後) Franz Franz Professional $7.99 (¥870前後) GitHub Pro $4 (¥440前後) —- —- 合計 ¥8126 年払いサブスクを確認する サブスク 金額 Amazon Prime Student ¥2450 iTunes Match ¥3980 Splashtop Personal - Anywhere Access Pack $16.99 (¥1870前後) Duet Pro ¥3200 ドメイン維持費（nekozuki.me） ¥8272 (※2年に1度なので¥4136) —- —- 合計 ¥15636 1年で… サブスク 金額 月払いx12 ¥97512 年払い ¥15636 —- —- 合計 ¥113148 こりゃ結構な出費だ… ヤマザキ春の解約祭りとりあえず一つずつ見直す。 サブスク 今後 備考 ニコニコプレミアム 維持 生命線＆クリ奨で元取れてる ニコニコチャンネル（dアニメ支店） 維持 生命線＆クリ奨で元取れてる ニコニコチャンネル（SmileS） 維持 脱退理由がない＆クリ奨で元取れてる ドメイン維持費（nekozuki.me） 維持 生命線 Google Workspace Enterprise Standard 維持 GDrive容量無限は強い Discord NITRO CLASSIC 維持 絵文字＆アカウントの#2525維持のため Amazon Prime Student 維持 生命線 サブスク 今後 備考 Franz Franz Professional Personalへ変更($3.99) Proの機能は使ってないが有料機能は使ってる為 GitHub Pro 学割再申し込み($0) N高卒業で一旦学割が切れたが学生であることには変わりない為 iTunes Match 代替サービス検討 代替サービスが見つかり次第解約 サブスク 今後 備考 pixivプレミアム 解約 使ってないので iCloud（200GB） 解約 中身を全てGDriveに移動後に解約 Duet Pro 解約 最近使ってないので Splashtop Personal - Anywhere Access Pack 解約 別の無料ソフトで代替可能な為 結果。¥82258/年まで減らせました。 といってもまだ多いな。減らせるときに減らしておきたいです。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

ども、猫月あゆむです。放送しながら記事書いてます。 N Air配信テスト タイトル通りです。XSplitからN Airに移行しました。 なぜ変えるの？色んな理由があるんですが、 その１：PCが変わったのでN Airの仕様に縛られることがなくなった前のPCは、ゲーミングノートPCでした。そのため、「統合型グラフィックス」で起動しないと一部映像が真っ黒になってしまいました。 ちなみに統合型グラフィックスというのはグラボ（GTX 1050など）ではなく、CPUの映像出力のやつでやってるので、CPUの使用率が上がり…最終的には固まる、強制終了、PCが落ちるなどがありました。 ですが先日（といっても12月ですが）、PCを新調してノートではなくなったのでこの仕様に縛られることがなくなりました。 その２：XSplitはお金がかかるこれまでお金払って使ってきたんですが、最近、 放送頻度が少なくなってきてる YouTubeとのサイマル放送をやることがなくなった ので、いいかなって。月800円ちょい、３ヶ月で3000円ないぐらいかかるので出費を抑えるのにもいいかなって思いました。 なぜ、N Airに？基本、自分はニコ生しかやらない人間なので、他のOBSとかSteamlabsとかを使うメリットがそこまでありませんでした。 以前使ってたときと比べて、バグは減り、コメント閲覧など便利な機能が追加されたそうなのでN Airにしました。 さいごに放送頻度が増えるわけじゃないですが、ときたま放送来ていただけると幸いです 【ニコニコ動画】ねこが集まる放送局 【ニコニコ動画】ねこづきあゆむのさぎょうべや document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

はじめに環境は以下の通り。 Windows 10 Google Chrome 81.0 通知がうるさい自分は、niconicoやYouTubeの通知をPCのChromeでオンにしている。というのも、スマホよりPCのほうを多用しており、PCに来たほうが何かと確認が楽なのである。 だが、いつだっただろうか。Chromeの通知がWindows10のネイティブ通知として来るようになってしまい、心底うんざりしている。というのもいくつかデメリットが有るのだ。 ネイティブ通知のデメリットその１：音が鳴るうるさい。表示するだけでいいのに音がなるせいでうるさい。 その２：表示が遅い、複数個出ないブラウザ起動後、起動までに溜まっていた通知がダダダダと表示される。表示するのは良いのだが、複数個出ない。 しかもこの際、まいどまいど音がなるのだ。まじうるさい。 その３：通知が溜まるスマホでは通知が溜まるのは当たり前だ。見逃した通知を後から見れるようになっている。 Windows10にも同様の機能がついているのだが、イマイチ使いづらい。スマホと違い、1個1個の通知が多少の大きさがあるため、4,5個通知が溜まっただけで表示範囲からはみ出てしまう。こうなるとスクロールして見るほかない。 その４：YouTubeの通知がうざいうざいと書いたが、通知が来る分には構わない。自分にも追っているVTuberの一人や二人はいるし、動画の更新情報だって知りたい。だが、他のサイトの通知とは違い「閉じる」ボタンがバカでかく表示される。流石にこれはうざいし通知領域の幅をとってしまう。 どうすればいい？解決への条件 通知が来た際の効果音を消す、もしくは小さくする Windows10のネイティブ通知を使わない 上記2つが解決への条件だ。Windows10のネイティブ通知を使わないことで、「表示が遅い/複数個表示されない」「通知が溜まる」という問題を解消できる。 実際に設定してみるChromeのアドレスバーに以下のURLを打ち込む。 chrome://flags/ すると全面英語のページが出てくる。このページはChromeの「実験中機能」を使えるようにする設定画面だ。 上部にある警告を読み、同意できるものだけこの先に進もう。 上にある検索ボックスで「notifications」と検索。日本語訳すると「通知」だ。 すると3つの設定項目が出てくる。 この中から「Enable native notifications.」＝「ネイティブ通知を有効にします。」というものを探す。 現在、Defaultになっているが、これをDisabled＝無効にし、ブラウザを再起動。 すると、 上のように、Chrome自体の通知で飛んでくるようになる。幸いなことに、何も設定せずとも音がならないようになっている。ありがたいことだ。 おわりに上述した設定をON/OFFすることで通知の種類を変えることができるのでぜひ。たぶんMacでも同じことができるはず。 Webサイトからの通知のお話をしたが、当ブログでWeb Pushを導入する予定はないのでご安心を。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

ねこづきあゆむです。今日はBootstrapを使って「ニコニ広告ex.」のサイトをリニューアルしました。 Bootstarapとは？ Bootstrapはレスポンシブデザインに対応したフロントエンドのフレームワーク https://techacademy.jp/magazine/6270 簡単に言うと、CSSファイルの集合体（たぶんちがう）です。htmlファイルでクラス指定するだけで、Bootstrapのスタイルできれいな感じにしてくれます。 例えば… index.html123<a href="#dl" class="btn btn-primary btn-lg" role="button" aria-pressed="true"> <i class="fas fa-download"></i>ダウンロード</a> こんな感じで、特定の class を指定してあげるだけできれいな感じにしてくれます。 使ってみて一長一短でした。 メリット要素を形にしやすい思っていたとおりにクラス指定するだけで大部分ができるのでとても楽です。ナビゲーションバーとかもサクッと作れてしまったのでびっくりしました レスポンシブ対応がしやすい自分が頑張らなくてもレスポンシブになるのでとても楽。 デメリットオリジナリティを出しづらいどうしても、オリジナリティを出しづらいです。先程ダウンロードボタンの画像を貼りましたが、あのボタン色んな所にありそうですよね。そんな感じでオリジナリティが出しづらいです。 作っていると既存サイトに引っ張られやすい自分だけかな？作ってて、これいいなあれいいなという感じで詰め込んでいったらN Airのサイトっぽくなってしまいました。（特にDLリンクより下の部分）どうしてもパーツで似たのがあると引っ張られる感じがします。 総合評価個人的にはうーん…っていう感じでした。ただ、今後いろんなプロダクトを作っていくとどこかで確実に使うことになりそうなので多少の勉強はしておいたほうが良い気がします。 まぁ今後、趣味で作ったプロダクトのサイトには導入しません。 あと、Fontawesomeとマッチしすぎてやばいｗ おわりに２・３時間で完成させるつもりが、色々ハマってしまって結局まる1日かかりました。家での自粛期間ももうそろそろ終わりそうなので、この間にできること・やりたいことをじゃんじゃんやりたいです。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

どうも猫月あゆむです。AWS Educateを触ってみたのでその感想です。 前提まず、今回話すのは AWS Educateという教育機関向けのAWSです。 そして、今回はN高のアカウントで触るので、加盟校（高校）の利点が利用できる状態のお話です。まぁこれ以上のプランはEducateには無い（たぶん）と思います。 使ってみて今回、Mastodonのインスタンスを建てました。Mastdon構築で詰まったこととかはまた後日。 メリットえっと。利点わからない…..学校に所属する間はいろんな機能が無料ってことぐらいですかね…？あと100ドルぐらいクレジットが付いてくる デメリットその１：いろんな機能が「使えない」「vocareum」という外部サイトを経由して入るんですが、そのせいでいろいろな機能が使えません。 例えば「アカウント情報」。メールアドレスとかの変更とかできません。SES（メール関連）とかも全然ダメでした。 その２：メリットが状況次第ではほぼ無いというのも、先程「学校に所属する間はいろんな機能が無料」といいました。ですが、通常のAWSには、初回登録から12ヶ月無料という特典があります。 そのため、自分のような、卒業まで1年を切っている人であれば、別にそこまで変わりません。 結論と検討している人へ簡単な目安作ったのでどうぞ AWS Educate がオススメの人 ちょっと触ってみたいだけの人 やりたいことが明確に決まっていて、必要なツールも全てEducateの利用できる範囲内に収まる人 卒業まである程度年月がある人 AWS がオススメの人 やりたいことが明確に決まっているが、Educateの範囲内に収まらない人 アカウントの切り替えが面倒な人 卒業まで年月が無く、卒業後もAWSを触るかもという人 ざっとこんな感じです。 nextオリジナルマストドンインスタンス立てた document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

オリジナルインスタンスを立てました！！！ 知識なくても2日で立てられるので 💪 技術系、実際に立ててみたい人はコチラをどうぞ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

感想ブログです。放送もやったので良かったら見てね WWDC2020を見る枠 iOS 14 ホーム画面 “App Liblary”追加 “ウィジェット”刷新 “ピクチャーインピクチャー”追加 “Siri”刷新。よりコンパクトに “Translate”アプリ追加 “Messages”アプリ各種リニューアル “Memoji” マップ 名所・レストラン等を探しやすく 自転車・EV系追加（初期時点で日本未対応） CarPlay: 色々アプリ追加 CarPlay: 車の鍵がiPhoneに “App Clips”追加 着信画面が通知デザイン寄りに ホーム画面にウィジェットを埋め込めるようになります。あと、アプリの一覧表示ができるようになります（AppLibrary）。いろいろカスタマイズ性が増してめっちゃいいですね！ ピクチャーインピクチャーがデフォ搭載です。OS標準のプレイヤーでは使えるようになるそうですが、niconicoとかYouTubeとかのプレイヤーでも使えるようになったらいいなぁ。 Siriがコンパクトになります。コンパクトになるのはいいんですが、認識文章わからないのはちょっと…たまに文章の認識がおかしいときがあるので… App Clipsが追加です。例えば、マックに行ったときに、ものすごく混んででモバイルオーダーで頼もうと思ったけどアプリ入れてない！、そんなときに役立つ機能です。アプリの注文機能部分のみをサクッとDLして、キャンペーン情報とかのフルバージョンアプリをあとからDLできる機能。NFCタグとQRコードの認識どちらでも使えるので便利になることは間違いなし。あとは日本のデベロッパーがどこまでやる気になるか… iPadOS 14 アプリ内”サイドバー”の追加改善 検索システム、ポップアップ表示＆結果を総合表示 iOS14の追加機能も搭載。 もちろんこちらも更新。 これまで、iPadOSはスマホ寄りのデザインだったが、今回、また一歩PC寄りにデザイン改善。 あと次の項で話すがApple Pencilとの連携度がバク上がりです！ 周辺端末 “Apple Pencil”、手書きメモの大幅改善＆テキストボックスに手書きで書き込めるように(iPadOS) “AirPods Pro”、5.1ch/7.1ch/DolbyAtmosに対応(全OS) ApplePencil、大幅に利便度が上がります。手書きメモを取ったときに、手書きの☆が長押しするだけできれいに整形された☆になったり、手書き文章をテキストとして読み込めたりします。また、通常のテキストボックスにそのままPencilで書き込むことで、手書きで入力できるように！まじでApplePencilが手放せなくなりましたｗ WatchOS 7 サードパーティアプリ製文字盤が作成可能に 作った文字盤をシェアできるように “ワークアウト”ダンスを追加 “睡眠トラッキング”追加 “手洗いタイマー”追加 iOS14のマップ関連機能も追加。 文字盤がシェアできるようになります！！作った文字盤をシェアして色んな人に使ってもらったり、便利な体験を共有できたりします。 “睡眠トラッキング”機能追加です！アラーム等はもちろん、寝る前のルーティンを設定できたりします。ただ…いつ充電やるの？今でしょ！とかいう話ではなく、昼間スケジュール管理・交通周りで持ち出すAppleWatchを夜もつけていたらいつ充電やるんだろう… タイムリー！”手洗いタイマー”機能追加です！手洗い動作を自動検知して、タイマーが作動します。カウントダウンのシャボン玉デザインすこ プライバシー 位置情報の提供精度をユーザーが指定できるように アプリのプライバシーポリシーをひと目で確認できるように Home & tvOS 14 HomekitがOSS化 “Home”アプリで一括管理できるように tvOS14、ピクチャーインピクチャー対応 mac OS Big Sir アイコンデザインリニューアル “コントロールセンター”追加 iOS14の”ウィジェット”周りも追加 “Safari”大幅アップデート。Chromeより50%早くなる Mac、ARM シリコンチップへ移行 iOS/iPadOSアプリを使えるように “Safari”の大幅アップデートです。Chromeより50%早くなり、セキュリティ・プライバシー面もしっかり。拡張機能周りも実行範囲を選べたりします。 ARMならぬ”シリコンチップ”になりました。これまでiPhoneやiPadに搭載していたシリコンチップ。それの開発技術を集合させmac用にシリコンチップを搭載します！（iPhoneとかの”A13”のような名前は出てきませんでした）。移行周りもアプリの再コンパイルだけでOK、再コンパイルされていなくてもインストール時に自動でやってくれるそうです。すでにMicrosoftやAdobeと連携してOfficeやAdobeCCはネイティブアプリ化されているそう。 開発者用シリコンチップ搭載mac miniは本日より応募可能。実際搭載されてリリースされるのは年末以降。 開発者用OSは本日よりDL可。パブリックベータは来月、リリースはいつもどうり秋となる。 実際にまともに使えるようになるのは秋以降ですが、めっちゃ楽しみです！！！！！！！！！！！！！！！！！！！！！！！！ 以上。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

サマポケRBが届きました！ ゲマズオンラインショップで買ったんですが、発売3日にしてようやく届いた…！地方の辛いところはこれなのよね。 ちなみに、「初回限定版」を買いました。流石に豪華限定版はお値段ががが… これから1周目です！色んな人のツイートをかる～くみると、うみちゃんルートが攻略順によっては、ルート自体が消えてしまうようなのでうみちゃんるーとは早めに攻略したいところではある。が、昇格のみきたちや、識ちゃんも早くやりたくて仕方がないので、うみちゃんルートから回ってみます ということで早くやりたいので今日はココまで。ノシ document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

タイトル通りです。AmongUsを遊ぶことになり、AutoMuteUsを導入したので、備忘録として。 構築する環境 AutoMuteUs（GitHubからFarkCloneしたやつをそのままdocker-composeで） MacbookProのdockerで建てて、Windows側からローカルIP経由で接続する Macで建てる理由は、Macのほうがやりやすいからです。 とりまbot作成DiscordのDeveloperPanelからbotを作成。管理者権限を与えて、自鯖に接続。もちろんTokenはコピっておこうね！ .env を作成cloneしてきたファイルの中にsample.envがあるので、それを元に.envを作成。 .env1234567AUTOMUTEUS_TAG=6.13.0GALACTUS_TAG=2.4.1DISCORD_BOT_TOKEN=**********GALACTUS_HOST=http://localhost:8123GALACTUS_EXTERNAL_PORT=8123 ソースコメントを元に、トークンやら、ポートなんかを設定。 上から順に、 AUTOMUTEUSのGithubrepoのRelease最新版を指定 GALACTUSのGithubrepoのRelease最新版を指定 さっきコピったbotToken IP ポート を設定。詳しくはソース内にコメントがあるからそれを読めばわかる。 docker-composeを実行123$ docker-compose pull$ docker-compose build$ docker-compose up できたー WindowsのAutoMuteusCaptureと接続するコレは簡単。手動接続画面に行き、 URL: localhostの部分をmacのローカルIPに書き換えて接続 Code: Botから渡されたコードを入れる 以上！ あとがき思ってたよりだいぶ簡単でした。みんなも試してみてね document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });

近々、みんなで「近くの人と喋れるAmongUs」をやるので、参加者向けに導入方法を解説します。 lv332256879 PC版の導入方法まず、GitHubからBetter-CrewLinkをダウンロードします。 一番上にある「Download from GitHub」をクリックすればOKです。 DLできたら起動し、インストールします。インストール出来たら起動すると以下の画面が現れます。 スクリーンショット 2021-06-10 135753 これが起動した状態でAmongUsを起動し、ルームに入ると、右側にDiscordのオーバーレイみたいなものが表示されたら導入OKです。ちなみにBetter-CrewLinkの設定からオーバーレイを表示させるさせないといった設定も可能です。 Android版の導入方法まず、GooglePlayよりBetter-CrewLinkをダウンロード・インストールします。 インストール出来たらAmongUs起動しルームに入ります。 そしてBetter-CrewLinkを起動し、Setting画面を開きます。開いたら以下の文言を入力してください。 Ingame Name: ゲーム内の自分の名前 Lobby Code: 部屋コード 入力したら、下にある「Connect」ボタンを押してください。 スクリーンショット 2021-06-10 14 20 38 するとAmongUsの右側にDiscordのオーバーレイみたいなものが表示されたら導入OKです。ちなみにBetter-CrewLinkの設定からオーバーレイを表示させるさせないといった設定も可能です。 iOS版/Switch版の導入方法通話に参加したい端末で Web版のBetter-CrewLinkを開きます。 開いたら以下の文言を入力してください。 Ingame Name: ゲーム内の自分の名前 Lobby Code: 部屋コード 入力したら、下にある「Connect」ボタンを押してください。 スクリーンショット 2021-06-10 14 20 38 すると通話に参加できます。PCやAndroidと違ってオーバーレイには対応していません。 document.querySelectorAll('.twemoji') .forEach(el => { if (!el.dataset.src) { return; } const img = document.createElement('img'); img.style = 'display:none !important;'; img.src = el.dataset.src; img.addEventListener('error', () => { img.remove(); el.style.color = 'inherit'; el.style.backgroundImage = 'none'; el.style.background = 'none'; }); img.addEventListener('load', () => { img.remove(); }); document.body.appendChild(img); });