{"id":26501889,"url":"https://github.com/nowscott/IndWebIndex","last_synced_at":"2025-03-20T17:03:41.578Z","repository":{"id":178356562,"uuid":"661702402","full_name":"nowscott/IndWebIndex","owner":"nowscott","description":"使用nextjs+notionAPI+tailwindcss实现的简单部署的个人索引网站(A simple personal index website deployed using Nextjs + Notion API)","archived":false,"fork":false,"pushed_at":"2025-01-30T15:29:37.000Z","size":10512,"stargazers_count":33,"open_issues_count":1,"forks_count":12,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-30T16:22:27.221Z","etag":null,"topics":["nextjs","notionapi","person-homepage","personal-webpage","personal-website","static-website","yellowpages"],"latest_commit_sha":null,"homepage":"https://nowscott.top/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nowscott.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-07-03T13:05:44.000Z","updated_at":"2025-01-30T15:29:29.000Z","dependencies_parsed_at":null,"dependency_job_id":"9ed11b19-44e8-4e79-b086-425e77ea60ac","html_url":"https://github.com/nowscott/IndWebIndex","commit_stats":null,"previous_names":["nowscott/webdatabase"],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nowscott%2FIndWebIndex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nowscott%2FIndWebIndex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nowscott%2FIndWebIndex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nowscott%2FIndWebIndex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nowscott","download_url":"https://codeload.github.com/nowscott/IndWebIndex/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244656704,"owners_count":20488638,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nextjs","notionapi","person-homepage","personal-webpage","personal-website","static-website","yellowpages"],"created_at":"2025-03-20T17:01:58.684Z","updated_at":"2025-03-20T17:03:41.573Z","avatar_url":"https://github.com/nowscott.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Individual Web Index（网页索引）\r\n\r\n[![GitHub stars][stars-image]][stars-url]\r\n[![GitHub forks][forks-image]][forks-url]\r\n[![license GPL-3.0][license-image]][license-url]\r\n[![commit-count-permonth][commit-image]][commit-url]\r\n[![contributors-count][contributors-image]][contributors-url]\r\n\r\n![网站截图](public/assets/网站图片.png)\r\n\r\n\r\n## 1.如何部署\r\n\r\n在2024年5月21日的更新之后，部署这个项目变得更加简单。您只需要复制这个[Notion页面][notion-url]作为您自己的数据库，根据需要添加网站数据，然后fork这个仓库。\r\n\r\n接下来，进入Vercel部署，添加两个环境变量NOTION_TOKEN和DATABASE_ID。这些分别是从[我的集成][access-url]网站获得的密钥，以及您的Notion数据库的ID，当然也不要忘记给你的数据库连接集成。\r\n\r\n这样就完成了部署，可以尽情在notion数据库中添加你自己需要的网页。\r\n\r\n## 2.创建的目的\r\n\r\n很久以前，互联网初期有一个叫做黄页的网站，上面索引了许多其他网站。随着时间的推移，它逐渐演变成了搜索引擎。\r\n\r\n然而，在搜索引擎中，当涉及到寻找特定网站时，结果往往缺乏准确性。因此，我仍然认为每个人都需要自己的黄页。\r\n\r\n这个个人黄页将包含一系列经常使用的网站，以及添加标签和简短描述的功能，方便搜索和浏览。\r\n\r\n最终，我决定将这个个人黄页命名为“个人网站索引”。\r\n\r\n## 3.网站迭代\r\n\r\n从我有这个想法到现在，这个网站经历了多次迭代，URL也变化了几次。当前并且是最终的网站是[nowscott.top](https://nowscott.top)。\r\n\r\n起初，数据文件是直接手动输入的，每次想要更新数据内容，我都必须访问开发者接口，对数据文件进行更改，然后上传到GitHub。这让我感到非常不友好。\r\n\r\n因此，在最新版本中，我利用Notion API将数据存储在Notion的数据库中。具体的实现细节将在下一部分解释。\r\n\r\n## 4.如何使用Notion API\r\n（从Notion获取数据的代码未包含在此项目中。）\r\n\r\n这个想法起源于Bilibili上一个上传者的视频，下面提供链接：\r\n\r\n[【S1E3】用Notion当数据库写一个简单的API](https://www.bilibili.com/video/BV1gF411E7pV/?share_source=copy_web\u0026vd_source=98c7014c35363c157a4fba4929dbda77)\r\n\r\n在这个视频中，我学习到了如何使用Notion API从Notion获取数据并在网页上显示。如果你有任何问题，可以观看视频了解更多信息。\r\n\r\n总而言之，我利用一个叫Netlify的网站部署了一个服务。这个服务每次有人访问我部署的域名时都会运行，它从Notion获取数据并返回给前端。一旦前端接收到数据，就可以在网页上显示。\r\n\r\n听起来很棒，对吧？然而，这个简单的过程最多需要7到8秒的时间，这与快速加载个人网站的愿景不符。因此，我在这方面做了进一步的改进。\r\n\r\n## 5.一些优化\r\n\r\n我无法改变Notion API的访问速度，但我可以改变获取数据的方式。如果我们想要更方便地进行修改，我们可以在一个便利的位置存储一份数据副本。在访问网站时，我们可以获取这个存储的数据，有效地解决了访问速度慢的问题。\r\n\r\n当数据被修改时，上述便利的数据副本不会立即更新，因为它不能与Notion直接通信。为了解决这个问题，我利用GitHub Actions定期更新存储的数据。这确保了数据保持最新。\r\n\r\n## 6.最后的说明\r\n\r\n总之，这个项目是一个基于网络的个人网站索引，它解决了访问速度慢的问题，并确保了数据及时更新。这些优化使修改变得更加容易，并提供了更高效、无缝的用户体验。感谢您对这个项目的兴趣。\r\n\r\n如果您对这个项目有任何问题或询问，可以通过电子邮件联系我：[nowscott@qq.com](mailto:nowscott@qq.com)\r\n\r\n[![Star History Chart][stars-history-image]][stars-url]\r\n\r\n\r\n[stars-url]:https://github.com/NowScott/IndWebIndex/stargazers \"星标\"\r\n[stars-image]: https://img.shields.io/github/stars/NowScott/IndWebIndex?label=Star\r\n[forks-url]: https://github.com/NowScott/IndWebIndex/forks \"复刻\"\r\n[forks-image]: https://img.shields.io/github/forks/NowScott/IndWebIndex?label=Fork\r\n[license-url]: https://opensource.org/license/gpl-3-0/  \"许可证\"\r\n[license-image]: https://img.shields.io/github/license/NowScott/IndWebIndex\r\n\r\n[commit-url]:https://github.com/NowScott/IndWebIndex/commits/main \"提交\"\r\n[commit-image]:https://img.shields.io/github/commit-activity/m/NowScott/IndWebIndex\r\n[contributors-url]:https://github.com/NowScott/IndWebIndex/graphs/contributors \"贡献者\"\r\n[contributors-image]:https://img.shields.io/github/contributors/NowScott/IndWebIndex\r\n\r\n[web-url]:https://www.nowscott.top \"中文网页\"\r\n[web-image]:https://img.shields.io/badge/%E7%BD%91%E9%A1%B5%E9%A2%84%E8%A7%88-%E4%B8%AD%E6%96%87-blue\r\n[stars-history-image]:https://api.star-history.com/svg?repos=NowScott/IndWebIndex\u0026type=Date\r\n\r\n[notion-url]:https://nowscott.notion.site/aef09fbce63649cba8b9269374dbb641?v=36b6f2625b8e4e5faf9f68e1284bd2bc\u0026pvs=74\r\n\r\n[access-url]:https://www.notion.so/my-integrations","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnowscott%2FIndWebIndex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnowscott%2FIndWebIndex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnowscott%2FIndWebIndex/lists"}