docs: update readme and posts
This commit is contained in:
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: 'Introducing Tailwind Nexjs Starter Blog'
|
||||
date: '2021-01-12'
|
||||
lastmod: '2021-06-09'
|
||||
lastmod: '2021-07-11'
|
||||
tags: ['next-js', 'tailwind', 'guide']
|
||||
draft: false
|
||||
summary: 'Looking for a performant, out of the box template, with all the best in web technology to support your blogging needs? Checkout the Tailwind Nextjs Starter Blog template.'
|
||||
@ -36,18 +36,19 @@ I wanted it to be nearly as feature-rich as popular blogging templates like [bea
|
||||
|
||||
- Easy styling customization with [Tailwind 2.0](https://blog.tailwindcss.com/tailwindcss-v2) and primary color attribute
|
||||
- Near perfect lighthouse score - [Lighthouse report](https://www.webpagetest.org/result/210111_DiC1_08f3670c3430bf4a9b76fc3b927716c5/)
|
||||
- Lightweight, 43kB first load JS, uses Preact in production build
|
||||
- Lightweight, 38kB first load JS, uses Preact in production build
|
||||
- Mobile-friendly view
|
||||
- Light and dark theme
|
||||
- [MDX - write JSX in markdown documents!](https://mdxjs.com/)
|
||||
- Server-side syntax highlighting with [rehype-prism](https://github.com/mapbox/rehype-prism)
|
||||
- Server-side syntax highlighting with line numbers and line highlighting via [rehype-prism-plus](https://github.com/timlrx/rehype-prism-plus)
|
||||
- Math display supported via [KaTeX](https://katex.org/)
|
||||
- Automatic image optimization via [next/image](https://nextjs.org/docs/basic-features/image-optimization)
|
||||
- Flexible data retrieval with [next-mdx-remote](https://github.com/hashicorp/next-mdx-remote)
|
||||
- Flexible data retrieval with [mdx-bundler](https://github.com/kentcdodds/mdx-bundler)
|
||||
- Support for tags - each unique tag will be its own page
|
||||
- Support for multiple authors
|
||||
- Blog templates
|
||||
- Support for nested routing of blog posts
|
||||
- Projects page
|
||||
- SEO friendly with RSS feed, sitemaps and more!
|
||||
|
||||
## Sample posts
|
||||
@ -61,7 +62,7 @@ I wanted it to be nearly as feature-rich as popular blogging templates like [bea
|
||||
|
||||
## Quick Start Guide
|
||||
|
||||
1. `npx degit https://github.com/timlrx/tailwind-nextjs-starter-blog.git`
|
||||
1. JS (official support) - `npx degit https://github.com/timlrx/tailwind-nextjs-starter-blog.git` or TS (community support) - `npx degit timlrx/tailwind-nextjs-starter-blog#typescript`
|
||||
2. Personalize `siteMetadata.json` (site related information)
|
||||
3. Personalize `authors/default.md` (main author)
|
||||
4. Modify `projectsData.js`
|
||||
|
@ -1,6 +1,6 @@
|
||||
---
|
||||
title: 'New features in v1'
|
||||
date: '2021-06-29'
|
||||
date: '2021-07-11'
|
||||
tags: ['next-js', 'tailwind', 'guide']
|
||||
draft: false
|
||||
summary: 'An overview of the new features released in v1 - code block copy, multiple authors, frontmatter layout and more'
|
||||
@ -18,6 +18,10 @@ A post on the new features introduced in v1.0. New features:
|
||||
- [Copy button for code blocks](#copy-button-for-code-blocks)
|
||||
- [Line highlighting and line numbers](#line-highlighting-and-line-numbers)
|
||||
|
||||
First load JS decreased from 43kB to 38kB despite all the new features added!
|
||||
|
||||
See [upgrade guide](#upgrade-guide) below if you are migrating from v0 version of the template.
|
||||
|
||||
## Theme colors
|
||||
|
||||
You can easily modify the theme color by changing the primary attribute in the tailwind config file:
|
||||
@ -55,7 +59,6 @@ For example, the following jsx snippet can be used directly in an MDX file to re
|
||||
|
||||
```js
|
||||
import PageTitle from './PageTitle.js'
|
||||
|
||||
;<PageTitle> Using JSX components in MDX </PageTitle>
|
||||
```
|
||||
|
||||
@ -229,3 +232,36 @@ To modify the styles, change the following class selectors in the `tailwind.css`
|
||||
content: attr(line);
|
||||
}
|
||||
```
|
||||
|
||||
## Upgrade guide
|
||||
|
||||
There are significant portions of the code that has been changed from v0 to v1 including support for layouts and a new mdx engine.
|
||||
|
||||
There's also no real reason to change if the previous one serves your needs and it might be easier to copy
|
||||
the component changes you are interested to your existing blog rather than migrating everything over.
|
||||
|
||||
Nonetheless if you want to do so and have not changed much of the template, you could clone the new version and copy over the blog post instead.
|
||||
|
||||
Another alternative would be to pull the latest tempate version with the following code:
|
||||
|
||||
```bash
|
||||
git remote add template git@github.com:timlrx/tailwind-nextjs-starter-blog.git
|
||||
git pull template v1 --allow-unrelated-histories
|
||||
rm -rf node_modules
|
||||
```
|
||||
|
||||
You can see an example of such a migration in this [commit](https://github.com/timlrx/timlrx.com/commit/bba1c185384fd6d5cdaac15abf802fdcff027286) for my personal blog.
|
||||
|
||||
v1 also uses `feed.xml` rather than `index.xml`. If you are migrating you should add a redirect to `next.config.js` like so:
|
||||
|
||||
```
|
||||
async redirects() {
|
||||
return [
|
||||
{
|
||||
source: '/:path/index.xml',
|
||||
destination: '/:path/feed.xml',
|
||||
permanent: true,
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
Reference in New Issue
Block a user