最後にはじめに今回はBootstrapをreact.jsのフレームワークであるNext.jsへ導入する方法を解説していきます。以下cdnでのはじめ方です。簡単に導入できるのでぜひTryしてみましょう。react-dompages、componentsフォルダーを作成します。pagesフォルダーに作成したコンポーネントはルーティング対象になります。Nuxt.jsと同じですね。pages/index.jsを作成する以下のように記述します。Home;components/layout.jsを作成する今回はBootstrapでnavbarを作成してみましょう。bootstrapはCDNで使用してみます。layout関数内でhead関数にはBootstap,nav関数ではnavbar。これらをpages/index.jsにインポートします。childrenはprops.childrenのpropsを省略した形になります。Linkタグを使用するLinkタグを導入してみましょう。installは不要です。</ul>Linkタグでアンカータグをラップして、アンカータグにあったhref属性をLinkタグに移します。見慣れたnavbarですが、作成できました。next!が出力されていますが、こちらはpropsになります。loginとregisterのファイルも作成してみましょう。Register;簡単に作成することができます。最後に今回はNext.jsにBootstrapの導入とルーティングをやってみました。Next.jsSNSでもご購読できます。TwitterでフォローするFeedlyでフォローする@cattwin82プロフィール初学者からプログラミングをはじめて現在会社員エンジニアをやっています。事業や個人で学習した生のプログラミングの発進をしています。技術畑でありながら営業も得意としており、様々な業種の方とも交流をもっています。ITの社会基盤が当然の時代に突入した昨今、プログラミングの重要性に注目が集まっています。このblogではそんな日々の学びや業務の中で培われた情報をシェアできればと思っています。皆さんからもコメントをお待ちしております。