Next.js 是一套 React 体系的 SSR (服务端渲染)方案,现在很多前端网站实际上是 SPA (单页应用),就只有一个 index.html ,然后附带一个很大的 js 来实现页面渲染和交互,这种小规模的网站还好,网站越大速度就越慢,所以说技术这个车轮又滚回去了,当初被「前后端分离」那帮人嫌弃的后端渲染又回来了,React 有 ne...
距离上次更新已经过去好久了,之前我在 StarBlog 博客2023年底更新一览的文章里说要使用 Next.js 来重构博客前端,最近也确实用 next.js 做了两个小项目,一个是单点认证项目,另一个是网站的新主页,都还处于开发中,本文记录一下 next.js 使用过程遇到的一些问题和感受。 对了,还有标题里提到的 tailwind ,我去年...
总体感觉,使用Next.js搭配tailwindcss是非常不错的选择。特色适合那些使用React的非专业前端,做一些非企业级的网站,比如像我的微言码道这样的网站。 相比较hexo或hugo这样的博客生成工具来说,基于Next.js以及tailwindcss打造一个网站,更像是亲手打造一个艺术品,虽然都需要自己来实现很多功能,但它能让你精雕细琢。做...
前端框架:Next.js UI 组件:Tailwind CSS, Shadcn UI AI 集成:Anthropic Claude API, Anthropic Claude API Keys 1 Next.js 1.1 Initialization 1. For the installation,
大神dan的博客相信大家都看过,博客质量那是不用多说,懂的都懂。 说到博客样式,我比较喜欢这种简约风。其中博客中还支持组件交互效果。 所以我决定用 Nextjs + tailwindcss 实现一模一样的博客学习下。 效果预览:点我看效果 技术选型: Nextjs tailwindcss ...
3、jwt 模式: just-in-time 模式,可以写出在原子类之外的样式,比如:w-[762px]表示width:762px,grid-cols-[1fr,700px,2fr]表示grid-template-columns: 1fr 700px 2fr;当然还有h-[calc(1000px-4rem)]等等,这些都是运行时才生成的样式;配合在tailwind.config.js中加入purge: ['./src/**/*.{js,ts,js...
我又抽时间优化了下用户体验,又发现SPA应用又不利于SEO优化,正好这阶段自己又有学习Next.js14的想法,正好可以以此参考进行重构学习。 🪴 项目信息 😝项目预览:https://hot.baiwumm.com/ 🎯技术栈:React、Next.js、Tailwindcss、NextUI 🚀github 仓库地址:next-daily-hot ...
下一期课程我们粗估了一下,大概有30+基础课与20+进阶课,按网站开发顺序一Part一Part发上来,届时会在课程的后半段讲到。相关课程博客请复制网址并粘贴到地址栏查看:https://rainydesign.cn/blog/tutorial-of-nextjs-strapi-tailwind-css,目前先更新个大纲,内容正在按照顺序生产了,敬请期待哦。
大神dan的博客相信大家都看过,博客质量那是不用多说,懂的都懂。 说到博客样式,我比较喜欢这种简约风。其中博客中还支持组件交互效果。 所以我决定用 Nextjs + tailwindcss 实现一模一样的博客学习下。 效果预览:点我看效果 技术选型: Nextjs tailwindcss ...
在本课程中,您将学习Next.js和Tailwind CSS。你将建立一个完整的前端电子商务项目。您将在本课程中学习的主要功能是:如何使用Next.js并组织Next.jss项目。如何使用Tailwind CSS并将其与Next.js项目集成。如何使用Tailwind CSS创建一个完整的响应式电子商务应用程序。您将完全了解如何从头到尾创建Next.js前端项目。在...