+
Credits to [Alex for this fantastic meme](https://twitter.com/alexdotjs/status/1465975816370728963)
@@ -186,7 +188,7 @@ The goal here is to use the types of your `getServerSideProps` function as a sou
As happy I am to know this exists, I've already ran into some painful edges with Next's provided `InferGetServerSidePropsType`
-- It [overrides inferable types](https://t3.gg/images/next-typesafety/infer-props-fail-1.png) as `{[key: string]: any}` generic objects if you cast function as `GetServerSideProps` w/o also manually assigning a type
+- It [overrides inferable types](./images/infer-props-fail-1.png) as `{[key: string]: any}` generic objects if you cast function as `GetServerSideProps` w/o also manually assigning a type
- It infers to `props: never` if you [don't specify input types as it expects](https://github.com/vercel/next.js/issues/15913)
To use this correctly, I had to have decent familiarity with Next's internal typings and read through [this GitHub issue thoroughly](https://github.com/vercel/next.js/issues/15913). Even with that prerequisite, I found it shockingly easy to accidentally return a non-implicit `any` type, which _does not throw any errors under the provided Next.js `tsconfig`_ .
diff --git a/public/images/announcing-ping/twitter.png b/src/content/posts/active/2022/announcing-ping/images/twitter.png
similarity index 100%
rename from public/images/announcing-ping/twitter.png
rename to src/content/posts/active/2022/announcing-ping/images/twitter.png
diff --git a/src/content/posts/announcing-ping.md b/src/content/posts/active/2022/announcing-ping/index.md
similarity index 95%
rename from src/content/posts/announcing-ping.md
rename to src/content/posts/active/2022/announcing-ping/index.md
index de31986..a920be6 100644
--- a/src/content/posts/announcing-ping.md
+++ b/src/content/posts/active/2022/announcing-ping/index.md
@@ -1,8 +1,10 @@
---
title: "Why We're Building Ping"
+slug: "announcing-ping"
date: "2022-01-11"
description: "Streaming with your friends is way too difficult. We're going to fix it. What if Zoom was built for streamers? 🤔"
-imageURL: "https://t3.gg/images/announcing-ping/twitter.png"
+cover: ./images/twitter.png
+coverAlt: "Ping announcement graphic"
readMore: true
---
@@ -18,7 +20,7 @@ After collective decades of dealing with these problems, we’re building soluti
Introducing our first creator-focused tool, [Ping](https://ping.t3.gg).
-[
](https://ping.t3.gg)
+[](https://ping.t3.gg)
Have you ever tried streaming with your friends before? If you have, then you know it’s one of the most painful processes in content creation. Interaction is the life blood of live content, and the tools to interact with your friends live are rough.
diff --git a/public/images/ping-1.0.png b/src/content/posts/active/2022/dream-job-revisited/images/ping-1.0.png
similarity index 100%
rename from public/images/ping-1.0.png
rename to src/content/posts/active/2022/dream-job-revisited/images/ping-1.0.png
diff --git a/src/content/posts/dream-job-revisited.md b/src/content/posts/active/2022/dream-job-revisited/index.md
similarity index 96%
rename from src/content/posts/dream-job-revisited.md
rename to src/content/posts/active/2022/dream-job-revisited/index.md
index 19f6518..0dae64d 100644
--- a/src/content/posts/dream-job-revisited.md
+++ b/src/content/posts/active/2022/dream-job-revisited/index.md
@@ -1,8 +1,10 @@
---
title: "I'm So Happy I Quit My Dream Job"
+slug: "dream-job-revisited"
date: "2022-06-30"
description: "It's been a wild 9 months."
-imageURL: "https://t3.gg/images/ping-1.0.png"
+cover: ./images/ping-1.0.png
+coverAlt: "Ping 1.0 branding"
readMore: true
---
@@ -73,7 +75,7 @@ We can.
## Ping.gg 1.0 Launches Today, Starting at $16
-
+
+
+
+ {archivedPosts.length === 0 ? (
+
+archived posts
++ these posts keep their URLs but no longer show up in the main feed. +
+no archived posts yet.
+ ) : ( +
+ {archivedPosts.map((post) => (
+
+ )}
+ thoughts on tech and content. usually goes to twitter, sometimes here.
+ + rss + + + archive +
diff --git a/src/pages/blog/post/[slug].astro b/src/pages/blog/post/[slug].astro
index c2bf082..9200412 100644
--- a/src/pages/blog/post/[slug].astro
+++ b/src/pages/blog/post/[slug].astro
@@ -1,27 +1,60 @@
---
import BaseLayout from "../../../layouts/BaseLayout.astro";
import BlogPostHeader from "../../../components/BlogPostHeader.astro";
-import { getSlugFromPath } from "../../../utils/get-slug-from-path";
+import { getCollection, render } from "astro:content";
-export async function getStaticPaths({ paginate, rss }) {
- const allPosts = await Astro.glob("../../../content/posts/*.md");
+export async function getStaticPaths() {
+ const posts = await getCollection(
+ "posts",
+ ({ data }) => !data.hidden && !data.draft,
+ );
- const paths = allPosts.map((post) => {
- const slug = getSlugFromPath(post.file);
- return {
- params: {
- slug,
- },
- props: { post },
- };
- });
+ const paths: Array<{
+ params: { slug: string };
+ props: { post: (typeof posts)[number]; canonicalSlug: string; isAlias: boolean };
+ }> = [];
+
+ for (const post of posts) {
+ const canonicalSlug = post.id;
+
+ paths.push({
+ params: { slug: canonicalSlug },
+ props: { post, canonicalSlug, isAlias: false },
+ });
+
+ const aliases = post.data.slugAliases ?? [];
+ for (const alias of aliases) {
+ if (!alias || alias === canonicalSlug) continue;
+ paths.push({
+ params: { slug: alias },
+ props: { post, canonicalSlug, isAlias: true },
+ });
+ }
+ }
return paths;
}
-const { post } = Astro.props;
-const title = post.frontmatter.title;
-const description = post.frontmatter.description;
+const { post, canonicalSlug, isAlias } = Astro.props;
+const { Content } = await render(post);
+
+const title = post.data.title;
+
+const fallbackDescription = post.body
+ .replace(/```[\s\S]*?```/g, " ")
+ .replace(/<[^>]+>/g, " ")
+ .replace(/[#*_>`~\-!\[\]\(\)]/g, " ")
+ .replace(/\s+/g, " ")
+ .trim()
+ .slice(0, 160);
+
+const description =
+ post.data.description ??
+ fallbackDescription ??
+ "Thought dumps and nerdy stuff";
+
+const ogImage = post.data.cover ?? post.data.imageURL;
+const canonicalPath = `/blog/post/${canonicalSlug}`;
const backToLink = {
text: "blog",
@@ -29,11 +62,45 @@ const backToLink = {
};
---
-
-
+{
+ isAlias ? (
+
+
+ ) : (
+
+
+ )
+}
diff --git a/src/pages/rss.xml.ts b/src/pages/rss.xml.ts
new file mode 100644
index 0000000..e0294bd
--- /dev/null
+++ b/src/pages/rss.xml.ts
@@ -0,0 +1,36 @@
+import rss from "@astrojs/rss";
+import { getCollection } from "astro:content";
+
+const BLOG_DESCRIPTION = "Thought dumps and nerdy stuff";
+
+const toExcerpt = (body: string): string =>
+ body
+ .replace(/```[\s\S]*?```/g, " ")
+ .replace(/<[^>]+>/g, " ")
+ .replace(/[#*_>`~\-!\[\]\(\)]/g, " ")
+ .replace(/\s+/g, " ")
+ .trim()
+ .slice(0, 200);
+
+export async function GET(context: { site: URL | undefined }) {
+ const posts = await getCollection(
+ "posts",
+ ({ data }) => !data.hidden && !data.draft && !data.archived,
+ );
+
+ const sortedPosts = posts.sort(
+ (a, b) => b.data.date.valueOf() - a.data.date.valueOf(),
+ );
+
+ return rss({
+ title: "Theo's Blog",
+ description: BLOG_DESCRIPTION,
+ site: context.site ?? new URL("https://t3.gg"),
+ items: sortedPosts.map((post) => ({
+ title: post.data.title,
+ description: post.data.description ?? toExcerpt(post.body),
+ pubDate: post.data.date,
+ link: `/blog/post/${post.id}`,
+ })),
+ });
+}
diff --git a/src/style/global.css b/src/style/global.css
index 781ee6c..b6c8033 100644
--- a/src/style/global.css
+++ b/src/style/global.css
@@ -219,6 +219,20 @@ pre[class*="language-"] {
font-style: italic;
}
+/* Blog prose image defaults */
+.prose :where(picture):not(:where([class~="not-prose"] *)) {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.prose :where(img):not(:where([class~="not-prose"] *)) {
+ margin-left: auto;
+ margin-right: auto;
+ border-radius: 0.75rem;
+ border: 1px solid color-mix(in srgb, white 8%, transparent);
+}
+
.token.entity {
cursor: help;
}
diff --git a/src/utils/get-slug-from-path.ts b/src/utils/get-slug-from-path.ts
deleted file mode 100644
index e039d01..0000000
--- a/src/utils/get-slug-from-path.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export const getSlugFromPath = (path: string): string => {
- return path.split("/").at(-1).replace(".md", "");
-};
-
-
-
-
+
+ + Redirecting to the canonical URL.{" "} + Continue +
+ +
+
+
+
+