Reactの自動ルーティングについて

Reactのルーティングについて複数質問させてください．
現在Reactで自作ブログを作れるようになろうと奮闘中です．フロントエンド，バックエンドの基本的な知識はあるのですが，SPAは初めてなのでルーティングで困っています．

実現したいこと

pagesディレクトリ，またはどこかのディレクトリにhtmlで書いたファイルを追加すればそれをindexページで一覧表示してルーティングし，リンクを自動でつけるというものを作成したいです．

簡単にいうとWordPressまがいのものをReactで作成しようというものです．

知りたいこと

    ├─ index.js/
    ├─ App.js/
    ├─ pages/
    　　　 └─ Blog/
           ├─1_1.jsx
           ├─1_10.jsx
           └─ style.css

まず，全体がこのようなディレクトリ構成をしているとします．

そこでindexページでこのBlogディレクトリにあるファイルに対してのルーティングを書くと

<Link to={`/blog/1_1`}>
記事はこちら
 </Link>
<Link to={`/blog/1_10`}>
記事はこちら
 </Link>
・・・

と書く必要がでてきて，ものすごく面倒です．
そこでBlogディレクトリにあるファイルをmapなどを使って自動的に一覧表示できないかを考えています．
可能ならそのファイルからid指定で特定の要素を引っ張ってきて記事の見出しのようなものまで作れたらいいなと思っています．
しかしいろいろ調べても調べ方が悪いのか情報に行き着かずいろんなチュートリアル動画を参考にウロウロしています．
上記のことを実現するには何を勉強したらいいか教えてください．