初めてのNext.js入門!簡単なアプリ実装でNext.jsを基礎から学んでみよう
#入門 #Nextjs #React #フレームワーク #SSG #SSR #webアプリ
【Next.jsでマイクロブログを構築してみたい方はこちら】
shincode.info/2021/12/31/udemy...
\ShinCode_Camp開校しました/
プログラミング講座&副業・起業&就職・転職が学べるプラットフォーム🚀
🎁月額2500円で全講座が見放題
🎁分からない箇所は質問し放題
🎁7日間無料キャンペーン実施中
🎁コミュニティ機能付き
🎁いつでも解約可能etc...
↓↓↓↓↓
code-s-school-5bc2.thinkific....
-----------------------------------------------------------------------------------------------------------------------------
【この動画を視聴するメリット】
・Next.jsとは何?が理解できます
・簡単なアプリ実装を通してNext.jsの基礎を学べます
・プリレンダリング手法が学べます
・ビルドする方法が学べます
【信頼性】
・Udemy講師
・講師レビュー評価94.6%
・Udemy受講生延べ300人突破
・Webアプリ/サイト開発数:200以上
★チャンネル登録はこちらから★
/ @user-hl9uv6cv7k
★今回のソースコード★
github.com/Shin-sibainu/nextj...
★運営者SNS★
Twitter: / shin_engineer
★この動画で使用している機材★
キーボード(Keychron K6 赤軸):amzn.to/3F4zca5
マウス(Logicool G ロジクール G ゲーミングマウス):amzn.to/3DZaaYB
マイク(サンワダイレクト USBマイク PCマイク):amzn.to/30AVwJF
マイクスタンド(Luling Arts マイクスタンド マイクアーム スタンド):
amzn.to/3se5onZ
※アフィリエイトリンクになります。
Пікірлер: 30
いろいろ聞いてごちゃごちゃしてる時に 「何が言いたいのかというと」でまとめてくれるの、マジで救われる
これが無料...贅沢すぎる....
簡潔でわかりやすい解説、ありがとうございます。とても勉強になりました!
すごいわかりやすい動画をありがとうございます!!とても勉強になります。声が聞きやすいです。
めちゃくちゃ分かりやすかったです。
Thank you! I appreciate it, you deserve more attention.
神動画ありがとうございます。
やばいめちゃくちゃわかりやすい😢
教材が少ないので助かります。 より詳しいチュートリアルの解説お願いしたいです!
初めてコメントします。 Reactのパッケージなのに、拡張子がJsなのが気になります。 Reactの機能はパッケージ側で補完されているから、と考えればいいのでしょうか?
create-nextコマンドで生成されたディレクトリにstylesフォルダがありません。vs codeのバージョンとか関係ありますか?あと、コマンド打つといくつか質問されますが、これってyesでいいものと、だめなものってありますか?
覚え書き 26:48
ラウターってなんや!?って思ったらルーターのことだった
@akhiro7944
Жыл бұрын
私も最初なんだ?と思ったら、実は「ラウター」が最近現場発音として多い読み方みたいですね。 他にもマルチスレッドも、マル「タイ」スレッドが現場発音に近いとか
自分用 21:54
本動画通りに作業してみましたが、最新のバージョンでは上手く行かないので、改めて動画を作っていただけると嬉しいです。
@user-hl9uv6cv7k
3 ай бұрын
すみません。Next13になりましたもんね。 僕のチャンネルの最新の動画でNext.js14で解説しておりますので、見て頂ければと思います。
こちらの教材動画のNextバージョンはいくつになりますでしょうか? 近日よりゆっくりと始めてますが、aタグでエラーになったり(解決済み)id.js記述後に動画通りにならず切り分けを進めていたところ、aタグの件についてはNext12から廃止になった模様です。 こちらのNextのバージョンが14.0.4であったことから、環境差分として読み替えればいいかと思いますが、可能であればバージョンを合わせたいため、概要欄にでも使用バージョン記載いただけますでしょうか? 宜しくお願い致します。
@user-hl9uv6cv7k
5 ай бұрын
ご視聴ありがとうございます! 使用しているバージョンについては概要欄にあるgithubのpackage.jsonに記載しておりますので、ご確認いただけると幸いです。
pagesのファイルが生成されていないのですが解決方法分かる方いますか?
@pier3986
5 ай бұрын
Next.js 13からはApp Routerに仕様変更されました。pagesが使いたい場合はcreate時のApp Routerの適用をNoにすれば動画のようなディレクトリになると思います。
UDEMYとの内容に違いはありますか?
@user-hl9uv6cv7k
2 жыл бұрын
SSGとSSRの使い時やマークダウンファイルを用いてのデータフェッチング等が違いますね(簡単なマイクロブログを作っています、投稿機能等は実装していませんが)。 ですがNext.jsの基本的な講座なので、こちらの動画や公式ドキュメントで学んだ方は受講する必要はあまりないと思います✋ より詳細に基礎を知りたい方だけでOKです。
構築は順番通りになってないでsね。特にpagesはないのは何の原因ですか?
@user-hl9uv6cv7k
Жыл бұрын
@latestで雛形を作ると、pagesが出ないかもしれないです。
@parkir0508
Жыл бұрын
@@user-hl9uv6cv7k動画と同じ構築したいですがどうすればよろしいですか?
@user-hl9uv6cv7k
Жыл бұрын
@@parkir0508 npx create-next-app blog-sample としてプロジェクト作成してみてください!そしたらできると思います。
@parkir0508
Жыл бұрын
@@user-hl9uv6cv7k ありがとうございます。
@parkir0508
Жыл бұрын
@@user-hl9uv6cv7k 何回もすみません、何回も試してみましたが構築際、念願のnext.jsのpagesのフォルダが作成できないですね。
すいません、githubをフォークしてビルドして、npm startしたらスマートフォンなどのページに飛ばないです。開発環境では飛んでいました。エラーとして TypeError: fetch failed at Object.fetch (node:internal/deps/undici/undici:11118:11) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async getServerSideProps (C:\Users\gonta\Desktop ext-js ext-app-tutorial\.next\server\pages\products\[id].js:59:17) at async Object.renderToHTML (C:\Users\gonta\Desktop ext-js ext-app-tutorial ode_modules ext\dist\server ender.js:507:20) at async doRender (C:\Users\gonta\Desktop ext-js ext-app-tutorial ode_modules ext\dist\server\base-server.js:720:34) at async cacheEntry.responseCache.get.incrementalCache.incrementalCache (C:\Users\gonta\Desktop ext-js ext-app-tutorial ode_modules ext\dist\server\base-server.js:837:28) at async C:\Users\gonta\Desktop ext-js ext-app-tutorial ode_modules ext\dist\server esponse-cache\index.js:83:36 { cause: Error: connect ECONNREFUSED ::1:3000 at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1300:16) { errno: -4078, code: 'ECONNREFUSED', syscall: 'connect', address: '::1', port: 3000 } } このようなものがでていますが、わかりますでしょうか