使用 FastSchema、Next.JS、NextAuth.js v5 和 Chakra UI 构建 DEV.to 风格的多用户博客(1)
前言
FastSchema 是无代码无头 CMS,具有内置功能: 管理控制面板、文件管理器、OAS、RBAC 等。但到目前为止,我还没有找到一个足够好的 web 前端来展示其丰富的功能。因为 “Next.js 拥有在 web 上构建优秀产品所需的一切”,所以让我来试试吧...
感谢 GitHub 上的 dev.to clone 仓库,能找到的我都找来看了!还有 Next.js——您代码仓库中有 29 个无头 CMS 的示例(https://github.com/vercel/next.js/tree/canary/examples),唯独没有 FastSchema 的。你们给了我尝试的勇气。
注:请注意,这只是一个实验性的演示系统。后台基本稳定,web 前端仍在迭代中……
请尽量在 Linux 下测试,因为 FastSchema 有一个环境变量名为 MAIL,这个可能会与系统变量冲突。在 Windows 下上传图片可能会出错,请参考:https://github.com/vulcangz/fastschema/commits/develop/
简述
来看一个查询,是一个获取文章详情的 GET 请求:
http://127.0.0.1:8000/api/content/post/327/?select=id,cover_image,title,content,view_count,comments_count,share_count,likes,readings,created_at,user.username,user.created_at,user.likes,user.following,user.followedBy,user.profile,tags
响应(需要的、不需要的字段是不是都有了!)
{ "data": { "id": 327, "cover_image": "https://fakeimg.pl/350x200/?text=Hello%20World\u0026font=lobster", "title": "A faithful data very nervously watch the school.", "content": "Outside throughout quarterly stemmed without my eat swing patrol which in consequently seriously ever young lucky jump certain hang mob. Still anyone that these to me as these generosity black aha hers man their out quantity however totally all his. Any give busily whom anywhere fast often stand cry nothing bunch your lazy close whole several everything employment her though. For though how now fortnightly in here mine leap of downstairs be mine anybody his throughout awkwardly us potato myself. Yours consequently tongue any decidedly I stand accordingly that did nearby Icelandic monthly bevy us ours she country loneliness mine. For your head any calm grow does who for year me usually him nevertheless nightly where for her heavy lately. My out courageously right addition any now here that stream nightly himself moreover been other onto tunnel stress even troop. Nobody our frankly understanding trust did talk might it this next fast occasionally lately happiness care are yourselves exemplified nearby. Does shall through neither outfit as summation an numerous my themselves generation that how snarl besides out book hurriedly certain. Our fast constantly Hindu engine shake enough before the talented down anthology whoever phew nature archipelago it hmm for therefore.\n\nThat there might all besides words yourself yet cook lovely as information indeed yourself finally entertain they mine behind few. Fully those none may here shall badly huge book beans college therefore indeed himself those content mob this bird tomorrow. Elsewhere firstly quit how orchard did company that victorious infrequently limp myself sleep irritate clump it me noisily next about. Bravo earlier on stand its fact yours horde army dynasty phone this snarl in woman has their quarterly slavery should. Last been upon dynasty laugh what hmm up tonight your for grip consequently then many out this gee journey most. Consequently which man i.e. whose result its hedge follow under in whichever sit without those whose crawl herself anybody confusion. Those party someone Lincolnian away where that moreover whom above finally over constantly through these play time group telephone anything. Throughout where whomever when packet nightly somebody in team several as elsewhere fortnightly some where surprise fruit bevy throughout which. Brilliance earlier to away to pretty hey monthly which that occasionally next enlist wash ours plant could simply furthermore all. Where would whom that daughter of embrace couple Cypriot finally who secondly ourselves completely am instance then might no next.\n\nAll album substantial sleep neither themselves whatever problem generously stupidity fork which in this group juice casino ours recently as. That break that in party forest board app does recklessly him arrive about late when between sit scream there understanding. Instead tomorrow Turkmen wisp lead child itself fantastic anyone annually his next stemmed mob few moreover by it cast their. All when i.e. substantial hers otherwise it itself which be choir aha mine luxuty win including cleverness lead eye wear. Now east me utterly troubling these eagerly where perfectly Monacan highlight as tonight all never case I mine above mustering. Which Taiwanese path since around aha these cry thoroughly in indeed each sigh our detective e.g. why elegance any terrible. For frequently ours at nobody whose inadequately was bale cautiously that but these early tablet ski finally remove my Himalayan. Dull Californian cookware beyond so honesty is that where brace ouch team whoa whom weekly till that why doctor lately. Without theirs work limp now their whichever German these gang someone several cloud their there travel as he though any. Do off patrol many spit kill repulsive outrageous certain both across a as awkwardly help with everything next anthology beneath.", "view_count": 38, "comments_count": 0, "share_count": 10, "created_at": "2024-06-19T19:13:43.955929657Z", "user_id": 2, "readings": [ { "id": 8, "user_id": 2, "post_id": 327, "created_at": "2025-01-11T14:39:40Z" } ], "user": { "id": 2, "username": "test1", "created_at": "2024-12-30T05:10:42Z", "likes": [ { "id": 22, "user_id": 2, "post_id": 328, "created_at": "2025-01-17T07:26:03Z" } ], "following": [ { "id": 1, "followedUser_id": 2, "followingUser_id": 6, "created_at": "2024-12-30T10:25:13Z" }, { "id": 7, "followedUser_id": 2, "followingUser_id": 4, "created_at": "2025-01-11T13:14:21Z" }, { "id": 8, "followedUser_id": 2, "followingUser_id": 2, "created_at": "2025-01-11T14:39:12Z" } ], "followedBy": [ { "id": 8, "followedUser_id": 2, "followingUser_id": 2, "created_at": "2025-01-11T14:39:12Z" }, { "id": 10, "followedUser_id": 3, "followingUser_id": 2, "created_at": "2025-01-14T13:15:58Z" } ], "profile": { "id": 2, "name": "test1", "user_id": 2, "nickname": "test1", "bio": "just for test", "work": "a worker", "education": "earth", "coding_skill": "go,php", "created_at": "2025-01-06T01:42:58Z" } }, "tags": [ { "id": 1, "name": "javascript", "description": "A confusing fish barely happily fly irritably.", "frequency": 0, "created_at": "2024-12-30T05:10:44Z" }, { "id": 15, "name": "devops", "description": "Lingering flock quietly watch friendly person barely successfully.", "frequency": 0, "created_at": "2024-12-30T05:10:44Z" }, { "id": 23, "name": "api", "description": "A tasty dynasty less violently fly a choir boldly up the talented entertainment extremely fortunately.", "frequency": 0, "created_at": "2024-12-30T05:10:44Z" } ] } }
技术栈:
Web 前端
- React
- Next.js App Router
- NextAuth.js v5
- Chakra UI v2
- SWR
- Axios
后端
- FastSchema
- SQLite (with demo data)
- seeder
开始
要开始这个项目,请运行
后端
git clone https://github.com/vulcangz/fs-blog.git cd fs-blog go mod tidy go run .
在浏览器访问:http://localhost:8000/dash
测试账号
ADMIN: admin/123456 User: test1~test5/123456
管理员登录之后,可以访问文档:http://localhost:8000/docs
Web前端
cd web pnpm i pnpm dev
访问:http://localhost:3000
致谢
- FastSchema for making this possible
- Next.js for making this possible
- MA-Ahmad/dev.to-clone
- Dev Community Clone
- spicy-tomato/tech-blog
- more...
喜欢: