VSCodeのフォントでバッククオートが表示されない

VSCodeのフォントをいい感じにするため、RictyDiminishedを設定して気に入っていました。

webrandum.net

ところが、TypeScriptを書いていると、何やらバッククオートの表示がおかしくなっていることに気づきました。それほど多用しない表示であれば良いのですが、文字列の埋め込みなどで多用することもあり、どうしようかなと。

少しググってみたところ、こちらで同様の事象について改善方法が記載されていたので試してみることにしました。

qiita.com

手順

ということで以下、手順は以下の通りとなります。

1. fontforgeをインストールする。
2. 設定ファイルを作成する。
3. ttfファイルに実行する。

順番に実行します。まずはfontforgeのインストールです。

brew install fontforge

次に、実行する内容をscriptとして保存します。ここでは上記のQiitaの記事のコメント欄にある内容を利用しました。フォントファイルの修正内容を記載しているようです。フォントファイルは修正してそのまま上書きされます。

Open($1)
Select(0u0060)
SetGlyphClass("base")
Generate($1)

scriptファイルに実行権限を付加します。

$ chmod +x scripts

作成したscriptファイルを実行してフォントファイルの修正を行います。

$ cd ~/Library/Fonts
$ find . -name *.ttf | xargs -I {} fontforge -lang ff -script ~/script {}

