Add press-react video

ServiceStack · Mar 5, 2024 · 10bbff2 · 10bbff2
1 parent c5d18f2
commit 10bbff2
Show file tree

Hide file tree

Showing 7 changed files with 26 additions and 17 deletions.
diff --git a/src/_videos/react/autogen-locode.md b/src/_videos/react/autogen-locode.md
@@ -3,7 +3,7 @@ title: Database first development with Locode
 url: https://youtu.be/NiTp5Z_5U2Y
 tags: [autoquery,autogen,locode]
 date: 16-05-2022
-order: 3
+order: 4
 ---
 
 In this video we show a step by step process for start with an existing database and customizations without the need for code first models.

diff --git a/src/_videos/react/autoquery-bookings.md b/src/_videos/react/autoquery-bookings.md
@@ -3,7 +3,7 @@ title: Build a Bookings API with Auto Admin UI in minutes
 url: https://youtu.be/rSFiikDjGos
 tags: [autoquery]
 date: 16-08-2022
-order: 2
+order: 4
 ---
 
 From an empty web project, this video shows how to:

diff --git a/src/_videos/react/modern.md b/src/_videos/react/modern.md
@@ -3,7 +3,7 @@ title: Modern Razor Pages & MVC .NET Tailwind templates
 url: https://youtu.be/SyppvQB7IPs
 tags: [vue,razor]
 date: 08-02-2023
-order: 4
+order: 5
 ---
 
 ServiceStack templates provide a wide range of options when it comes to using Razor Pages in your .NET application

diff --git a/src/_videos/react/nextjs.md b/src/_videos/react/nextjs.md
@@ -3,7 +3,7 @@ title: Rapidly develop C# .NET Next.js JamStack Apps with Rider
 url: https://youtu.be/3pPLRyPsO5A
 tags: [nextjs,react,jamstack]
 date: 08-02-2022
-order: 1
+order: 2
 ---
 
 In this comprehensive walkthrough, we will guide you through the ServiceStack Next.js template, which offers an 

diff --git a/src/_videos/react/press-react.md b/src/_videos/react/press-react.md
@@ -0,0 +1,12 @@
+---
+title: Vite React Markdown Websites with Vite Press Plugin
+url: https://youtu.be/S6O8QCaXDG0
+tags: [react,vite,markdown]
+date: 07-03-2024
+order: 1
+---
+
+In this video, we will show how you can use the `press-react` template to create a beautiful React and Markdown 
+static blog or content centric Websites that's easy to manage and add content. It utilizes the vite-plugin-press library 
+whose Markdown feature folders give you a consistent way of using markdown pages to create blogging, marketing landing 
+pages and other content heavy websites.
diff --git a/src/_videos/react/razor-ssg.md b/src/_videos/react/razor-ssg.md
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -5,6 +5,7 @@ import GettingStarted from "@/components/GettingStarted"
 import Include from "@/components/Include"
 import VideoGroup from "@/components/VideoGroup"
 import SrcPage from "@/components/SrcPage"
+import LiteYouTube from "@/components/LiteYouTube"
 import { generateSlug, dateLabel, dateTimestamp } from "@/utils"
 import { PressContext } from "@/contexts"
 import { useContext } from "react"
@@ -62,6 +63,15 @@ const Index = () => {
                 </div>
             </section>
 
+            <div className="relative">
+                <div className="mt-8 max-w-6xl mx-auto">
+                    <div className="aspect-w-16 aspect-h-9 pb-0">
+                        <LiteYouTube id="WXLF0piz6G0" poster="maxresdefault"
+                                     title="Vite React Markdown Websites with Vite Press Plugin"/>
+                    </div>
+                </div>
+            </div>
+
             <div className="container mx-auto px-5 mt-24 mb-24">
                 {!primaryPost ? null : <section>
                     <div className="mb-8 md:mb-16">