WordPressサイトにReactアプリをリリースした話
背景
このたび、個人ブログのエンジニアLIFE(https://hinoshin-blog.com/)のサブディレクトリにReactアプリを実装しました。
サブディレクトリにサービスを置いて、万が一にもバズるとSEO的に莫大な効果が得られます。
なので、需要はあるのかなと思い本記事を執筆しました。
とは言っても、当たり前のことしかやってないので、多くの人は「そんなの知ってるよ。。」となるかもです。
そんな方は、僕が今回リリースしたプログラマー適性チェックを一度やってからブラウザバックしてくてください。
プログラマー適性チェック
Reactアプリの概要
今回作ったアプリは、めちゃくちゃ簡単な機能しかないです。
機能自体は30分もあれば作れる内容です。
具体的には、プログラマーの適性を診断するアプリになります。
目的は被リンクを獲得することなので、最低限の機能しかないです。
「興味があるからやってみたい！」という方は、このリンクから飛べます。
プログラマー適性チェック
実装方法
実装方法としては、めちゃくちゃ簡単です。
具体的な手順は次の通りです。
- create-react-appで雛形を作成
- 普通にアプリを作る
- buildする
- Buildフォルダの名前を使いたいURL名にする(今回の場合は、"programmer-aptitude-check")
- FTPを使ってpublic_html配下に置く
以上
ハマりどころとしては、packge.jsonに以下の記述を追加しないとパスが通らないので注意。
"homepage": “./“
最低限のSEO対策
今回は"プログラマー適性チェック"のキーワードを狙いました。
その際に行った最低限のSEO対策は次の通りです。
- タイトル,h1,h2タグにキーワードを含める
- meta descriptionにキーワードを含める
- メタキーワードを設定する
- OGPを設定する
おわりに
ぜひ、みなさまのお力でこのアプリを広めていただきたいです。
一度診断して、それをSNSでシェアするだけでOKです。
というか、あなたも自分がどのくらいプログラマーとしての適性があるか知りたいですよね？
最短1分で終わりますので、お願いします。
というのは半分冗談ですので、興味のある方だけどうぞ。
プログラマー適性チェック
最後に宣伝です。
0からエンジニアになるためのノウハウをブログで発信しています。
また、YouTubeでの動画解説も始めました。 YouTubeのvideoIDが不正です
インスタの発信も細々とやっています。
興味がある方は、ぜひリンクをクリックして確認してみてください！
おわり
Discussion