Create account

DEV Community

Timo

Posted on May 5, 2022 • Edited on May 9, 2022

Markdown blog with Appwrite connection

#appwritehack #markdown #nextjs #typescript

Overview of My Submission

I wanted to learn NextJS for a longer time now and started the development of a concept of a markdown blog. When the team of appwrite and dev.to came up with this hackathon I decided to participate by adding an appwrite functionality to this blog. My idea was to store the mdx files, which are originally stored in the posts directory, in the appwrite storage database. I am programming for nearly a month now and it's finally done. You just need an appwrite container and my markdown-blog image containerized. Additional information about configuration and setup can be found in the README.md

On the technological hand I am using NextJS with dynamic frontend rendering, next-MDX-remote for mdx parsing and TailwindCss for styling.

Submission Category:

Web2 Wizards

Link to Code

tim0-12432 / markdown-blog

Markdown blog

Markdown Blog

Motivation

I wanted to learn NextJS for a few months. Now the time have come and I created a server for displaying markdown blog posts. So this is my first project using NextJS.

When noticing the new appwrite hackathon, I decided to add a feature to store your markdown post files in a appwrite database.

Installation and usage

Prerequisites

If you are planning to add posts via the Appwrite Database capability, you need to have a Appwrite instance running on your local machine or on a server.

Files should be stored in a bucket in the storage and their ids must match the file name in order to be found!

Configuration

configuration.json in config
- Example AppwriteDB

    "appwriteDatabase": {
        "url": {
            "host": "localhost"
            "port": 3000
        },
        "projectId": "YOUR_PROJECT_ID",
        "postBucketId": "YOUR_POST_BUCKET_ID",
        "apiKey": "YOUR_API_KEY