🤖

WordPressサイトにReactアプリをリリースした話

2022/04/20に公開約1,200字

背景

このたび、個人ブログのエンジニアLIFE(https://hinoshin-blog.com/)のサブディレクトリにReactアプリを実装しました。

サブディレクトリにサービスを置いて、万が一にもバズるとSEO的に莫大な効果が得られます。

なので、需要はあるのかなと思い本記事を執筆しました。

とは言っても、当たり前のことしかやってないので、多くの人は「そんなの知ってるよ。。」となるかもです。

そんな方は、僕が今回リリースしたプログラマー適性チェックを一度やってからブラウザバックしてくてください。

プログラマー適性チェック

https://hinoshin-blog.com/programmer-aptitude-check/

Reactアプリの概要

今回作ったアプリは、めちゃくちゃ簡単な機能しかないです。

機能自体は30分もあれば作れる内容です。

具体的には、プログラマーの適性を診断するアプリになります。

目的は被リンクを獲得することなので、最低限の機能しかないです。

「興味があるからやってみたい!」という方は、このリンクから飛べます。

プログラマー適性チェック

https://hinoshin-blog.com/programmer-aptitude-check/

実装方法

実装方法としては、めちゃくちゃ簡単です。

具体的な手順は次の通りです。

  1. create-react-appで雛形を作成
  2. 普通にアプリを作る
  3. buildする
  4. Buildフォルダの名前を使いたいURL名にする(今回の場合は、"programmer-aptitude-check")
  5. FTPを使ってpublic_html配下に置く
    以上

ハマりどころとしては、packge.jsonに以下の記述を追加しないとパスが通らないので注意。

"homepage": “./“

最低限のSEO対策

今回は"プログラマー適性チェック"のキーワードを狙いました。

その際に行った最低限のSEO対策は次の通りです。

  1. タイトル,h1,h2タグにキーワードを含める
  2. meta descriptionにキーワードを含める
  3. メタキーワードを設定する
  4. OGPを設定する

おわりに

ぜひ、みなさまのお力でこのアプリを広めていただきたいです。

一度診断して、それをSNSでシェアするだけでOKです。

というか、あなたも自分がどのくらいプログラマーとしての適性があるか知りたいですよね?

最短1分で終わりますので、お願いします。

というのは半分冗談ですので、興味のある方だけどうぞ。

プログラマー適性チェック

https://hinoshin-blog.com/programmer-aptitude-check/

おわり

Discussion

ログインするとコメントできます