feat: prep for collabs and edit popup

CONTRIBUTING.md

@@ -0,0 +1,128 @@
+# Contributing to reactive.so
+
+Thank you for considering contributing to Reactive! I started this project to support students who may live far from campus or lack the opportunity to be on campus as frequently as typical students. These students might miss out on the "peer-to-peer" learning experience that many others benefit from. I truly appreciate your efforts in helping this project grow and improving the content. Please read through the following guidelines to make the contribution process smooth for everyone involved.
+
+## Table of Contents
+
+- [How Can I Contribute?](#how-can-i-contribute)
+  - [Reporting Bugs](#reporting-bugs)
+  - [Suggesting Enhancements](#suggesting-enhancements)
+  - [Editing an Existing Blog](#editing-an-existing-post)
+  - [Adding a New Blog](#adding-a-new-post)
+- [Getting Started](#getting-started)
+  - [Forking the Repository](#forking-the-repository)
+  - [Setting Up Your Environment](#setting-up-your-environment)
+- [Submitting a Pull Request](#submitting-a-pull-request)
+- [Code Style Guidelines](#code-style-guidelines)
+- [Commit Messages](#commit-messages)
+- [Community Guidelines](#community-guidelines)
+
+## How Can I Contribute?
+
+### Reporting Bugs
+
+If you encounter any issues or bugs, please open a new issue in the [Issues](https://github.com/herbievine/reactive.so/issues) section. Provide as much detail as possible, including steps to reproduce the bug, and any relevant screenshots.
+
+### Suggesting Enhancements
+
+We welcome suggestions for new features or improvements. To propose an enhancement, please open a new issue and describe your idea in detail.
+
+### Editing an Existing Post
+
+If you find any mistakes or areas for improvement in our existing blogs, feel free to make edits. Here’s how you can do it:
+
+1. Fork the repository.
+2. Locate the blog file you wish to edit in the `src/content/posts` directory.
+3. Make your changes.
+4. Submit a pull request (PR) with a clear explanation of your changes.
+
+### Adding a New Post
+
+We encourage you to share your knowledge with the community by writing a new blog post. Follow these steps:
+
+1. Fork the repository.
+2. Create a new file in the `src/content/posts` directory using the format `post-slug.mdx`.
+3. Write your post in MDX. Ensure it’s well-structured, informative, and adheres to our [Code Style Guidelines](#code-style-guidelines).
+4. Submit a PR with your post.
+
+## Getting Started
+
+### Forking the Repository
+
+1. Go to the [repository](https://github.com/herbievine/reactive.so).
+2. Click the “Fork” button in the upper right corner of the page.
+3. Clone your forked repository to your local machine:
+
+```bash
+git clone https://github.com/YOUR-USERNAME/reactive.so.git
+```
+
+### Setting Up Your Environment
+
+Ensure you have the following tools installed:
+
+- [Node.js](https://nodejs.org/)
+- [Git](https://git-scm.com/)
+
+To set up the project:
+
+1. Navigate to the project directory:
+
+```bash
+cd reactive
+```
+
+2. Install the dependencies:
+
+```bash
+npm install
+```
+
+You are now ready to contribute!
+
+## Submitting a Pull Request
+
+1. Ensure your fork is up-to-date with the main repository:
+
+```bash
+git fetch upstream
+git merge upstream/main
+```
+
+2. Create a new branch for your feature or bugfix:
+
+```bash
+git checkout -b feature/your-feature-name
+```
+
+3. Commit your changes:
+
+```bash
+git commit -m "Add/Edit blog post: your-blog-title"
+```
+
+4. Push your branch:
+
+```bash
+git push origin feature/your-feature-name
+```
+
+5. Submit a PR to the `main` branch of the original repository.
+
+## Code Style Guidelines
+
+- **Markdown**: Follow [Markdown best practices](https://www.markdownguide.org/basic-syntax/).
+- **Code**: Use consistent indentation (2 spaces) and meaningful variable names in code snippets.
+- **Content**: Ensure your content is clear, concise, and free of typos. Include headings, bullet points, and code blocks where appropriate.
+
+## Commit Messages
+
+To maintain a clean and consistent Git history, we use [Commitizen](https://commitizen-tools.github.io/commitizen/) for our commit messages. Commitizen helps automate the process of writing commit messages that adhere to the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification.
+
+## Community Guidelines
+
+- **Be Respectful**: Maintain a welcoming and inclusive environment.
+- **Collaborate**: Be open to feedback and constructive criticism.
+- **Ask Questions**: If you’re unsure about something, don’t hesitate to ask.
+
+Thank you for contributing to Reactive! Your efforts make this project better for everyone.

src/content/config.ts

@@ -1,10 +1,17 @@
 import { defineCollection, z } from "astro:content";
 
+const person = z.object({
+  name: z.string(),
+  url: z.string().url(),
+});
+
 const blog = defineCollection({
   type: "content",
   schema: z.object({
     title: z.string(),
     description: z.string(),
+    author: person,
+    contributors: person.array(),
     tage: z.string().array(),
     createdAt: z.coerce.date(),
     updatedAt: z.coerce.date(),

src/content/posts/42-a-comprehensive-guide-to-cub3d.mdx

@@ -1,6 +1,8 @@
 ---
 title: "42: A Comprehensive Guide to Cub3D"
 description: "A comprehensive guide to the Cub3D project from 42."
+author: { name: "Herbie Vine", url: "https://herbievine.com" }
+contributors: []
 tags: ["42", "cub3d", "raycasting", "graphics", "guide", "tutorial"]
 createdAt: 2024-03-31
 updatedAt: 2024-05-20

src/content/posts/42-a-comprehensive-guide-to-pipex.mdx

@@ -1,6 +1,8 @@
 ---
 title: "42: A Comprehensive Guide to Pipex"
 description: "A comprehensive guide to the Pipex project from 42."
+author: { name: "Herbie Vine", url: "https://herbievine.com" }
+contributors: []
 tags: ["42", "pipex", "unix", "linux", "c", "guide", "tutorial"]
 createdAt: 2023-04-21
 updatedAt: 2023-04-28

src/content/posts/42-a-comprehensive-guide-to-so_long.mdx

@@ -1,6 +1,8 @@
 ---
 title: "42: A Comprehensive Guide to So Long"
 description: "A deep dive into the 42 project so_long, including the MLX library, parsing, and error handling."
+author: { name: "Herbie Vine", url: "https://herbievine.com" }
+contributors: []
 tags: ["42", "so_long", "unix", "linux", "c", "guide", "tutorial", "mlx", "x11"]
 createdAt: 2023-06-01
 updatedAt: 2023-06-01

src/content/posts/streamlining-42-project-management-with-42-cli-and-gh-actions.mdx

@@ -1,6 +1,8 @@
 ---
 title: "Streamlining 42 Project Management with 42 CLI and GitHub Actions"
 description: "A deep dive into the 42 project so_long, including the MLX library, parsing, and error handling."
+author: { name: "Herbie Vine", url: "https://herbievine.com" }
+contributors: []
 tags:
   [
     "42",

src/pages/404.astro

@@ -14,13 +14,7 @@ import Meta from "@/components/meta.astro";
       <div class="w-full flex flex-col space-y-4">
         <p>Sorry, we couldn't find the content you were looking for :(</p>
 				<a href="/">Go back home</a>
-        <!-- <Feedback source={post.slug} />
-        <Render code={post.body.code} />
-        <Feedback source={post.slug} /> -->
       </div>
     </main>
-    {/* <Analytics />
-    <PenkleAnalytics domain="reactive.so" />
-    <SpeedInsights /> */}
   </body>
 </html>

src/pages/post/[...slug].astro

@@ -30,29 +30,54 @@ const { Content } = await post.render();
       <div class="w-full flex flex-col space-y-6">
         <div class="w-full flex flex-col space-y-2">
           <h1 class="text-2xl font-semibold">
-            <!-- <Balancer> -->
-              {post.data.title}
-            <!-- </Balancer> -->
+            {post.data.title}
           </h1>
-          <div class="flex items-center space-x-2">
-            <p class="text-sm font-bold text-neutral-500">
+          <div class="flex items-center flex-wrap text-sm font-semibold text-neutral-500">
+            <span>
               <time datetime={dayjs(post.data.createdAt).format("YYYY-MM-DD")}>
                 {dayjs(post.data.createdAt).format("DD/MM/YYYY")}
               </time>
-            </p>
-            <div class="w-full h-0.5 bg-neutral-300 dark:bg-neutral-700" />
+            </span>
+            <span>&nbsp;•&nbsp;</span>
+            <address class="whitespace-nowrap not-italic underline">
+              <a href={`${post.data.author.url}?ref=reactive.so`} target="_blank" rel="noopener noreferrer">
+                {post.data.author.name}
+              </a>
+            </address>
+            {post.data.contributors.length > 0 && (
+              <>
+                <span>&nbsp;with&nbsp;</span>
+                {post.data.contributors.map((contributor, index) => (
+                  <>
+                    <address class="whitespace-nowrap not-italic underline">
+                      <a href={`${contributor.url}?ref=reactive.so`} target="_blank" rel="noopener noreferrer">
+                        {contributor.name}
+                      </a>
+                    </address>
+                    {index < post.data.contributors.length - 2 && <span>,&nbsp;</span>}
+                    {index === post.data.contributors.length - 2 && <span>&nbsp;and&nbsp;</span>}
+                  </> 
+                ))}
+              </>
+            )}
           </div>
         </div>
         <article class="prose prose-neutral dark:prose-invert font-mono">
+          <div class="px-2 py-4 mb-4 border-y border-neutral-300 dark:border-neutral-700">
+            <span>
+              See a typo? See something missing?
+              <a
+                href={`https://github.com/herbievine/reactive.so/edit/main/src/content/posts/${post.slug}.mdx`}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                Open a pull request in GitHub and be featured on this page!
+              </a>
+            </span>
+          </div>
           <Content />
         </article>
-        <!-- <Feedback source={post.slug} />
-        <Render code={post.body.code} />
-        <Feedback source={post.slug} /> -->
       </div>
     </main>
-    {/* <Analytics />
-    <PenkleAnalytics domain="reactive.so" />
-    <SpeedInsights /> */}
   </body>
 </html>