戰(zhàn)教程：使用 `yarn redwood generate page` 創(chuàng)建第一個(gè)頁(yè)面與路由)
后端前端Web框架開(kāi)發(fā)工具【免費(fèi)下載鏈接】redwoodRedwoodGraphQL項(xiàng)目地址https://gitcode.com/gh_mirrors/re/redwood點(diǎn)擊查看免費(fèi)下載本篇文章基于 Redwood 官方教程第 4 版version-4.x第一章內(nèi)容圍繞yarn redwood generate page home /這一條命令完整講解 Redwood 中頁(yè)面Page的生成機(jī)制、Routes路由文件的自動(dòng)更新、NotFoundPage兜底規(guī)則以及基礎(chǔ)樣式引入。你將掌握頁(yè)面文件、測(cè)試文件、Storybook 文件如何被一次性生成路由如何被自動(dòng)注入以及如何用一小段 CSS 讓默認(rèn)頁(yè)面立即可讀。文中所有代碼與命令均以當(dāng)前倉(cāng)庫(kù)gh_mirrors/re/redwood中實(shí)際存在的源碼、模板與測(cè)試為佐證。為什么從第一個(gè)頁(yè)面開(kāi)始在完成 Redwood 項(xiàng)目初始化后瀏覽器打開(kāi)的是官方歡迎頁(yè)Welcome Page。本章的目標(biāo)是讓我們自己動(dòng)手創(chuàng)建一個(gè)真實(shí)的頁(yè)面替換掉這個(gè)歡迎頁(yè)。Redwood 提供了命令行腳手架工具來(lái)替我們完成大部分重復(fù)勞動(dòng)頁(yè)面生成就是其中最典型的一個(gè)入口。先執(zhí)行yarn redwood generate page home /這條命令做了四件事創(chuàng)建頁(yè)面組件文件web/src/pages/HomePage/HomePage.{js,tsx}。Redwood 會(huì)把page后面的第一個(gè)參數(shù)做 PascalCase 處理再追加后綴Page來(lái)構(gòu)造組件名例如home變成HomePage。創(chuàng)建配套的測(cè)試文件web/src/pages/HomePage/HomePage.test.{js,tsx}其中包含一個(gè)可以通過(guò)的冒煙測(cè)試組件能否正常渲染。創(chuàng)建配套的 Storybook 文件web/src/pages/HomePage/HomePage.stories.{js,tsx}用于在 Storybook 中獨(dú)立開(kāi)發(fā)和預(yù)覽該組件。在web/src/Routes.{js,tsx}中新增一條Route把路徑/映射到新的HomePage。執(zhí)行完命令后頁(yè)面其實(shí)已經(jīng)在線了——瀏覽器會(huì)自動(dòng)熱更新。此時(shí)看到的還只是一個(gè)樸素的原生 HTML 頁(yè)面但它已經(jīng)是我們自己的頁(yè)面了。打開(kāi)文件、改幾處文字、保存瀏覽器會(huì)立刻刷新出新內(nèi)容。頁(yè)面生成器的四個(gè)產(chǎn)物源碼級(jí)拆解從源碼看頁(yè)面生成器位于 packages/cli/src/commands/generate/page/page.js它按照固定模板產(chǎn)出三個(gè)文件頁(yè)面、測(cè)試、Storybook并單獨(dú)處理路由注入COMPONENT_SUFFIX Page固定追加的組件名后綴REDWOOD_WEB_PATH_NAME pages頁(yè)面統(tǒng)一存放在web/src/pages/下files()函數(shù)依次通過(guò)page.tsx.template、test.tsx.template、stories.tsx.template生成內(nèi)容當(dāng)路由帶參數(shù)時(shí)Storybook 使用stories.tsx.parameters.template以便在故事中傳入?yún)?shù)示例routes()函數(shù)構(gòu)造Route path... page{XxxPage} namexxx /隨后由addRoutesToRouterTask寫(xiě)回路由文件。生成后的頁(yè)面模板 page.tsx.template 大致如下以 TypeScript 為例const HomePage () { return ( Metadata titleHome descriptionHome page / h1HomePage/h1 p Find me in codeweb/src/pages/HomePage/HomePage.tsx/code /p / ) } export default HomePage幾個(gè)值得注意的實(shí)現(xiàn)細(xì)節(jié)模板頂部自動(dòng)引入了Metadata組件redwoodjs/web用于設(shè)置頁(yè)面標(biāo)題與描述。生成器在收尾步驟還會(huì)輸出一條提示提醒開(kāi)發(fā)者M(jìn)etadata對(duì) SEO 的重要性。測(cè)試模板 test.tsx.template 使用redwoodjs/testing/web的render對(duì)頁(yè)面做一次渲染斷言渲染不拋錯(cuò)這是新頁(yè)面的最低保障測(cè)試。測(cè)試與 Storybook 文件是否生成受命令行參數(shù)和項(xiàng)目配置雙重控制。在 page.js 中可以看到當(dāng)tests/stories未顯式傳入時(shí)會(huì)讀取getConfig().generate.tests/getConfig().generate.stories即redwood.toml中的默認(rèn)開(kāi)關(guān)。如果你沒(méi)有特別傳參那么頁(yè)面 測(cè)試 Storybook三件套默認(rèn)都會(huì)生成——教程里那句 Youdowrite tests for your components, *dont you?? 就是 Redwood 腳手架默認(rèn)行為的最佳注腳。路由文件的自動(dòng)更新與頁(yè)面自動(dòng)導(dǎo)入打開(kāi)web/src/Routes.{js,tsx}你會(huì)看到生成器寫(xiě)入的這條路由import { Router, Route } from redwoodjs/router const Routes () { return ( Router Route path/ page{HomePage} namehome / Route notfound page{NotFoundPage} / /Router ) } export default Routes注意我們?cè)?Routes 文件中直接引用了HomePage但文件頂部并沒(méi)有import HomePage from src/pages/HomePage/HomePage這樣的語(yǔ)句。這是 Redwood 的刻意設(shè)計(jì)——Routes 文件會(huì)自動(dòng)導(dǎo)入所有頁(yè)面避免在路由文件頂部堆出長(zhǎng)長(zhǎng)一串 import 聲明。從倉(cāng)庫(kù)中的 fixture 可以看到這一機(jī)制的實(shí)際效果packages/internal/src/tests/fixtures/nestedPages/web/src/Routes.js 中每個(gè)頁(yè)面都有獨(dú)立 import且支持非默認(rèn)導(dǎo)出與重命名導(dǎo)入如import BazingaJobProfilePageWithFunnyName from src/pages/Jobs/JobProfilePage說(shuō)明頁(yè)面的自動(dòng)發(fā)現(xiàn)與導(dǎo)入由 Redwood 內(nèi)部工具鏈在構(gòu)建/類(lèi)型生成階段完成。Route的三個(gè)關(guān)鍵屬性屬性含義示例path匹配的 URL 路徑/、/hellopage渲染該路徑的頁(yè)面組件HomePagename路由的命名引用供routes.home()生成鏈接homepath與page是必填項(xiàng)。路由校驗(yàn)邏輯在 packages/router/src/route-validators.ts 的測(cè)試中體現(xiàn)得很清楚缺少path會(huì)拋出Route element for xxx is missing required props: path缺少page會(huì)拋出... is missing required props: page普通路由缺少name同樣會(huì)報(bào)錯(cuò)。而notfound路由是特例它不需要path任何未匹配的 URL 都由它接管但必須有page。NotFoundPage 與 Splash Screen 的切換規(guī)則只要路由表中存在path/的路由Redwood 的初始?xì)g迎頁(yè)Splash Screen就再也不會(huì)出現(xiàn)。而NotFoundPage承擔(dān)的是兜底職責(zé)當(dāng)請(qǐng)求的 URL 匹配不到任何路由時(shí)Route notfound page{NotFoundPage} /會(huì)被渲染。在 packages/router/src/tests/analyzeRoutes.test.tsx 中路由分析結(jié)果會(huì)單獨(dú)暴露NotFoundPage并被斷言為有效的 React 元素說(shuō)明兜底頁(yè)是路由系統(tǒng)的第一等公民。動(dòng)手驗(yàn)證把首頁(yè)換成別的路徑把路由改成Route path/hello page{HomePage} namehome /保存后訪問(wèn) http://localhost:8910/根路徑你會(huì)發(fā)現(xiàn) Splash Screen 又出現(xiàn)了——因?yàn)榇丝谈窂较乱呀?jīng)沒(méi)有任何頁(yè)面路由Redwood 在根路徑展示了一個(gè)應(yīng)用內(nèi)路由列表列出當(dāng)前應(yīng)用所有可用的 URL。而訪問(wèn)/hello則能看到 HomePage 的內(nèi)容。這個(gè)實(shí)驗(yàn)很好地說(shuō)明了path與page的解耦關(guān)系頁(yè)面組件不綁定路徑路徑只是路由表里的一行配置。做完實(shí)驗(yàn)記得把路徑改回/否則后續(xù)章節(jié)的鏈接都會(huì)指向錯(cuò)誤的地址?；A(chǔ)樣式讓默認(rèn)頁(yè)面不那么素之前的教程為了聚焦代碼刻意不做任何樣式但一個(gè)完全沒(méi)有樣式的站點(diǎn)實(shí)在影響觀感。這里提供一份極簡(jiǎn)的基礎(chǔ)樣式表直接粘貼進(jìn)web/src/index.cssbody { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; } ul { list-style-type: none; margin: 1rem 0; padding: 0; } li { display: inline-block; margin: 0 1rem 0 0 ; } h1 a { text-decoration: none; color: black; } button, input, label, textarea { display: block; outline: none; } label { margin-top: 1rem; } .error { color: red; } input.error, textarea.error { border: 1px solid red; } .form-error { color: red; background-color: lavenderblush; padding: 1rem; display: inline-block; } .form-error ul { list-style-type: disc; margin: 1rem; padding: 1rem; } .form-error li { display: list-item; } .flex-between { display: flex; justify-content: space-between; } .flex-between button { display: inline; }這段樣式的效果是正文改用操作系統(tǒng)的系統(tǒng)字體-apple-system、Segoe UI、Roboto等元素之間保留適度留白列表去掉圓點(diǎn)并橫向排列表單控件縱向堆疊同時(shí)預(yù)置了.error、.form-error等表單錯(cuò)誤態(tài)類(lèi)名——這些類(lèi)名會(huì)在后續(xù)章節(jié)的表單與表單校驗(yàn)示例中直接復(fù)用。CSS 是建議性的你可以按喜好增刪調(diào)整甚至完全忽略、繼續(xù)使用瀏覽器默認(rèn)樣式。但需要知道的是本教程后續(xù)截圖都是基于這份基礎(chǔ)樣式表渲染的如果改動(dòng)較大界面觀感可能與截圖略有出入。小結(jié)至此你已經(jīng)完成 Redwood 的第一個(gè)里程碑用一條generate page命令創(chuàng)建了頁(yè)面組件、測(cè)試與 Storybook 文件理解了路由文件的自動(dòng)注入與頁(yè)面自動(dòng)導(dǎo)入機(jī)制知道了NotFoundPage的兜底規(guī)則并為后續(xù)章節(jié)準(zhǔn)備了基礎(chǔ)樣式。下一步可以順著本教程繼續(xù)深入路由與頁(yè)面鏈接的使用routes.home()與Link、Storybook 與組件測(cè)試chapter5/storybook.md、以及 Redwood 的數(shù)據(jù)層Service 與 GraphQL。這些內(nèi)容會(huì)建立在你已經(jīng)擁有一個(gè)屬于自己的首頁(yè)這個(gè)前提之上。贊分享后端前端Web框架開(kāi)發(fā)工具【免費(fèi)下載鏈接】redwoodRedwoodGraphQL項(xiàng)目地址https://gitcode.com/gh_mirrors/re/redwood點(diǎn)擊查看免費(fèi)下載相關(guān)推薦Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接generate page 與 Link 實(shí)戰(zhàn)Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接generate page 與 Link 實(shí)戰(zhàn) 本篇教程承接 Redwood 全棧框架RedwoodG后端前端Web框架開(kāi)發(fā)工具Redwood 教程用 generate page 創(chuàng)建第二個(gè)頁(yè)面并通過(guò) Link 與命名路由打通頁(yè)面導(dǎo)航Redwood 教程用 generate page 創(chuàng)建第二個(gè)頁(yè)面并通過(guò) Link 與命名路由打通頁(yè)面導(dǎo)航 本篇教程是 Redwood 官方教程第一章的延續(xù)后端前端Web框架開(kāi)發(fā)工具Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接About 頁(yè)面實(shí)戰(zhàn)Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接About 頁(yè)面實(shí)戰(zhàn) 本篇技術(shù)指南來(lái)自 Redwood 官方教程第一章講解如何用 redwood gen后端前端Web框架開(kāi)發(fā)工具上一篇終極指南Apache Airflow監(jiān)控告警體系構(gòu)建完整的數(shù)據(jù)工作流監(jiān)控解決方案下一篇Tilix高級(jí)功能揭秘同步輸入、觸發(fā)器與自動(dòng)配置文件切換創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 Redwood 實(shí)戰(zhàn)教程：使用 `yarn redwood generate page` 創(chuàng)建第一個(gè)頁(yè)面與路由
后端前端Web框架開(kāi)發(fā)工具【免費(fèi)下載鏈接】redwoodRedwoodGraphQL項(xiàng)目地址https://gitcode.com/gh_mirrors/re/redwood點(diǎn)擊查看免費(fèi)下載本篇文章基于 Redwood 官方教程第 4 版version-4.x第一章內(nèi)容圍繞yarn redwood generate page home /這一條命令完整講解 Redwood 中頁(yè)面Page的生成機(jī)制、Routes路由文件的自動(dòng)更新、NotFoundPage兜底規(guī)則以及基礎(chǔ)樣式引入。你將掌握頁(yè)面文件、測(cè)試文件、Storybook 文件如何被一次性生成路由如何被自動(dòng)注入以及如何用一小段 CSS 讓默認(rèn)頁(yè)面立即可讀。文中所有代碼與命令均以當(dāng)前倉(cāng)庫(kù)gh_mirrors/re/redwood中實(shí)際存在的源碼、模板與測(cè)試為佐證。為什么從第一個(gè)頁(yè)面開(kāi)始在完成 Redwood 項(xiàng)目初始化后瀏覽器打開(kāi)的是官方歡迎頁(yè)Welcome Page。本章的目標(biāo)是讓我們自己動(dòng)手創(chuàng)建一個(gè)真實(shí)的頁(yè)面替換掉這個(gè)歡迎頁(yè)。Redwood 提供了命令行腳手架工具來(lái)替我們完成大部分重復(fù)勞動(dòng)頁(yè)面生成就是其中最典型的一個(gè)入口。先執(zhí)行yarn redwood generate page home /這條命令做了四件事創(chuàng)建頁(yè)面組件文件web/src/pages/HomePage/HomePage.{js,tsx}。Redwood 會(huì)把page后面的第一個(gè)參數(shù)做 PascalCase 處理再追加后綴Page來(lái)構(gòu)造組件名例如home變成HomePage。創(chuàng)建配套的測(cè)試文件web/src/pages/HomePage/HomePage.test.{js,tsx}其中包含一個(gè)可以通過(guò)的冒煙測(cè)試組件能否正常渲染。創(chuàng)建配套的 Storybook 文件web/src/pages/HomePage/HomePage.stories.{js,tsx}用于在 Storybook 中獨(dú)立開(kāi)發(fā)和預(yù)覽該組件。在web/src/Routes.{js,tsx}中新增一條Route把路徑/映射到新的HomePage。執(zhí)行完命令后頁(yè)面其實(shí)已經(jīng)在線了——瀏覽器會(huì)自動(dòng)熱更新。此時(shí)看到的還只是一個(gè)樸素的原生 HTML 頁(yè)面但它已經(jīng)是我們自己的頁(yè)面了。打開(kāi)文件、改幾處文字、保存瀏覽器會(huì)立刻刷新出新內(nèi)容。頁(yè)面生成器的四個(gè)產(chǎn)物源碼級(jí)拆解從源碼看頁(yè)面生成器位于 packages/cli/src/commands/generate/page/page.js它按照固定模板產(chǎn)出三個(gè)文件頁(yè)面、測(cè)試、Storybook并單獨(dú)處理路由注入COMPONENT_SUFFIX Page固定追加的組件名后綴REDWOOD_WEB_PATH_NAME pages頁(yè)面統(tǒng)一存放在web/src/pages/下files()函數(shù)依次通過(guò)page.tsx.template、test.tsx.template、stories.tsx.template生成內(nèi)容當(dāng)路由帶參數(shù)時(shí)Storybook 使用stories.tsx.parameters.template以便在故事中傳入?yún)?shù)示例routes()函數(shù)構(gòu)造Route path... page{XxxPage} namexxx /隨后由addRoutesToRouterTask寫(xiě)回路由文件。生成后的頁(yè)面模板 page.tsx.template 大致如下以 TypeScript 為例const HomePage () { return ( Metadata titleHome descriptionHome page / h1HomePage/h1 p Find me in codeweb/src/pages/HomePage/HomePage.tsx/code /p / ) } export default HomePage幾個(gè)值得注意的實(shí)現(xiàn)細(xì)節(jié)模板頂部自動(dòng)引入了Metadata組件redwoodjs/web用于設(shè)置頁(yè)面標(biāo)題與描述。生成器在收尾步驟還會(huì)輸出一條提示提醒開(kāi)發(fā)者M(jìn)etadata對(duì) SEO 的重要性。測(cè)試模板 test.tsx.template 使用redwoodjs/testing/web的render對(duì)頁(yè)面做一次渲染斷言渲染不拋錯(cuò)這是新頁(yè)面的最低保障測(cè)試。測(cè)試與 Storybook 文件是否生成受命令行參數(shù)和項(xiàng)目配置雙重控制。在 page.js 中可以看到當(dāng)tests/stories未顯式傳入時(shí)會(huì)讀取getConfig().generate.tests/getConfig().generate.stories即redwood.toml中的默認(rèn)開(kāi)關(guān)。如果你沒(méi)有特別傳參那么頁(yè)面 測(cè)試 Storybook三件套默認(rèn)都會(huì)生成——教程里那句 Youdowrite tests for your components, *dont you?? 就是 Redwood 腳手架默認(rèn)行為的最佳注腳。路由文件的自動(dòng)更新與頁(yè)面自動(dòng)導(dǎo)入打開(kāi)web/src/Routes.{js,tsx}你會(huì)看到生成器寫(xiě)入的這條路由import { Router, Route } from redwoodjs/router const Routes () { return ( Router Route path/ page{HomePage} namehome / Route notfound page{NotFoundPage} / /Router ) } export default Routes注意我們?cè)?Routes 文件中直接引用了HomePage但文件頂部并沒(méi)有import HomePage from src/pages/HomePage/HomePage這樣的語(yǔ)句。這是 Redwood 的刻意設(shè)計(jì)——Routes 文件會(huì)自動(dòng)導(dǎo)入所有頁(yè)面避免在路由文件頂部堆出長(zhǎng)長(zhǎng)一串 import 聲明。從倉(cāng)庫(kù)中的 fixture 可以看到這一機(jī)制的實(shí)際效果packages/internal/src/tests/fixtures/nestedPages/web/src/Routes.js 中每個(gè)頁(yè)面都有獨(dú)立 import且支持非默認(rèn)導(dǎo)出與重命名導(dǎo)入如import BazingaJobProfilePageWithFunnyName from src/pages/Jobs/JobProfilePage說(shuō)明頁(yè)面的自動(dòng)發(fā)現(xiàn)與導(dǎo)入由 Redwood 內(nèi)部工具鏈在構(gòu)建/類(lèi)型生成階段完成。Route的三個(gè)關(guān)鍵屬性屬性含義示例path匹配的 URL 路徑/、/hellopage渲染該路徑的頁(yè)面組件HomePagename路由的命名引用供routes.home()生成鏈接homepath與page是必填項(xiàng)。路由校驗(yàn)邏輯在 packages/router/src/route-validators.ts 的測(cè)試中體現(xiàn)得很清楚缺少path會(huì)拋出Route element for xxx is missing required props: path缺少page會(huì)拋出... is missing required props: page普通路由缺少name同樣會(huì)報(bào)錯(cuò)。而notfound路由是特例它不需要path任何未匹配的 URL 都由它接管但必須有page。NotFoundPage 與 Splash Screen 的切換規(guī)則只要路由表中存在path/的路由Redwood 的初始?xì)g迎頁(yè)Splash Screen就再也不會(huì)出現(xiàn)。而NotFoundPage承擔(dān)的是兜底職責(zé)當(dāng)請(qǐng)求的 URL 匹配不到任何路由時(shí)Route notfound page{NotFoundPage} /會(huì)被渲染。在 packages/router/src/tests/analyzeRoutes.test.tsx 中路由分析結(jié)果會(huì)單獨(dú)暴露NotFoundPage并被斷言為有效的 React 元素說(shuō)明兜底頁(yè)是路由系統(tǒng)的第一等公民。動(dòng)手驗(yàn)證把首頁(yè)換成別的路徑把路由改成Route path/hello page{HomePage} namehome /保存后訪問(wèn) http://localhost:8910/根路徑你會(huì)發(fā)現(xiàn) Splash Screen 又出現(xiàn)了——因?yàn)榇丝谈窂较乱呀?jīng)沒(méi)有任何頁(yè)面路由Redwood 在根路徑展示了一個(gè)應(yīng)用內(nèi)路由列表列出當(dāng)前應(yīng)用所有可用的 URL。而訪問(wèn)/hello則能看到 HomePage 的內(nèi)容。這個(gè)實(shí)驗(yàn)很好地說(shuō)明了path與page的解耦關(guān)系頁(yè)面組件不綁定路徑路徑只是路由表里的一行配置。做完實(shí)驗(yàn)記得把路徑改回/否則后續(xù)章節(jié)的鏈接都會(huì)指向錯(cuò)誤的地址?；A(chǔ)樣式讓默認(rèn)頁(yè)面不那么素之前的教程為了聚焦代碼刻意不做任何樣式但一個(gè)完全沒(méi)有樣式的站點(diǎn)實(shí)在影響觀感。這里提供一份極簡(jiǎn)的基礎(chǔ)樣式表直接粘貼進(jìn)web/src/index.cssbody { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; } ul { list-style-type: none; margin: 1rem 0; padding: 0; } li { display: inline-block; margin: 0 1rem 0 0 ; } h1 a { text-decoration: none; color: black; } button, input, label, textarea { display: block; outline: none; } label { margin-top: 1rem; } .error { color: red; } input.error, textarea.error { border: 1px solid red; } .form-error { color: red; background-color: lavenderblush; padding: 1rem; display: inline-block; } .form-error ul { list-style-type: disc; margin: 1rem; padding: 1rem; } .form-error li { display: list-item; } .flex-between { display: flex; justify-content: space-between; } .flex-between button { display: inline; }這段樣式的效果是正文改用操作系統(tǒng)的系統(tǒng)字體-apple-system、Segoe UI、Roboto等元素之間保留適度留白列表去掉圓點(diǎn)并橫向排列表單控件縱向堆疊同時(shí)預(yù)置了.error、.form-error等表單錯(cuò)誤態(tài)類(lèi)名——這些類(lèi)名會(huì)在后續(xù)章節(jié)的表單與表單校驗(yàn)示例中直接復(fù)用。CSS 是建議性的你可以按喜好增刪調(diào)整甚至完全忽略、繼續(xù)使用瀏覽器默認(rèn)樣式。但需要知道的是本教程后續(xù)截圖都是基于這份基礎(chǔ)樣式表渲染的如果改動(dòng)較大界面觀感可能與截圖略有出入。小結(jié)至此你已經(jīng)完成 Redwood 的第一個(gè)里程碑用一條generate page命令創(chuàng)建了頁(yè)面組件、測(cè)試與 Storybook 文件理解了路由文件的自動(dòng)注入與頁(yè)面自動(dòng)導(dǎo)入機(jī)制知道了NotFoundPage的兜底規(guī)則并為后續(xù)章節(jié)準(zhǔn)備了基礎(chǔ)樣式。下一步可以順著本教程繼續(xù)深入路由與頁(yè)面鏈接的使用routes.home()與Link、Storybook 與組件測(cè)試chapter5/storybook.md、以及 Redwood 的數(shù)據(jù)層Service 與 GraphQL。這些內(nèi)容會(huì)建立在你已經(jīng)擁有一個(gè)屬于自己的首頁(yè)這個(gè)前提之上。贊分享后端前端Web框架開(kāi)發(fā)工具【免費(fèi)下載鏈接】redwoodRedwoodGraphQL項(xiàng)目地址https://gitcode.com/gh_mirrors/re/redwood點(diǎn)擊查看免費(fèi)下載相關(guān)推薦Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接generate page 與 Link 實(shí)戰(zhàn)Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接generate page 與 Link 實(shí)戰(zhàn) 本篇教程承接 Redwood 全棧框架RedwoodG后端前端Web框架開(kāi)發(fā)工具Redwood 教程用 generate page 創(chuàng)建第二個(gè)頁(yè)面并通過(guò) Link 與命名路由打通頁(yè)面導(dǎo)航Redwood 教程用 generate page 創(chuàng)建第二個(gè)頁(yè)面并通過(guò) Link 與命名路由打通頁(yè)面導(dǎo)航 本篇教程是 Redwood 官方教程第一章的延續(xù)后端前端Web框架開(kāi)發(fā)工具Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接About 頁(yè)面實(shí)戰(zhàn)Redwood 教程創(chuàng)建第二個(gè)頁(yè)面與命名路由鏈接About 頁(yè)面實(shí)戰(zhàn) 本篇技術(shù)指南來(lái)自 Redwood 官方教程第一章講解如何用 redwood gen后端前端Web框架開(kāi)發(fā)工具上一篇終極指南Apache Airflow監(jiān)控告警體系構(gòu)建完整的數(shù)據(jù)工作流監(jiān)控解決方案下一篇Tilix高級(jí)功能揭秘同步輸入、觸發(fā)器與自動(dòng)配置文件切換創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考