Merge pull request otoyo#103 from otoyo/update-readme

Update readme

README.ja.md

@@ -17,7 +17,7 @@ astro-notion-blog を使えば [Notion](https://www.notion.so) で書けるブ
 
 ## スクリーンショット
 
-<img src="https://user-images.githubusercontent.com/1063435/216562042-818bc312-1941-4b5d-b281-15e0bcb6f153.png" width="480">
+<img src="https://user-images.githubusercontent.com/1063435/223610351-58d157cc-fe50-4ff3-be0c-5373bec07589.png" width="600">
 
 ## デモ
 
@@ -35,33 +35,37 @@ astro-notion-blog を使えば [Notion](https://www.notion.so) で書けるブ
 1. このリポジトリを**スターします** :wink:
    - スターしていただけると開発の励みになります
 2. [ブログテンプレート](https://otoyo.notion.site/e2c5fa2e8660452988d6137ba57fd974?v=abe305cd8b3d467285e91a2a85f4d8de) を自分の Notion へ複製します
-3. 複製したページ(データベース)の URL `https://notion.so/your-account/<ここ>?v=xxxx` を `DATABASE_ID` としてメモします
+3. 複製したページ(データベース)のアイコン、タイトル、説明を変更します
+
+<img src="https://user-images.githubusercontent.com/1063435/223611473-09e87aba-ad3b-4380-a74f-58c3c5804c39.png" width="600">
+
+4. 複製したページ(データベース)の URL `https://notion.so/your-account/<ここ>?v=xxxx` を `DATABASE_ID` としてメモします
 
 <img src="https://user-images.githubusercontent.com/1063435/213966685-3a2afed2-45c0-4ea5-8070-e634d8d648de.png" width="260">
 
 <img src="https://user-images.githubusercontent.com/1063435/213966934-4442ce75-f88e-465f-b4f4-545d46b8eec9.png" width="600">
 
-4. [Create an integration](https://developers.notion.com/docs/create-a-notion-integration#step-1-create-an-integration) からインテグレーションを作成し "Internal Integration Token" を `NOTION_API_SECRET` としてメモします
-5. 複製したページを再度開き [Share a database with your integration](https://developers.notion.com/docs/create-a-notion-integration#step-2-share-a-database-with-your-integration) の手順でインテグレーションにデータベースを共有します
-6. このリポジトリを自分のアカウントヘフォークします
+5. [Create an integration](https://developers.notion.com/docs/create-a-notion-integration#step-1-create-an-integration) からインテグレーションを作成し "Internal Integration Token" を `NOTION_API_SECRET` としてメモします
+6. 複製したページを再度開き [Share a database with your integration](https://developers.notion.com/docs/create-a-notion-integration#step-2-share-a-database-with-your-integration) の手順でインテグレーションにデータベースを共有します
+7. このリポジトリを自分のアカウントヘフォークします
    - フォークボタンは画面上部右側のスターの左にあります
-7. [Cloudflare Pages](https://pages.cloudflare.com/) を開きサインインします
+8. [Cloudflare Pages](https://pages.cloudflare.com/) を開きサインインします
    - 言語設定を日本語に変更します
 
 <img src="https://user-images.githubusercontent.com/1063435/213967607-338b8728-d7c9-47e4-8192-e955e3f4ce30.png" width="220">
 
-8. プロジェクトを "Connect to Git" を選んで作成し、先ほどフォークした `<your-account>/astro-notion-blog` リポジトリを選んで "Begin setup" をクリックします
-9. 「ビルドの設定」で、
-   1. 「フレームワーク プリセット」で Astro を選択します
-   2. 「環境変数(アドバンスド)」 を開き `NODE_VERSION`, `NOTION_API_SECRET`, `DATABASE_ID` の 3 つを設定します
-      - `NODE_VERSION` は `v16.13.0` かそれ以上を指定します
-      - 詳しくは [How to deploy a site with Git](https://docs.astro.build/en/guides/deploy/cloudflare/#how-to-deploy-a-site-with-git) をご覧ください
+9. プロジェクトを "Connect to Git" を選んで作成し、先ほどフォークした `<your-account>/astro-notion-blog` リポジトリを選んで "Begin setup" をクリックします
+10. 「ビルドの設定」で、
+11. 「フレームワーク プリセット」で Astro を選択します
+12. 「環境変数(アドバンスド)」 を開き `NODE_VERSION`, `NOTION_API_SECRET`, `DATABASE_ID` の 3 つを設定します
+    - `NODE_VERSION` は `v16.13.0` かそれ以上を指定します
+    - 詳しくは [How to deploy a site with Git](https://docs.astro.build/en/guides/deploy/cloudflare/#how-to-deploy-a-site-with-git) をご覧ください
 
 <img src="https://user-images.githubusercontent.com/1063435/213967111-72ea2ad1-ad3b-4629-8b65-7b25bc6ddb31.png" width="400">
 
 <img src="https://user-images.githubusercontent.com/1063435/213967331-a1de0810-a8b4-4fae-adba-110f3f4400cc.png" width="600">
 
-10. "Save and Deploy" をクリックし、デプロイが完了すると Notion Blog が見えるようになります
+11. "Save and Deploy" をクリックし、デプロイが完了すると Notion Blog が見えるようになります
 
 astro-notion-blog では新しい記事や変更を公開したいとき毎回デプロイが必要になります。  
 Cloudflare Pages のダッシュボードから手動でデプロイするか、GitHub Action のような CI を使って定時デプロイしてください。

README.md

@@ -17,7 +17,7 @@ The blog is generated statically by [Astro](https://astro.build/) so very fast.
 
 ## Screenshots
 
-<img src="https://user-images.githubusercontent.com/1063435/216562042-818bc312-1941-4b5d-b281-15e0bcb6f153.png" width="480">
+<img src="https://user-images.githubusercontent.com/1063435/223610351-58d157cc-fe50-4ff3-be0c-5373bec07589.png" width="600">
 
 ## Demo
 
@@ -36,29 +36,33 @@ The blog is generated statically by [Astro](https://astro.build/) so very fast.
 1. **Star this repo** :wink:
    - It makes me motivative!
 2. Duplicate [the blog template](https://otoyo.notion.site/e2c5fa2e8660452988d6137ba57fd974?v=abe305cd8b3d467285e91a2a85f4d8de) into your Notion.
-3. Note the part of the page (database) URL `https://notion.so/your-account/<HERE>?v=xxxx` as `DATABASE_ID`
+3. Change the icon, the title, the description in the duplicated page(database)
+
+<img src="https://user-images.githubusercontent.com/1063435/223611374-86d7172c-9cda-477b-b8a3-dc724fa7ccf4.png" width="600">
+
+4. Note the part of the duplicated page (database) URL `https://notion.so/your-account/<HERE>?v=xxxx` as `DATABASE_ID`
 
 <img src="https://user-images.githubusercontent.com/1063435/213966685-3a2afed2-45c0-4ea5-8070-e634d8d648de.png" width="260">
 
 <img src="https://user-images.githubusercontent.com/1063435/213966888-c3f1f741-62ac-42f3-9af2-94ab375b5676.png" width="600">
 
-4. [Create an integration](https://developers.notion.com/docs/create-a-notion-integration#step-1-create-an-integration) and note "Internal Integration Token" as `NOTION_API_SECRET`
-5. [Share a database with your integration](https://developers.notion.com/docs/create-a-notion-integration#step-2-share-a-database-with-your-integration) at the Notion database page
-6. Fork this repository into your account
+5. [Create an integration](https://developers.notion.com/docs/create-a-notion-integration#step-1-create-an-integration) and note "Internal Integration Token" as `NOTION_API_SECRET`
+6. [Share a database with your integration](https://developers.notion.com/docs/create-a-notion-integration#step-2-share-a-database-with-your-integration) at the Notion database page
+7. Fork this repository into your account
    - The Fork button is at the top of the page and the left of the Star
-7. Go to [Cloudflare Pages](https://pages.cloudflare.com/) and sign in
-8. Create new project with "Connect to Git" with your forked repository `<your-account>/astro-notion-blog`, then click "Begin setup"
-9. In "Build settings" section,
-   1. Select "Astro" as "Framework preset"
-   2. Open "Environment Variables (advanced)" and set `NODE_VERSION`, `NOTION_API_SECRET` and `DATABASE_ID`
-      - `NODE_VERSION` is `v16.13.0` or higher
-      - [How to deploy a site with Git](https://docs.astro.build/en/guides/deploy/cloudflare/#how-to-deploy-a-site-with-git) is helpful
+8. Go to [Cloudflare Pages](https://pages.cloudflare.com/) and sign in
+9. Create new project with "Connect to Git" with your forked repository `<your-account>/astro-notion-blog`, then click "Begin setup"
+10. In "Build settings" section,
+11. Select "Astro" as "Framework preset"
+12. Open "Environment Variables (advanced)" and set `NODE_VERSION`, `NOTION_API_SECRET` and `DATABASE_ID`
+    - `NODE_VERSION` is `v16.13.0` or higher
+    - [How to deploy a site with Git](https://docs.astro.build/en/guides/deploy/cloudflare/#how-to-deploy-a-site-with-git) is helpful
 
 <img src="https://user-images.githubusercontent.com/1063435/213967061-06f488fe-0b42-40a5-8f19-ac441f0168ff.png" width="400">
 
 <img src="https://user-images.githubusercontent.com/1063435/213967200-6d497b44-f26f-4ad7-8cf9-1780cf5cd2e0.png" width="600">
 
-10. Click the "Save and Deploy" button, then your Notion Blog will be published after deploy
+11. Click the "Save and Deploy" button, then your Notion Blog will be published after deploy
 
 Note that astro-notion-blog requires a deploy every time if you publish a new post or updates.  
 Deploy manually from the Cloudflare Pages dashboard or use a scheduled deploy using CI like GitHub Actions.