初心者だけどWebアプリケーションを作ってみたい! #1 (Next.js環境構築)

元々コンピュータ・アーキテクチャ関連の研究をしているのですが、Web関連の知識が疎く、Webエンジニアの話についていけないことが多発しているため、ここいらで勉強＆開発してみようかなと。

まずは、勉強からだな。流行りに乗っかってNext.jsを採用して勉強することにする。全くの初心者で頓珍漢なことを記述する可能性大ですので、同じく初心者の方は導入に、ベテランの方は何言ってんだと優しく訂正してくださればと思います。

Next.jsについて軽く説明。Next.jsとはReactをベースとしたフロントエンドフレームワークである。ちなみにReactとはJavaScriptのライブラリでこれまたかなりの普及率らしい。

自分で調べた限り、ライブラリとフレームワークの違いは、ライブラリはあくまでWebアプリケーションを実現するためのコンポーネントに過ぎない。一方でフレームワークは一連の開発を実現するための設計ツール、というイメージ。理系なのに曖昧な定義で申し訳ないが、Next.jsにはサーバ機能がある一方で、Reactにはそれが無いあたりも含めてReactはWeb開発のための機能群なんだろう。そう考えると、Reactの方が学習コストが高そう故に、上述の通り、今回は楽するためにNext.jsを採用しました。

軽く調査した結果、公式の学習教材があったため、これをベースに勉強していこうと思う。まあ、個人的興味で勉強するので日記代わりに緩くやっていく。

Next.jsを学ぶためにはベースとなっているReactもある程度知っている必要があるんだけど、今回はこのリンクで走り読みした。分からなかったらその都度振り返るようにしたため、このページでは割愛するが、Reactからちゃんと学びたい方は上記のリンクや他のReactの教材から勉強するのがよろしかろう。
僕はきっといつかまた今度。

このページでは、最初の環境構築について説明する。
まずはNode.jsなるJavaScript実行環境をインストールする。バージョンは18.17以降であればOK.npm（Node.js Package Manager)なるものも同時に要インストール。

Ubuntuの場合:

$ sudo apt update
$ sudo apt upgrade
$ sudo apt install nodejs npm

Windowsの場合:
Node.jsのダウンロードサイトでNode.jsのLTSをインストール

これでインストールできるはず。

$ node --version
$ npm --version

上記のコマンドで正常にインストールできているか確認できる。

環境構築は以上。次回からプロジェクトを作成し、学んでいくこととする。