Posts

Angularを業務で使用することがあり、かつバージョンが12指定とのことだった。 ちなみに現在のAngularのバージョンは13なので、普通にインストールすると13がインストールされる。 そこで12を指定し、インストールする方法を調べてみた。 Angular12をインストールする バージョン指定でインストールする方法は別段他の言語と変わりなく、ただただ末尾に指定バージョンを記載するだけでOK。 $ npm install -g @angular/cli@12.0.0 つまりこんな感じすれば12がインストールされる。 バージョンを確認する きっと問題ないけど、念のためにバージョンを確認する。 $ ng v _ _ ____ _ ___ / \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _| / △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | | / ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | | /_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___| |___/ Angular CLI: 12....

エックスサーバーは非常に便利で50個のサブドメインを作成することができる。 これは私みたいに飽き性でいろいろなものを作っては放置するタイプには非常に重宝する機能である。 エックスサーバーが気になるのであれば下記リンクをどうぞ。 [sc name=“exserver_all_unlimited” ][/sc] さてそしてまた、この機能を使用する機会がきた。 今回はエックスサーバーのサブドメインをGoogle Hostingに適用するというケースを行ったので、備忘録としてここに書いておく。 サブドメインの取得の仕方は省力する。 が、反映になかなか時間がかかるのが、エックスサーバーの玉に瑕。 firebase Consoleに行く Firebase console 作成したドメインを入力する まずはfirebase ConsoleのHostingに移動し、カスタムドメインを追加ボタンをクリックする。 するとドメイン名の入力を求められるので、エックスサーバーで作成したサブドメインを記入する。 ※「angular.nove-web.com を既存のウェブサイトにリダイレクトする」をチェック。 リダイレクト先にはエックスサーバーで作成したサブドメインを記入する。 次へをクリック。 所有権の確認 エックスサーバーのDNSレコード設定に進み、対象ドメインを選択する。 次に「DNSレコード追加」タブに移動する。 記入欄が現れるので、下記のように記入していく。 ホスト名：作成したドメイン 種別：TXTを選択 内容：Firebaseコンソール画面でコピーしたTXTレコードの値 追加が完了したら、firebase Consoleに戻り、所有権を証明ボタンをクリックする。 ここで失敗した。 ドメイン ********.com の所有権を証明できませんでした。設定をお確かめいただき、もう一度お試しください。 とのエラーが表示された。 解決方法がわからずに、途方に暮れていたので、初心に戻りGoogle Workspace 管理者ヘルプに行くと、 最初に試すことに48 時間待機すると書かれていたので、待機することにした。 ちなみに下記サイトでDNSレコードがしっかり適用されているか確認することができる。 Google Admin Toolbox Dig 全然うまくいかずに、色々DNSレコードをいじっていたら、途端に通った。 何をしたか、わからない。 実行（ドメインとの紐づけ） 何をしたかはわかないが、うまくいったようで、セットアップ画面が表示された。 またレコードを追加する必要がある。 下記のように追加すれば問題ない。 ホスト名：作成したドメイン 種別：Firebaseコンソール画面で表示されたレコードタイプ（私の場合はA） 内容：Firebaseコンソール画面でコピーしたTXTレコードの値 追加が完了した後に、終了ボタンをクリックする。 この時点でカスタムドメインの追加はうまくいったが、ステータスが設定が必要ですと表示されている。 最後に 設定を完了するために、最後にもうひとつ。 サブドメインの場合は、すでにあるDNSレコードと干渉する場合がある。 本サイトでは「*.nove-web.com」のようなレコードが既に存在していた。 これは見ての通り、すべてのサブドメインを対象にしているので、削除する必要がある。 ただ、本サイトのように新規で追加する以外にサブドメインを使っている場合は、そのサブドメインのレコードを新規に作成する必要がある。 後は接続が完了するまで待つ、ひたすら待ちましょう。 公開ができればそのサイトにアクセスができる。 今回追加したのは下記サイト。 https://angular.nove-web.com/home コスパ最強のWeb アプリ 今回はfirebase hosting で公開したのはAngularを勉強のために立ち上げたブログサイト。...

