然后第一步我们完成头部导航。我们第一步需要安装next-theme,然后创建layout组件,创建header组件,创建暗黑模式切换组件(modeToogle),切换组件我们使用点击切换,所以需要使用到了shadcn/ui 里面的dropdown-menu组件。 #切换到web目录,首先添加next-theme包pnpminstallnext-themes-S#然后添加shadcn/ui的dropdown-menupnpmd...
Admin Dashboard built with Next.js 14 + TypeScript + Shadcn ui next-shadcn-admin-dashboard.vercel.app Topics typescript nextjs react-boilerplate admin-dashboard tailwindcss zod nextjs-boilerplate react-query react-hook-form next-admin shadcn-ui shadcn-ui-starter shadcn-admin tenstack sh...
我们先搞定最常规的布局,shadcn/ui 的构建块 中有一些常规的布局,我一下就看重这个: 左侧是 slibar,菜单顶部可以放 Logo 和标题 右侧顶部放用户头像和一些操作按钮,比如:面包屑、暗黑模式、全屏、消息通知等 中间就是业务模块,底部放版权信息 业务代码 1、 新增 src/components/AppSideBar/index.tsx 文件: 代码...
refactor: 新增 shadcn/ui 组件库,重构排版布局 4个月前 tailwind.config.ts perf: nextui 迁移到 heroui 2个月前 tsconfig.json style(eslint): 配置 eslint 等相关规则 4个月前 README Next Admin 挖掘发现 Next.js 的乐趣所在 ☘️ 项目简介 ...
如果你正在考虑构建一个SaaS(软件即服务)应用程序,那么Next.js SaaS Starter是一个非常合适的起点。它结合了Next.js的强大功能、Postgres数据库、Stripe支付系统以及Shadcn/ui用户界面库,为开发者提供了一个完整的模板,助力你快速启动项目。 项目核心功能
Next.js 14 Admin Dashboard Starter Template With Shadcn-ui Built with the Next.js App Router View Demo Overview This is a starter template using the following stack: Framework - Next.js 14 Language - TypeScript Styling - Tailwind CSS Components - Shadcn-ui Schema Validations - Zod State ...
UI Library:shadcn/ui Getting Started git clone https://github.com/nextjs/saas-startercdsaas-starter pnpm install Running Locally Use the included setup script to create your.envfile: pnpm db:setup Then, run the database migrations and seed the database with a default user and team: ...
[Traversy Media] Admin Dashboard From Scratch - Next.js, TypeScript, Shadcn/ui12 0 2024-06-05 04:16:00 您当前的浏览器不支持 HTML5 播放器 请更换浏览器再试试哦~点赞 投币 1 分享 https://www.youtube.com/watch?v=hhudoSMM0yU 知识 校园学习 课程 教学 编程 JS YouTube Web Traversy...
进入apps/cms的目录,拷贝一下src/admin/app.example.tsx文件为app.tsx,然后再配置那里把中文简体的配置打开注释,你的文件就像下面一样 把cms的develop命令改成dev,然后启动看一下,pnpm run dev 这个时候我们会看到启动报错,遇到困难别怕,看一下报错提示,File '@strapi/typescript-utils/tsconfigs/server' not fou...
Next Admin 挖掘发现 Next.js 的乐趣所在 ☘️ 项目简介 Next Admin 是一个基于 Next.js15 从0 到 1 构建的后台应用程序模板,目的在于学习和探索 Next.js15. 🍁 技术栈: Next.js15、NextUI、TailwindCSS、PostgreSQL、Prisma 🍂 线上预览: https://next.baiwumm.com/ 🪹 github 仓库地址 ...