Sign in Subscribe

YOSHIDA NEKOHA

猫派。ゲーム、マンガ、アニメなどインドアなものが好きです。キーボード作れます。

Markdownで改ページのコントロールがしたい！

Markdown を PDF 化して納品しようとしたら改ページがぐっちゃぐちゃなので怒られた話。あるあ・・・すみませんでした。 Markdown でPDFの改ページ制御なんてできるの？きっとできるさ。変換は VSCode のプラグインである Markdown All in One というものを使っています。このツールはMarkdown → HTML → PDF の順に変換します。 HTML の印刷スタイル設定が PDF に効くので、CSSでスタイルを設定すればいいと思われます。改ページ用の CSS 属性改ページには page-break-after という属性があって、これを使います。 MDN: page-break-after おや？ MDN をよく見ると、この属性は break-after に置き換えられたとのことです。 MDN: break-after Markdown のどの要素に使う？本来この属性はdivやsectionなどのブロックに対して使うのですが、Markdownで書いているとブロックを意識することがあり

CSS で、はみ出したテキストを省略する

「ブロック内の文章を、3 行以上は表示させないようにして！」「切れたところには ... 入れといて！」あるある。 <div> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in

Buefy(Bulma) と github-markdown の共存

Markdownで記述したファイルをVueに取り込むことに成功しました。ですが、Buefyを基本としたサイトになっているので、Reset CSSが有効なためMarkdownで出力されたh1など、CSS クラスではなくタグでレイアウトを表現したいものが無効になっています。 h1タグで大きくタイトルとして扱ってほしいのに通常の文章と変わりない仕上がりになってしまいます。 github の Markdown スタイルを使うまずは使いたい CSS 定義を持ってきます。今回はsindresorhus/github-markdown-cssを利用させていただきます。 npmパッケージとして公開されているのでインストールします。 yarn add github-markdown-css インストールできたらnuxt.config.jsのcss項目に追加します。 Buefyのスタイルよりも優先させたいので、後に記述します。 // githubのスタイルはbuefyよりも後に指定する export default { css: ['~/asse

PowerShellではbashでいうwhichコマンドってないの？

JAVA_HOMEとか調べたいときあるじゃん？ PowerShell ならGet-Commandでした。 Java の格納先を調べる Get-Command java 結果 CommandType Name Version Source ----------- ---- ------- ------ Application java.exe 11.0.3.0 C:\Program Files\Amazon Corretto\jdk11.0.3_7\bin\java.exe できた。でもこっからPowerShellで環境変数をセットするのがとても面倒なのよね。。。 cmd.exe から環境変数の設定 cmd.exeでいいじゃん。 setx JAVA_HOME "C:\Program Files\

mdのアンカでもVueルータを利用する

Markdownで書いた記事をNuxtで表示させるところまではできました。問題になるのがリンクを表すアンカが、vue routerの仕組みに乗らないためにSPA動作にならないことです。 [記事へのリンク]() [外部リンク](https://www.google.com/) は <nuxt-link to="">記事へのリンク</nuxt-link> <a href="https://www.google.com" target="_blank">外部リンク</a> になって欲しいところ。実際には下記のようなアンカが生成されます。 <a href="">記事へのリンク</a&

コメントが投稿されたらslackに通知する

ブログのコメントはfirebaseに登録しています。 firestoreに登録されたタイミングで、slackのチャネルに投稿する処理を作りたいと思います。 firestore の登録トリガ firebase functionsでは、接続されているfirestoreの登録・更新・削除のイベントトリガで処理を実行することができます。ブログ記事にコメントが投稿されたらSlackに通知されるような関数を登録したいと思います。ライブラリに axios を追加 functionsで通信を行うので、使い慣れたaxiosを依存関係に追加します。 cd functions yarn add axios トリガの設定トリガのウォッチ方法については、firebaseの公式ドキュメントに詳しく書いてありました。 → Cloud Firestore トリガーブログのコメントは posts/postId/comments/commentIdという構造で保存しているので、このパスに書き込まれたらトリガされるようにします。 postIdは記事の ID、

タスクマネージャでメモリの動作クロックが半分に見える

なんか気になってたんだけど。タスクマネージャの速度のところ。 BIOSで見ると2666MHzになってるのに、タスクマネージャで見るとその半分。ベースクロックが1333MHzで、クロックの立ち上がり、立ち下がりで動作するので2666MHz相当。ネットで検索してみると、同様の症状がちらほら。。。 * タスクマネージャーのメモリ速度の表示が半分になっている件 * Windows 10でメモリの動作速度の表示がおかしい BIOSアップデートでなおる場合もあるらしい。実動作はちゃんと2666MHzだから、気にすんなってことらしい。まあ、気になるから調べたんだけど。

functions に json がアップできない罠

firebase functionsを利用するに当たり、サービスアカウント情報を環境変数ではなくjsonファイルで保持していました。環境変数でやれ、というのは重々承知の上でございます。 { "type": "service_account", "project_id": "nekoha-blog" } それを firebase の初期化関数の中で読み出すコード。 serviceAccount = require('./serviceAccountKey.json') ローカルではもちろん問題なく動くのですが、デプロイすると読めない事象が。拡張子が json だとだめ？拡張子が.jsonだとデプロイ対象にならないらしい。 .jsファイルは持っていってくれるので JSON ファイルを書き換え。 exports.default = { type: 'service_account', project_id: 'nekoha-blog'

グラボ買った。GIGABYTE GeForce RTX™ 2060 OC 6G

今まで msi のGT 710 1GD3H LPというしょぼいグラフィックカードを使っていました。ある日、妻のいないスキに遊びに来た秋葉原で、予算 3 万円程度でグラボを物色していると。 TSUKUMO の 5 台限定価格。RTX2060 が 29,999 円+税で 32,998 円です。安かったのでついつい買ってしまいました。 GTX1660 狙いだったのに、同じくらいの予算でハイグレードが買えてラッキー！ Gigabyte のGeForce RTX™ 2060 OC 6Gです！ GT710 では3D Markを走らせるだけでいっぱいいっぱいでしたが、フル HD で軽めのベンチだと 300fps を叩き出したりして。 FF ベンチでも「快適」判定です。ゴイスー！！ Steamでセールだったので思わず買ってしまったベヨネッタさんもヌルヌル動きます。GT710 はほぼ動かなかったのに。

nuxtでgoogle Analytics

Nuxt で Google Analytics の設定方法。 @nuxtjs/google-analyticsを使います。インストール yarn add @nuxtjs/google-analytics nuxt.config.js の設定ライブラリを modules に追加します。 Google Analytics に使う id を設定するだけです。 export default { modules: [ ['@nuxtjs/google-analytics', { id: 'UA-xxxxxxxxx-x' }] ] } 以上で Google Analytics が利用できるようになりました。