Good Bye 紙の本、そして紙の本しか出さない作家さん 読書は専らKindle Paperwhiteで読む。 「ひと昔前は本は紙でしょう、電子書籍？　いやいや風情も雰囲気もない。」 なんて思っていたが、Kindle Paperwhiteを買ったらもう、紙に戻れなくなった。 リンク 結果的に電子書籍を出していない作家は、私の中で読む術を失った。 なにを思って電子書籍版を出さないのかわからないが、出さないことで少なくとも私のような人種からのリーチを失っていると作家には知ってほしいし、読みたいので電子書籍版を出して欲しい。 とは言え、ただただ、電子書籍版を出せばいいというわけでもない。 Kindle Paperwhiteで読みたいのである。 で、やっとタイトルに繋がるのと同時に少し脱線する。 エンジニアのバイブル リーダーブルコード リーダブルコードという本を知っているだろうか。 リンク エンジニアであれば一度は聞いたことがあるかもしれない。 それはそうで、なにせエンジニアのバイブルと言われているくらいである。 美しいコードを見ると感動する。優れたコードは見た瞬間に何をしているかが伝わってくる。そういうコードは使うのが楽しいし、自分のコードもそうあるべきだと思わせてくれる。本書の目的は、君のコードを良くすることだ」 初版は2012年6月23日でもう10年前の発行である。 であるのだが、今でも根強い人気を誇っている。 私もずっと読もうと思っていたが、なんとなく先延ばしにしてきた。 そこで、このゴールデンウイークに重い腰を上げて読んで見ようと思い立った。 kindle版がない……? がしかし、リーダブルコードは電子書籍版が存在するのが、kindle版が存在しないという稀有な例。 そこでリーダブルコードをKindle Paperwhiteで読む方法を調べてみた。 エンジニア味方 オライリーの本をKindle Paperwhiteで読む 公式オンラインショップで検索 まずはオライリー公式ホームページでリーダブルコードを検索する。 O’Reilly Japan - リーダブルコード 公式オンラインショップで購入 次に、Ebook Storeで電子版を購入:価格2,112円をカートに入れ購入手続きに進む。 その後、購入に際してPayPalのアカウントが必要になるので手順に従いアカウント登録をする必要がある。 こういうのが面倒でkindleストアで一元管理しているのに…… 登録購入ができると、オライリーの本棚に購入した本（今回であればリーダブルコード）が表示される。 O’Reilly Japan Ebook Store - 購入済みの商品 インストール＆kindleにインポート 購入した本が表示されていることを確認できたら、ePubをインストールする。 で、調べた情報によると、ePub版はkindleで対応できないとのこと。 kindleで対応しているのはmobiファイルということで、ePubをmobiに変換する必要がある。 今回はオンラインツールを使用し、mobiファイルに変更をした。 できないようであればPDFファイルでも問題ないので、購入した本のPDF版をインストールする。 やっとKindle Paperwhiteの出番である。 まずはパソコンとKindle Paperwhiteを接続する。 接続が完了するとkindleのフォルダが表示されると思うので、D:\documentsにインストールしたmobiファイル or PDFファイルを置く。 その際、mobiファイルは書籍情報が含まれているので、自動でタイトル補完をしてくれるがPDF版の場合は、ファイル名をタイトルにしたほうがわかりやすい。 これでKindle Paperwhiteで読書する準備が完了した。 実読 さて、実読。...

特定の倍数に数値をまとめたい。 なにをいっているのだろうと思われたかもしれないので、実例をどうぞ。 実例 ユーザーが数値を入れるインプットエリアがあるとする。 ユーザーは任意の数字を入れることができる。 その結果を10の倍数にまとめたい。 つまり、24とユーザーが記入した場合は「20」が期待値になる。 ということがやりたい。 実装方法 じゃ、どうするのか。 まずは実装済みのものをどうぞ↓（うまくコンパイルできない時があるので、下の更新ボタンをクリックしてください） inputエリアに数字を入れていくと、5で10、14で10、15で20になっていることが確認できる。 つまり24と入力すれば「20」が表示される、期待値通り。 特定の倍数に数値をまとめるコード const changeNumber = () => { const unit = 10; const el = Math.round(num.value); result.value = Math.round(el / unit) * unit; }; inputエリアのvalueが更新された時、 まずはvalueを丸める。 つまり、2は0、5は10になる。 その値を最初に定義した値（丸めたい倍数）で計算する。 実際に24が入力された時、 24を丸めて20にする。 その値を10で割って10でかける。 20 / 10 * 10 = 20 結果20になる。 なんかこうやってみるともっと簡単な方法がある？ まあ、期待値は取り出せたので、良しとする。 理系の人、ぜひ教えてください。

本記事はリード文をカスタムフィールドで書いている。 が、カスタムフィールドないでいくら改行しても改行が記事に反映されないので、調査、修正してみた。 まず、そもそものコードは <?php $item_lead = get_post_meta($post->ID, 'item_lead', true); echo $item_lead; ?> という形で吐き出していた。 が、これだとcssは当たるが、改行が反映されない。 どうやらこれは調べてみると仕様っぽい。 コードによる解決方法が見つからなかったので、すこし無理やりだが、改行を判定し、pタグで囲むようにした。 実際のコードは、 $values = explode("\n", get_post_meta($post->ID, 'item_lead', true)); foreach ($values as $value) { echo "<p>" . $value . "</p>\n"; } ?> という形に修正した。 やっとこととしては、まずexplode()で取得した文字列を改行コードで分割する。 分割した値を回し、pタグで囲っていく。 ただそれだけ。 少し無理やりかもしれないが、改行が反映されるようになった。