個人ブログの開発を通して、実際にSEO対策を行いながら収益化できるサービスを学ぶ。 ## MVP1 開発者はmicroCMSで記事投稿することができる 完成系イメージ:https://seo-template-d8f5d.web.app/ ### TODO - [x] microCMSのアカウントを作成する - 参考:https://blog.microcms.io/nextjs13-microcms-rsc/ - [x] microCMSの環境構築・API作成 - [x] 記事API - [x] タグAPI - [x] カテゴリAPI - [x] microCMSで作成した各APIにデータを投入する - [x] 記事を1件投稿する - [x] タグを2つ以上作成する - [x] カテゴリを1つ作成する ## MVP2 開発者はNext.js×microCMSの環境を構築できる ### TODO - [x] Next.jsの環境を用意する - [x] Next.jsでmicroCMSを導入する - [x] microCMSからデータを取得する - [x] 記事データ - [x] タグデータ - [x] カテゴリデータ - [x] microCMSで取得した記事データを表示する ## MVP3 ユーザーはブログの各ページを見ることができる ### TODO - [x] 記事一覧ページを見ることができる - [x] 記事詳細ページを見ることができる - [x] カテゴリごとの記事一覧ページを見ることができる - [x] タグごとの記事一覧ページを見ることができる - [x] 運営者情報ページを見ることができる - [x] ヘッダーを見ることができる - [x] ヘッダーロゴを作成する - [x] ヘッダーメニューを作成する - [x] フッターを見ることができる - [x] フッターロゴを作成する - [x] マルシー表示 **フリーキーワード検索機能は実装なしでお願いします。代わりに以下の実装をお願いします。** - [x] サイドバーメニューにカテゴリ一覧を見ることができる - [x] カテゴリを押下するとカテゴリに紐付き記事一覧を見ることができる - [x] サイドバーメニューにタグ一覧を見ることができる - [x] タグを押下するとタグに紐付き記事一覧を見ることができる ## MVP4 ユーザーはSEO対策されたブログを見ることができる ### TODO - [x] SEO対策の開発 - [x] メタタグ・OGP - 参考:https://qiita.com/kitao6/items/02989a72b9ecd37785e8 - [x] パンくずリスト - [x] 構造化データ - デプロイ後にこちらでチェックできます(https://search.google.com/test/rich-results?hl=ja) - [x] サイトマップ自動生成 - sitemap.xmlが自動生成される状態 - [x] ファビコン - 参考:https://emma.tools/magazine/seo/web-site/what-favicon-is/ - [x] robot.txt - 参考:https://seolaboratory.jp/41315/ - [x] フッターにSNS導線作成 - X、Instagram、Facebookを作成してください - [x] レスポンシブ対応 - [x] SSG対応する ## MVP5 開発者はブログをCI/CDを通して公開することができる ### TODO - [x] CI/CDを通してFirebaseにデプロイする - [x] 独自ドメインを取得 - [x] 独自ドメインでサイト公開 ## MVP6 開発者はブログにSEOツールを導入し、収益化することができる - [x] GTMの取得 - 参考 - https://unique1.co.jp/column/analytics/3536/ - https://nextjs.org/docs/app/building-your-application/optimizing/third-party-libraries - https://support.google.com/tagmanager/answer/9442095?hl=ja - https://support.google.com/tagmanager/answer/13034206?sjid=7806968817081528782-AP - [x] Google Analyticsの導入 - [x] Search Consoleの導入 - 参考:https://www.xserver.ne.jp/bizhp/google-search-console/ - [x] PageSpeed Insightsでパフォーマンス・SEOの観点を80点以上にする(既に80点以上の場合はスルーで大丈夫です) - https://pagespeed.web.dev/ - [ ] Google Adsenseの導入 - [ ] お問い合わせフォームページの作成 - [ ] プライバシーポリシーページの作成 - [ ] Google Adsenseの申請 - [ ] Google Adsenseの申請が通過する
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up