🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

サーバ

サーバは、 クライアントサーバモデルにおいてクライアントからの要求に対し 何らかのサービスを提供するプログラムを指す言葉です。 また、サーバーソフトウェアを稼動させているコンピュータ機器そのもののことも、 サーバーと呼ぶ場合もあります。

Q&A

解決済

1回答

4756閲覧

Nuxt.jsでサーバーが起動するのはなぜ??

退会済みユーザー

退会済みユーザー

総合スコア0

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

サーバ

サーバは、 クライアントサーバモデルにおいてクライアントからの要求に対し 何らかのサービスを提供するプログラムを指す言葉です。 また、サーバーソフトウェアを稼動させているコンピュータ機器そのもののことも、 サーバーと呼ぶ場合もあります。

1グッド

1クリップ

投稿2020/12/12 17:49

タイトルの通りなのですが、npm rvn devコマンドでサーバーが起動する仕組みはどうなっているのでしょうか?

現在Nuxt.jsでサイトを作っています。
コードを書く時に、フォルダ構成でルーティングができるのは分かるのですが、なぜNuxt.jsでサーバーが起動できるんでしょうか?
裏でNode.jsが動いているんでしょうか?

インターネットや書籍色々調べてみましたが、Nuxt.jsのメリットを紹介している記事ばかりで、そもそもの仕組みを紹介している記事が見当たらなかったので、もし有れば教えていただければ嬉しいです。

miyabi-sun👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kai0310

2020/12/12 17:59

`npm run 任意のコマンド`を実行することで、package.json内の`scripts`に記述されているコマンドが実行されます。手元の場合は以下でした。Nuxtでサーバーを起動しているという認識よりもNodeが起動しているという認識で問題ないかと思います。 "dev": "cross-env NODE_ENV=development GENERATE_ENV=development nuxt-ts",
退会済みユーザー

退会済みユーザー

2020/12/14 01:11

ご連絡ありがとうございます。 やはりNodeが使われているんですね。 もし宜しければ回答の方に書いていただければ嬉しいです。
guest

回答1

0

ベストアンサー

なぜNuxt.jsでサーバーが起動できるんでしょうか?

裏でNode.jsが動いているんでしょうか?

Nuxt.jsにはWebサーバのアプリケーションが付属で付いてきます。
勿論開発するコストは0じゃありません。
何故開発するのか?

そうした方がWebアプリの開発者が楽できるからです。
だからわざわざNuxt.jsの作者はWebサーバを開発して
仕組みとして組み込んでいるのです。

あなたの次のセリフを考えておきました

じゃあ、何故Webサーバを起動した方が楽になるの?

HTMLファイル吐き出して勝手にローカルで見ればいいじゃん

確かにChrome等のブラウザには、
ローカルのハードディスクに保存したHTML・PDFファイルを開いて閲覧する機能があります。
しかし、それだとWebサーバで使えるべき機能が備わっていないなど、異なる挙動をする点がいくつも存在します。

ざっと30秒程で思いついた内容です
致命的か否かは人によると思いますが、Ajaxは割と致命的なサービスは多いでしょう。

  • ライブリロード機能
  • Ajax
  • baseタグ等の挙動が違う
  • リンクのルート等の挙動が違う

Webページを制作する人間は古来より
Apache等のWebサイトを構築するソフトウェアを利用して、
http://localhost/hogehoge.htmlというパスにアクセスすれば閲覧出来るような仕組みを使ってWebサーバを構築していました。

それは今も変わりません。
ローカルのファイルをfile://xxxでアクセスしてもダメなんです。
誰かがWebサーバを立ち上げてhttp://localhost/xxxにアクセスして確認する必要があります。

なんでそのApacheとかいう専用ソフトウェアでWebサーバーを構築しないの?

Webエンジニアは1つのプロジェクトのみに集中出来るわけではありません。
一人で複数のWebサービスをメンテナンスする場面も存在します。
1個のソフトウェアで方向性ががっちり固定されるApache等のような仕組みは構築したくありません。

Webエンジニア達はサーバを必要な時に立ち上げ、
用事が済んだらすぐに終了出来るようにしたいと考えるようになりました。

Node.js、Ruby、Pythonといった様々なプログラミング言語で
Webサービスを構築・提供する仕組みはありますが、
その多くがこの思想のように「使うときだけWebサーバを裏で動かす」、
そして使わない時は終了してメモリを節約出来るようになっています。

Nuxt.jsはどういうサービスなのでしょう?
Node.jsを利用してHTMLとJSファイルを作って簡単にフロントエンドのWebサービスを構築、
提供する為のフレームワークですよね?

なら利便性の為に、npm run devコマンドを叩くと
すぐにWebサーバを立ち上がるような仕組みを開発してても不思議じゃないし、
Nuxt.jsが便利を名乗るならこの程度は出来て貰わないと困る。
そんな感じの印象を受けますね。

投稿2020/12/14 12:19

miyabi-sun

総合スコア21203

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2020/12/26 14:25

お礼の言葉を書いておらず、申し訳ございません。 大変参考になりました。本当にありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問