これにてVSCodeの表示で`が普通に表示されるようになります。

Next.jsとFirebaseで質問箱のようなサービスを作るを読んだ

こんにちは。beaglesoftの真鍋です。

今年はお正月にこれを読んでいました。

zenn.dev

読もうと思った動機や目的

もともとReactとFirebaseでものを作ったことはあったのですが、Next.jsとFirebaseでは作ったことがありませんでした。そもそも、SSRなどをどこで行うのかなどちょっと疑問な点がいくつかありました。 そこで、この辺のことをクリアにするためにこの本をチョイスしました。

実際の感想

当初の目的は達成できました。Next.jsとFirebaseを利用するに当たりVercelを利用すればうまくいくことがわかりました。また、OGPについては全く知らなかったので、裏側のことを知ることができたのも収穫でした。

ただ、書籍の冒頭にも下記の通り記載があるとおりソースコードが公開されていません。そのため、何かファイルを編集するときに、ファイルのどこに記載するのかがわかりづらいことがありました。基本的には問題ないのですが、全体がわからないと動かないことから途中でやめてしまう人も多いのではないかと思いました。

利用するサービスとして、FirebaseやVercelがあるのですが、ざっくりとした説明はあります。ただ、ReactやFirebase、Node.jsについて細かな説明があるわけではないのでこれからReactを学ぼうという人にはちょっと難しいかもしれません。一通りReactについて知っている人が次のステップとして読むには最適だろうと思います。

その他

Zennで書籍を何冊か購入したのですが、とても良いサービスだと思いました。特に、MBP16インチで左にWebStormを開いて、右にZennの本を開くとちょうどいい感じに写経できます。この組み合わせは意外といい感じだなと思いました。

次はAmpifyでNext.jsを利用するとどんな感じかを試してみたいと思います。

今年読んだ技術書

こんにちは。ビーグルソフトの真鍋です。

早いものでもう一年が終わろうとしています。今年はコロナでいろいろと生活が変わった一年でした。せっかくなので、技術書を中心にどういったことをしてきたかを振り返ってみようと思います。

ざっくりと

今年は昨年に続きReactを中心にキャッチアップしました。仕事ではRailsやPython、Typescript、JavaScriptが中心で、個人的にはJavaScriptとTypeScriptから不足していると感じたものを適宜拾っていった感じです。

React

Reactについては入門した書籍があってそれは良かったのだけれども、最終的にはこの書籍が一番しっくりきた。

booth.pm

いちばーん最初はりあくとを読んでいたのですが、Reduxを使わずにアプリケーションを作るという点ではこちらの方が良いかなと思いました。

JavaScript/TypeScript

Reactを始めてからJavaScriptについての知識が過去のままになっていることがわかったのでJavaScriptとTypeScriptについてこちらを参考に入門し直しました。

JavaScript Primer 迷わないための入門書

プログラミングTypeScript ―スケールするJavaScriptアプリケーション開発

リファレンス的にまだ読んでいるのですが、来年の最初にもう一度読み直そうと思っています。

HTML5 CSS3

Reactがちょっとかけるようになってきたときに不足しているなと感じたのがCSSに関する知識でした。Bootstrapを使えばいい的な感じでこれまでしのいできたのが、それではやりたいことができないと気づいたのでCSSに入門することにしました。

すると、HTMLも理解度が低いことがわかり、知らないキーワードが出てくるたびにこちらを参照するようにしています。

【特典付き】HTML5&CSS3デザイン 現場の新標準ガイド【第2版】 (Compass Booksシリーズ)

Firebase

いろいろと思うところあってFiresotreを利用しています。Firestoreは公式のガイドでもわかりやすいのですが、全体のデザイン的なものや勘所を知るためにはこちらがとても良かったです。

データストアとしての設計（ドキュメントの分け方など）やセキュリティーグループなどはこちらがとても参考になりました。

実践Firestore (技術の泉シリーズ（NextPublishing）)

shiodaifukuさんの書籍やブログは参考になることが多いのでできるだけ読んでいます。

booth.pm

shiodaifuku.booth.pm

Nuxt.jsなのでReact(Next.js)と関係ない気がしますが、Firestoreを利用するときにどういうことを考慮したのかなどがわかるので参考になります。

Elasticsearch

Firestoreがちょっと使えるようになってきたところで、検索をどうするかという問題に直面しました。

未だに正解がわかっていないのですが、データストアで検索するのはちょっとおかしいということを耳にしたこともありElasitcSearchについて調べてみました。

Elastic Stack実践ガイド[Elasticsearch/Kibana編] impress top gearシリーズ

FirebaseつながりでGCPについて理解を深めたいなと思い購入したのがこちらです。

プログラマのためのGoogle Cloud Platform入門 サービスの全体像からクラウドネイティブアプリケーション構築まで

ざっと目を通したのですが、知らない知識もあり良さそうでした。まだ活用するために読み込んではいません。

Node.js

Reactでアプリケーションを構築したりFiresotreを利用したりしていると、Node.jsってよくわかっていないなぁという感じになってきました。サーバーサイドのことは必要ない状態でしたが、それでもちょっとしたスクリプトを書くためにPythonに切り替えたりするのもなと思っていました。

そこでNode.jsに入門したのですが、そのときはたまたま見つけたこの書籍が良かったです。

レベルアップNode.js (技術の泉シリーズ（NextPublishing）)

レベルアップNode.jsでStreamについてはこの書籍がいいと書いてあったので読んでいるのがこちらになります。

Node.jsデザインパターン 第2版

まだ読んでいる途中ですが、Node.jsでアプリケーションを実際に作るときのパターンをサンプルプログラムを実装しながら説明しているのでわかりやすいです。

Canvas API

［ゲーム＆モダンJavaScript文法で2倍楽しい］グラフィックスプログラミング入門——リアルタイムに動く画面を描く。プログラマー直伝の基本 WEB+DB PRESS plus

以前から興味があったHTMLのCanvasAPIでの2Dグラフィックスについて少しだけ時間をとって概要をつかみました。2Dグラフィックスについてはゲームに関する書籍が一番わかりやすくて楽しいと思います。

その他

そのほかにも読んでいる本がありました。

リファクタリング 既存のコードを安全に改善する（第2版）

リファクタリングはいつ読んでも気づきがあっていい。新しいバージョンがJavaScriptで書かれているのもあってちょくちょく読んでいます。

そういえば、Zennで購入した書籍もいくつかありました。

zenn.dev

Next.jsを普段使いということで興味があり購入しました。Next.jsはすでにある環境ではいじったことはあるけれども、自分でゼロからアプリケーションを作ったことがなかったので参考になりました。

zenn.dev

Origin 解体新書 v1.5.2はとてもお世話になりました。CORSについてちょうど仕事で活用するタイミングということもあり、背景から具体的な挙動について説明されていて理解がとてもすすみました。それほどボリュームがある訳ではないので、CORSについて不安な方は読んでみると良いかもしれません。

zenn.dev

MacからWindowsに移住しようと思っていたときに、WSLについて調べるため購入しました。この本の良かったところは、WSLだとなんか遅くなるよなと思っていたことがなぜなのか、そしてどうすればいいのか説明しているところでした。

そうなんです。WSLを利用するとJetBrains製品でも普通に動かせるけどもっさりする。この辺がよくわからないまま行ったり来たりしていたのでとても助かりました。

まとめ

年初のもくろみ通りJavaScriptとTypeScriptを中心に1年を過ごしました。来年はJavaScriptとTypeScriptのもう少し深いところの理解を進めたいなと思います。