NEXT.js> NEXT.最初のステップ
1774 ワード
次のインストール [LOCAL]
$npm init
$ npm install next react react-dom
基本的なReact関連の開発環境を設定した.(webpackを含む)
package:jsを変更します.
devは開発サーバです.
WebPackはポートを提供しており、基本的な機能は3000回です.だから.
「dev」:「next dev-p 3001」には3001ポートが入力されます.
「dev」:WiFi(next dev-p 3001-h 0.0.0.0など)を使用している場合は、スマートフォンで検証できます.
nextにも独自のサーバがあります.だから.
nextサーバを実行するコマンド
lintは、すべてのコードが同じルールを使用することを許可します.
indexを含むpagesというフォルダを作成します.jsxファイルを作成します.const Homepage =()=>{
return(
<>
hello Next.js
</>
)
}
export default Homepage
次のように記入します.[local]
$npm run dev
ということで.
localhost:3001に入ると、次のように動作していることがわかります.
次の便利さ
1.ルータ機能は、ファイルを1つ作成するだけで実現できます.
aboutファイルを作成します.
[about.jsx]
const about =()=>{
return(
<>
hello about
</>
)
}
export default about
では、アドレス欄にhttp://localhost:3001/about表示と書くと、次のような結果になります.
このようにルータ機能を容易に実現することができる.
Reference
この問題について(NEXT.js> NEXT.最初のステップ), 我々は、より多くの情報をここで見つけました
https://velog.io/@nara7875/NEXT.js-첫걸음
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
[LOCAL]
$npm init
$ npm install next react react-dom
const Homepage =()=>{
return(
<>
hello Next.js
</>
)
}
export default Homepage
[local]
$npm run dev
[about.jsx]
const about =()=>{
return(
<>
hello about
</>
)
}
export default about
Reference
この問題について(NEXT.js> NEXT.最初のステップ), 我々は、より多くの情報をここで見つけました https://velog.io/@nara7875/NEXT.js-첫걸음テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol