【最新版】Next.JS极简教程
<h1 id="最新版nextjs极简教程">【最新版】Next.JS极简教程</h1><p>https://www.bilibili.com/video/BV1do4y1K7BF 1 1</p>
<p>【最新版】Next.JS极简教程<br>
02.项目结构_B站<br>
03.定义路由_B站<br>
04.页面与布局_B站<br>
05.连接和导航_B站<br>
06.路由组_B站<br>
07.动态路由_B站<br>
08.Loading UI and Streaming_B站<br>
09.Error Handling_B站<br>
10.Parallel Routes_B站</p>
<p>并行路由</p>
<p>目录@xxrootlayout加入</p>
<pre><code class="language-js">export default function RootLayout(params: Readonly<{
children: React.ReactNode,
team:React.ReactNode
}>) {
return (
<html lang="en">
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
<Suspense fallback={<Loading/>}>
RootLayout
{params.children}
{params.team}
</Suspense>
</body>
</html>
);
}
</code></pre>
<p>11.Intercepting Routes_B站</p>
<p>拦截路由</p>
<p>@modal/(.)photos//pages.tsx</p>
<p>12.Route Handlers_B站<br>
13.Middleware_B站</p>
<p>路由守望</p>
<p>14.项目结构与国际化_B站<br>
15.静态渲染和动态渲染_B站<br>
16.数据获取_B站<br>
17.部署_B站</p>
<p>2023</p>
<p>nuxt 乃x</p>
<p>nest neix</p>
<p>nest 乃st</p>
<p>npx create-next-app@latest13.4.3</p>
<p>https://nextjs.org/</p>
<p>boss me ai error change</p>
<p>Tailwind CSS ds jdg 类似bootstrap css类</p>
<p>next 13.4.3 react18</p>
<p>Turbopack =vite=webpacks dsx</p>
<p>现在react19 next15</p>
<p>app/xx/xx/page.tsx</p>
<p>7+ 4+ 2 1+</p>
<p>组件传值 props</p>
<p>route传值</p>
<p>即使在内部路由（marketing）并共享相同的 URL 层次结构，您也可以通过在其文件夹中（shop）添加文件来为每个组创建不同的布局。layout.js 少一层访问</p>
<p>（marketing）随便起</p>
<p>生成静态参数<br>
该功能可以与动态路由段generateStaticParams结合使用，以在构建时静态生成路由，而不是在请求时按需生成路由。</p>
<p> 接受arg参数</p>
<p>[...arg] 全部参数接受/abc/a/c abcac</p>
<p>配置可以配置图片域名</p>
<p>静态和动态渲染<br>
在 Next.js 中，路由可以静态或动态呈现。<br>
在静态路由中，组件在构建时在服务器上呈现。工作的结果被缓存并在后续请求中重用。<br>
在动态路由中，组件在请求时在服务器上呈现。</p><br><br>
来源：https://www.cnblogs.com/KooTeam/p/18606605
頁:
[1]