Add blog component.

astro.config.mjs

@@ -1,10 +1,26 @@
-import { defineConfig } from 'astro/config';
 import starlight from '@astrojs/starlight';
+import { defineConfig } from 'astro/config';
+import blog from 'starlight-blog';
 
 // https://astro.build/config
 export default defineConfig({
 	integrations: [
+		blog({
+			authors: {
+				alex: {
+				  name: 'Alex Kontos',
+				  title: 'Founder',
+				  picture: '/alex.jpg', // Images in the `public` directory are supported.
+				  url: 'https://uk.linkedin.com/in/alex-kontos',
+				},
+			}
+		}),
 		starlight({
+			components: {
+				MarkdownContent: 'starlight-blog/overrides/MarkdownContent.astro',
+				Sidebar: 'starlight-blog/overrides/Sidebar.astro',
+				ThemeSelect: 'starlight-blog/overrides/ThemeSelect.astro',
+			},
 			title: 'My Docs',
 			social: {
 				github: 'https://github.com/withastro/starlight',

package.json

@@ -12,7 +12,8 @@
   "dependencies": {
     "@astrojs/starlight": "^0.11.1",
     "astro": "^3.2.3",
-    "sharp": "^0.32.5"
+    "sharp": "^0.32.5",
+    "starlight-blog": "^0.4.0"
   },
   "devDependencies": {
     "prettier": "^3.0.3",

src/content/config.ts

@@ -1,7 +1,8 @@
+import { i18nSchema } from '@astrojs/starlight/schema';
 import { defineCollection } from 'astro:content';
-import { docsSchema, i18nSchema } from '@astrojs/starlight/schema';
+import { docsAndBlogSchema } from 'starlight-blog/schema';
 
 export const collections = {
-	docs: defineCollection({ schema: docsSchema() }),
+	docs: defineCollection({ schema: docsAndBlogSchema }),
 	i18n: defineCollection({ type: 'data', schema: i18nSchema() }),
 };

src/content/docs/blog/first.md

@@ -0,0 +1,9 @@
+---
+author: Alex
+date: 2023-07-24
+title: My first blog post
+---
+
+## Hello
+
+Hello world!