前書き
どうも！絶賛就活中のグッピーです！
なんと僕の尊敬する師匠が会社をクビになってしまいました・・・
理由が価値観の相違などと聞き、価値観の一致がどれほど重要なのかを思い知らされましたね。
ってなことは置いておき、今回はnext.jsの主な機能と、なぜnext.jsが人気急上昇中なのかを書いていきたいと思います！！
next.jsとは？
Reactをベースに作られたwebフレームワークです。これを使うことで、reactを使ったweb開発が、より便利にできるようになります！
また、next.jsはvercelという米国の企業が開発しており、完全にオープンソースなライブラリとしてGitHubに公開されています。
なぜNext.jsが使われるか
そして、なぜnext.jsが選ばれるのか。ということについてなのですが、それは
・ サイトの初期表示が遅い
・ SEOにめっぽう弱い
・そのため、サービスによって向き不向きがある
などのデメリットが挙げられます。これらについて最初知らなかったので結構驚きですね。というかReactってSEOに弱かったんですね・・・
ではなぜnext.jsが使われるのかということなのですが、それは以下のメリットが挙げられます。
・サイトの初期表示が早い
・SEOが強い
・Node.jsなどサーバーJSも使える
・デプロイが簡単
が挙げられます！もちろん他のも色々と挙げられるのですが、主なものはこんな感じです。
個人的な推しポイント
次にnext.jsの主な機能と推しポイントを紹介していきます。
・ SSR/SSGが使える
やはり、next.jsを使う人はこの機能目当ての人も多いのではないでしょうか。SSRとはサーバーサイドレンダリングの略で、クライアント側で処理していたHTMLなどの処理をサーバー側でやろう！っていう話ですね。SSGはサーバーサイドジェネレーターの略で、サーバー側で先にHTMLファイルとして処理しておこう！とする機能です。この機能のおかげで、超高速でページ遷移ができます。もちろんデメリットはありますが、それは大規模開発などの時に気をつけるべきことなので、今は気にしなくて良いです。
・ ルーティングの自動生成
なんとpagesファイルの下にjsファイルを配置するだけでページを作れちゃうんです。もう感動ですね。reactだけでやっていた時はreact-router-domというライブラリを導入して、ちまちまとルーティングをしていたのですが、それからもう解放されます。
・CSSファイルの適用
Reactではcssを描くのにライブラリーを導入する必要があるのですが(知らなかった・・)、next.jsでは最初からサポートされています。環境構築という最初の鬼門を取り払ってくれることには感謝しかありませんね。
・APIルート
APIルートとはnext.jsでAPIを構築できる機能です。このおかげでバックエンドの処理をここで行ったり、APIと連携できたりします。また、apiルート以下でもJSで書くことができるので、JavaScriptだけで書かれたアプリケーションを作ることができるのです。JSファンにとっては鬼に金棒ですね
・デプロイとデータベースの連携が簡単
vercel社が出しているvercelを使えばデプロイが簡単にできます。また、データベースも簡単に作成できたりするので、データベースの管理も楽々です。
僕の推しポイントはこんな感じです。一言で言うと神ですね。
終わりに
はい。こんな感じでNext.jsについてまとめてみました。reactでwebアプリを作ってみるつもりだったのですが、next.jsで作ろうと決意するぐらいには恵まれた機能群です。これからもはやっていくと思うので、興味がある方は触ってみては？！
にしても就活を色々とやっているのですが、競技プログラミングを課題に課す企業が多いですね。プログラミングスクールはその指導もちゃんと行ったほうがいいと思うのは僕だけでしょうか・・・
ではまた別の記事で！！グッピーでした！