Tailwind UI:网站模板和全访问权限

Adam Wathan
Tailwind CSS Templates

在我编程生涯早期,我非常喜欢关注 thoughtbot。他们总是写一些有趣的编程文章,制作出色的教学视频,并发布令人惊叹的书籍。我能感觉到他们真的很在乎自己的技术,这对我极具启发性。

但是当他们推出 Upcase时,我最兴奋的并不是课程或每周的视频。我最兴奋的是Upcase本身的源代码——实际上正在生产环境中运行的Rails代码库,你在订阅时就可以访问它。

我已经从博客文章、书籍和截屏视频中学到了很多,但我仍然渴望有机会深入研究由我信任的人编写的真实代码库,并研究他们如何将所有这些知识整合在一起,构建一个可用于生产环境的应用。

🌐 I'd learned a ton from blog posts, books, and screencasts, but I still craved the chance to dig into a real-world codebase crafted by people I trust and study how they put all that knowledge together to build a production-ready application.

那段经历对我来说是一次蜕变,所以很长一段时间以来,我一直想为大家提供类似的体验,让他们学习如何使用 Tailwind CSS 构建真实的网站。

🌐 That experience was transformative for me, and so for a long time I've wanted to give people something like it to learn how real websites are built with Tailwind CSS.

一个布局是如何被分解成组件的,这些组件暴露了哪些类型的 API,配置是如何被自定义的——所有这些有趣的决策在你仅仅在浏览器中点击 查看源代码 时都是看不到的。

🌐 How a layout is broken down into components, what sort of APIs those components expose, how the config has been customized — all of the interesting decisions that you can't see when you just click view source in the browser.

所以今天我们发布了第一批官方 Tailwind CSS 网站模板——美观的设计被打造进生产级代码库,由 Tailwind CSS 和 Next.js 提供支持。

我们从三月份就开始设计这些功能了,现在我很高兴能将这五个功能发布出来,方便大家查看和使用:

🌐 We started designing these way back in March and I'm really excited to get these first five out the door so you can check them out and start playing with them:

  • 语法 — 一个由 Stripe 新的 Markdoc 库提供支持的文档网站模板,非常适合开源项目或产品文档等用途。
  • Primer — 一个电子书和课程的着陆页模板,内置了我们在发布自有信息产品时学到的许多最佳实践。
  • Salient — 一个令人惊叹但简洁的SaaS营销网站,你可以快速将其适配到你的下一个创意上,而无需浪费本应用于实际产品上的宝贵时间。
  • Keynote —— 一个精美的会议网站设计,无论是小型本地聚会还是国际性活动都同样适用。
  • Transmit — 一个很棒的播客模板,带有自定义的持久音频播放器,你可以快速将其连接到自己的 RSS 订阅源。

我们在设计和代码上投入了大量时间和精力,一切结构都完全按照我们在实际生产项目中的方式来做。当你不想从零开始时,它们是完美的起点,也是学习专家如何使用 Tailwind CSS 构建现代网站的最佳方式。

🌐 We've put a ton of time and attention into both the design and the code, and everything is structured exactly the way we'd do it in a real production project. They're the perfect starting point when you don't want to start from a blank canvas, and the best way to learn how experts build modern websites with Tailwind CSS.

Code Structure

每个模板可以单独购买,价格为 $99,或者你可以通过 全套通行获取全部模板——这是我们今天推出的新套餐 终身获取我们未来添加的所有内容


全力以赴,开放所有访问权限(Going all in on all-access)

当我们开始制作模板时,我非常确定的一件事就是,我希望能够轻松获取到所有模板。

🌐 When we started working on templates, one of the things I was really sure about is that I wanted it to be easy to get access to all of them.

这对我来说很重要,原因有二:

🌐 This was important to me for two reasons:

  1. 我希望人们把我们的模板更多地看作教育资源,而不是传统的网站主题。我们制作的每一个模板都有其独特的学习时刻,我不希望人们必须在学习的内容上有所取舍。
  2. 我不想每个模板都去考虑投资回报率。没有什么比必须确保每个模板都能迎合大众更扫兴的了。我希望我们有自由去制作一些有趣的小众作品,探索有趣的创意,而不仅仅是那些本身就能卖出足够拷贝以证明我们投入工作的模板。

小时候,我去过法国的一个音乐节,那里有将近一百支乐队表演。有几支乐队我非常喜欢,知道他们的每一首歌,哪天都愿意买票去看他们的演出。

不过他们大多数都是我非常喜欢的乐队,但我不会为了看他们的演出开90分钟的车去。但把他们全部安排在同一场演出中让我买了去巴黎的机票,体验了我人生中最美好的经历之一。

🌐 Most of them though were bands I really liked, but wouldn't have made the 90 minute drive to make it out to a show. But putting all of them on a bill together got me to buy a plane ticket to Paris, and have one of the best experiences of my life.

我希望 Tailwind UI 感觉就像一个音乐节,你可以从一个舞台漫步到另一个舞台,欣赏一两首你从未听说过的乐队的歌曲,偶尔还会被一场你原本可能永远不会去观看的表演所震撼。

🌐 I want Tailwind UI to feel like a music festival, where you can wander from stage to stage, enjoy a song or two from a band you've never heard of, and once in a while be blown away by a performance you would have never otherwise bothered to check out.

所以我们正在为 Tailwind UI 推出一个新的 全访问套餐,该套餐包括对现有的每一个模板和组件包的访问权限,以及未来我们添加的任何新内容。

Get Tailwind UI all-access

这是一次性购买,价格为 299 美元。没有订阅,没有升级费用——如果我们向 Tailwind UI 添加了新内容,它将永久属于你。

🌐 It's a one-time purchase of $299. No subscription, no upgrade costs — if we add something new to Tailwind UI, it's yours, forever.

如果你已经拥有 Tailwind UI 中的所有内容,我们已经免费为你升级到了全访问权限

🌐 And if you already own everything in Tailwind UI, we've upgraded you to all-access for free.


好了,这就是我们过去几个月一直在努力完成的所有内容!

🌐 So there you have it — that's everything we've been working on for the last few months!

我们已经在开发一系列新模板,并且正在积极地从这些模板中提取许多组件创意,将其转化为新的示例,以纳入市场营销、应用 UI 和电子商务组件类别。

🌐 We've got a bunch of new templates in the works already, and we're actively working on extracting a lot of the component ideas from these templates into new examples to include in the Marketing, Application UI, and Ecommerce component categories.

这是我在使用这些网站模板时最喜欢的事情之一 - 使用 Tailwind 构建现实世界的东西是我们提出新组件想法的最佳方式,也是找到改进 Tailwind CSS 和 Headless UI 的方法的最佳方式。

🌐 That's one of my favorite things about working on these site templates — building real-world stuff with Tailwind is the best way for us to come up with new component ideas, and to find ways to improve both Tailwind CSS and Headless UI too.

期待未来几个月 Tailwind UI 的众多新特性!

🌐 Look forward to lots of new Tailwind UI stuff in the coming months!

TailwindCSS 中文网 - 粤ICP备13048890号