ニュースページを作る

[Hiroshiba]

• 実績ページを作る #96

に関連して、VOICEVOX内でニュースページを作りたいです。
ニュース一覧ページからそれぞれのニュースへ飛べるものを想定しています。

記事はmarkdownで書きたいのと、markdownを増やせば勝手に専用ページが生成されてニュース一覧に追加されると嬉しいです。
gatsbyでできそうですが、ご存じの方いらっしゃったら方法をちょっと教えていただけると嬉しいです。

[jdkfx]

こちらのIssueについて質問があります。

記事はmarkdownで書きたいのと、markdownを増やせば勝手に専用ページが生成されてニュース一覧に追加されると嬉しいです。

例えば記事の内容ごとにmarkdownsディレクトリにmarkdowns/news/add-maron-and-ryoran.mdのようなMarkdownファイルを追加し、slugを取得して公式ホームページ上で記事のページに遷移する形をとるという認識でよろしいでしょうか？
それ以外の方法について考えておられるのであれば、どのような手法を取られる予定だったのか教えていただきたいです。

[Hiroshiba]

@jdkfx コメントありがとうございます！！！とても嬉しいです！！！

認識全く一緒です！！
今思いついたのですが、ファイル名の先頭を20240219-みたいに日付つけておくと足す時に便利かもとか思いました！！

[jdkfx]

確かにファイルの先頭に日付をつけておけばニュースの順番を最新順で表示するための実装に使えそうなので自分も良いと思います！

[jdkfx]

@Hiroshiba
こちらなのですが、 #96 とまとめてニュースのページとしても良いのではないかと考えています。
例えば何かしらのプロジェクトに採用された際に、「〇〇というプロジェクトにVOICEVOXが採用されました！」といった実績のニュースとして周知できると考えているからです。

[Hiroshiba]

@jdkfx なるほどです！！　意見とてもありがたいです！！

#96 は実績ニュースもそうですが、事例紹介もイメージしていました！よくあるこういう感じのページみたいな。
https://www.ai-j.jp/client/

ニュースはビジネスパートナー・ユーザー・報道向け、実績はビジネスパートナー向けって感じかなと！
あ、もちろん実績ニュースもニュースで紹介できると嬉しいです！！

[jdkfx]

@Hiroshiba
ご返信ありがとうございます！

ニュースはビジネスパートナー・ユーザー・報道向け、実績はビジネスパートナー向けって感じかなと！

”誰に対するニュース、実績のページなのか”という視点を持たずに考えておりました… 🙇
上記の形で、一旦こちらのIssueを対応し、 #96 にも取り組めたらいいなと思っております！

[Hiroshiba]

ありがとうございます、ぜひぜひ！！　また提案などあればそちらもぜひ！！！

[jdkfx]

ご相談があります。
こちらの実装について、いくつかの実装方法を考えておりまして、どうすればよいかご意見をいただきたいです。

案１

• ニュース記事のエンドポイントが https://voicevox.hiroshiba.jp/news/20240304_sample_news
  • 記事のエンドポイントは下記のコード例のようにslugで管理するため、上記の20240304_部分はエンドポイント上では https://voicevox.hiroshiba.jp/news/sample_news のように除くことが可能です。
  • src/markdowns/news/内に20240304_sample_news.mdを作成することで記事が作成されますが、今後ニュースをたくさん書いていくことになった場合、src/markdowns/news/内に大量のマークダウンファイルが存在することになり、管理が大変になるかなと考えています。
  • ただ、日付の順番に並んでいるのでファイルが多くなるという理由以外で困るという点はなさそうです。

---
slug: "sample_news"
title: "サンプルニュース"
date: "2024-03-04"
---

案２

• ニュース記事のエンドポイントが https://voicevox.hiroshiba.jp/news/2024/03/sample_newsもしくは、https://voicevox.hiroshiba.jp/news/2024_03_sample_news
  • エンドポイントを年、月で区切り、月ごと、年ごとにニュースの一覧を取得することが可能になります。
  • src/markdowns/news/内に、src/markdowns/news/2024/、src/markdowns/news/2024/03といったディレクトリを切って、その中でマークダウンファイルを作成し、記事を管理することができると考えています。
  • 実装や設計、サイトの見やすさなどはこちらの方法が美しいと考えているのですが、実装に落とし込むとなるとこちらの方法は個人的に僕の力量では難しいと考えています。

以上です。
よろしくお願いいたします。

[Hiroshiba]

@jdkfx 早速ありがとうございます！！！　お返事遅れて申し訳ないです 🙇

どちらの方法も素敵だなと思いました！
その中の方法だと、ちょっと変わっちゃいますがsrc/markdowns/news/内に20240304_sample_news.mdのようなファイルを作った場合、逆に日付の方だけURLにする手もあるかもと思いました！

というのも、割とURLをどうするか考えるのがめんどくさいんですよね･･･････！！
だったらもう日付で良いのでは！？！？みたいな感じです！！
でもあまり強くない意見なので、まあとりあえず実装さえあればどんなものでも嬉しいかも･･･････？みたいな！！

[jdkfx]

参考にできそうな情報

• https://blog.livewing.net/create-gatsby-blog
• https://reffect.co.jp/react/gatsby-update#Markdown

[jdkfx]

個人的なメモ
ニュースに関する残タスク

• Markdownファイル内で画像が使えるようになっていること

参考にできそうな情報
https://www.gatsbyjs.com/docs/how-to/images-and-media/working-with-images-in-markdown/#inline-images-with-gatsby-remark-images