Takahiro Nakamori

(有)ナカモリデザイン https://www.nakamoridesign.jp 代…

Takahiro Nakamori

(有)ナカモリデザイン https://www.nakamoridesign.jp 代表。三重県伊勢市でウェブサイトやアプリの設計、デザイン、実装をしています。また、競プロや読書、文鳥さんたちと遊んだりしています。

個人サイトの背景を変えました

前回の記事で私の個人サイトの背景にアニメーションをつけていました。 その記事はこちらです。 一生懸命作ったのですが、CPU使用率が100%を超えるときがあったので、残念ながら作り変えることにしました。 で、作ったのがこちらです。 最初は何もない灰色のキャンパスなのですが、どんどん細い白線がランダムに引かれていって、いい感じになる。というアニメーションにしました。 最初は、アハ体験なのか？というくらいどこに線が引かれているのかわかりませんが、時間が経つにつれ見えてきます

Takahiro Na…

    • 今週の競プロ（2024/04/15 〜 21）

      今週の復習今週、復習したABCの問題は以下の9問です。 ABC325-C Sensors ABC328-D Take ABC ABC330-C Minimize Abs 2 ABC335-D Loong and Takahashi ABC340-C Divide and Divide ABC342-C Many Replacement ABC344-D String Bags ABC344-E Insert or Erase ABC349-C Airpor

      Takahiro Na…

      • 今週の競プロ（2024/04/08〜14）

        今週の復習今週、復習した問題は以下の7問です。 ABC338-E Chords ABC344-D String Bags ABC344-E Insert or Erase ABC345-C One Time Swap ABC346-D Gomamayo Sequence ABC346-E Paint ABC347-C Ideal Holidays ABC338-E Chords 問題はこちら / ACしたコードはこちら 下図のように、円環を点1, 2Nの

        Takahiro Na…

        • Next.jsで個人サイトをリニューアルする（その4：背景にアニメーションを）

          前回の続きです。 前回の記事はこちらです。 PCで私の個人サイトを閲覧した場合は、背景にp5.jsで作成したアニメーションを載せたいと思っています。 p5.jsとはProcessingというビジュアルアートを作成するためのプログラム言語をJavaScriptのライブラリにしたものです。 どのようなアニメーションにするかといろいろ考えていましたが、競技プログラミングをやっているので、せっかくなので競技プログラミングをモチーフにしたアニメーションを掲載します。 ということ

          Takahiro Na…

        個人サイトの背景を変えました

        Takahiro Nakamori

          【WordPressオリジナルテーマSparrow開発日記（3）】 - 埋め込み（OGPリンク）ブロックについて

          やりたいこと WordPressのブロックに埋め込みブロックがありますが、下図のように埋め込みがうまくいかないケースがあります。 URLを入力するとそのURLのページのOGP（Open Graph Protcol）を読み込んで、下図のようにリンクがいい感じに表示されるようにしたいです（下図は私のnoteのクリエーターページのURLで作成したものです）。 ということで、OGPリンクというブロックを自作します。 管理画面は少し簡素化した 投稿画面でOGPリンクブロッ

          Takahiro Na…

          【WordPressオリジナルテーマSparrow開発日記（3）】 - 埋め込み（OGPリンク）ブロックについて

          Takahiro Nakamori

          【WordPressオリジナルテーマSparrow開発日記（2）】 - SEOとGA4測定タグの埋め込み

          SEO対策どうしますか？ 今回作るWordPressのオリジナルテーマ Sparrow では、SEOはWordPressのプラグイン Yoast SEO を導入して、Yoast SEOのアドバイス通りに運用してみようと思います。 どうしてYoast SEO を使うのか？ 理由は以下の通りです。 いくつか有名なブログを調査した結果 Yoast SEO をインストールしているブログがあったため。 更新も頻繁で、バージョンアップへの対応も心配なさそう（上図参照）。

          Takahiro Na…

          【WordPressオリジナルテーマSparrow開発日記（2）】 - SEOとGA4測定タグの埋め込み

          Takahiro Nakamori

          【WordPressオリジナルテーマSparrow開発日記（1）】 - テーマの目的を決める

          WordPressのオリジナルテーマを作る目的 WordPressのテーマ開発は何度も仕事で作ったことがありますが、WordPressのフルサイト編集機能に対応したブロックテーマはまだ作ったことがありません。また、WordPressのバージョン6.2になったときに、外観のエディター機能のβ（ベータ）が外れたので、フルサイト編集機能に対応したブロックテーマも対応できないと仕事的によくないので、勉強します。 テーマの名前 WordPressのテーマを開発するときは、テー

          Takahiro Na…

          【WordPressオリジナルテーマSparrow開発日記（1）】 - テーマの目的を決める

          Takahiro Nakamori

          Next.jsで個人サイトをリニューアルする（その3：メタタグとGA4の設定）

          前回の続きです。前回の記事はこちらです。 以下の2つが未解決のままでした。 メタタグをきちんと設定する。 Google Analytics（GA4）やSearch Consoleを連携させる。 Search Cosnoleの設定はNext.jsは関係ないのでいいのだが、メタタグとかGA4は設定できないと良くないので、調べながら設定する。 Next.jsの使い方についてはChatGPTで質問したらいい感じに答えてくれたけど、メタタグとかGA4のことはうまいこと行きませ

          Takahiro Na…

          Next.jsで個人サイトをリニューアルする（その3：メタタグとGA4の設定）

          Takahiro Nakamori

          Next.jsで個人サイトをリニューアルする（その2：とりあえず公開）

          前回の続きです。前回の記事はこちらです。 Next.jsを使ってみると決めてから少しずつ勉強しながら、2ヶ月くらいかかりましたが、リニューアルした個人サイトを公開させることにしました。 この2ヶ月間で、Next.jsに関して身につけたことは、 DockerでNext.jsの開発環境を作る。 Next.jsのAppRouterで画面遷移させる。 Next.jsで非同期通信して新着情報を作る。 Next.jsで作成したサイトをレンタルサーバーで使えるように書き出す。

          Takahiro Na…

          Next.jsで個人サイトをリニューアルする（その2：とりあえず公開）

          Takahiro Nakamori

          今日の精進-DP（AtCoder ABC258-D）

          今日、解き直した問題は AtCoder ABC258-D「Trophy」です。何回挑戦してもなかなかスッとACできないので、ポイントを整理しておきます。 問題 ポイント ・1番目のステージ（A+B）を1回クリアして、残りX-1回は1番目のゲーム(B)でクリアする。 ・2番目までのステージを1回ずつクリアして、残りX-2回は1、2番目の中から小さい方でクリアする。 ・3番目までのステージを1回ずつクリアして、残りX-3回は1〜3番目の中から一番小さいものでクリアする。 　

          Takahiro Na…

          今日の精進-DP（AtCoder ABC258-D）

          Takahiro Nakamori

          今日の精進-DP（AtCoder ABC222-D）

          今日、解き直した問題は AtCoder ABC222-D「Between Two Arrays」です。DPはいつまでも苦手です。 問題 ポイント 適当な例（ $${N=3}$$ くらいで）を作って、実際に整数列 $${C}$$ を作ってみると、1個前の数字によりけりだなと思い、DPを検討する。 dp[ i ][ j ] を i 個目までみていて、i 個目が j の時に作れる整数列の数が入ると定義する。 という感じで、二次元のDPでいけそうなので、紙に表を書いてみる。

          Takahiro Na…

          今日の精進-DP（AtCoder ABC222-D）

          Takahiro Nakamori

          今日の精進-DFS（AtCoder ABC268-D）

          今日、解き直した問題は AtCoder ABC268-D「Unique Username」です。DFSも苦手です。 問題 ポイント $${1 \leq N \leq 8}$$ なので、 文字列 $${S}$$ の並び順のパターンは順列全探索で作れる。 文字列と文字列の間には「 _ 」が必ず1つは入るから順列全探索で作った $${S}$$ に「 _ 」を加えておく（最後の文字列は除く）。 追加することができる「 _ 」の数はあらかじめ数えておく。 あとは $${3

          Takahiro Na…

          今日の精進-DFS（AtCoder ABC268-D）

          Takahiro Nakamori

          今日の精進 - 桁DP （AtCoder EDPC-S, ABC336-E）

          AtCoder ABC336のE問題で桁DPの問題が出題されました。問題を読んで「桁DPだな」ということはわかったのですが、実装はできずACできませんでした。そこで、桁DPの復習しました。 まずは桁DPの基本的な問題（EDPC-S）を挑戦 ABC336-Eは私には難しかったので、より基本的な桁DPの問題を探したら、EDPC(Education DP Contest)のS問題が見つかったのでそれをACしてみます。 ポイント （あんまりよくないかもですが…）桁DPっぽいな

          Takahiro Na…

          今日の精進 - 桁DP （AtCoder EDPC-S, ABC336-E）

          Takahiro Nakamori

          今日の精進（AtCoder ABC336-D）

          今日は初見の問題 AtCoder ABC336-D「Pyramid」を解きました。 問題 ポイント $${1 \sim N}$$ までそれぞれをピラミッドの頂点とした場合に、左側に最大何段作ることができるのか、そして右側に最大何段作ることができるのかをあらかじめ計算しておく（左右から累積和するみたいな感じ）。 // 入力が以下のような場合だと54 5 6 1 3// i番目をピラミッドの頂点とした場合に、左側に最大何段つくれるか1 2 3 1 2// i番目をピラミッ

          Takahiro Na…

          今日の精進（AtCoder ABC336-D）

          Takahiro Nakamori

          今日の精進（AtCoder ABC319-E）

          今日の解き直した問題は AtCoder ABC319-E「Bus Stops」です。 問題 ポイント $${1 \leq P_i \leq 8}$$ が制約として保証しているので、$${1}$$ から $${8}$$ の最小公倍数である $${840}$$ を移動時間の周期として、あらかじめ計算できそう。 それでも移動時間の計算のところの計算量が $${100,000 * 840}$$ で $${80,000,000}$$ くらいになるが、実行時間制限が $${3}$

          Takahiro Na…

          今日の精進（AtCoder ABC319-E）

          Takahiro Nakamori

          Next.jsで個人サイトをリニューアルする（その１）

          1年が終わり、新しい1年が始まろうとすると個人サイトをリニューアルしたくなってきます。 大して更新もしておらず、アクセス数もほんのわずかですが、心機一転リニューアルしてくなってきます。 リニューアルしたら更新するようになるのではないか？と思います。 今回のリニューアルのポイントは Next.jsを使ってみる です。 Reactを使ってみたかったので、Next.jsを選択しました。 Next.jsは下記の書籍を買って勉強しました。 バージョンの違いはありますが、公式の

          Takahiro Na…

          Next.jsで個人サイトをリニューアルする（その１）

          Takahiro Nakamori