vault backup: 2022-12-12 11:55:00

This commit is contained in:
Matthew Wong 2022-12-12 11:55:00 -05:00
parent a17b445c4f
commit d58103d5e1
8 changed files with 61 additions and 32 deletions

View File

@ -1,3 +0,0 @@
- Look at Fleeting Notes website for a more comprehensive example of what this blog can be made to become.
- Linked Preview
-

View File

@ -1 +1,24 @@
The good thing about separating the script is that the blog starter can easily be
By the end of this tutorial, you will have a custom version of the [linked-blog-starter](https://github.com/matthewwong525/linked-blog-starter) that deploys to Vercel
## Fork the repository and get it to run locally
First, we want to fork the linked-blog-starter repo, then [[install-linked-blog-starter|install]] and run it locally.
**Note**: Update `https://github.com/matthewwong525/linked-blog-starter` with your own repository link
![[install-linked-blog-starter]]
After doing the installations, you can update the components as you wish.
## Make changes to the forked repository
Here are the [docs for Next.JS](https://nextjs.org/docs) and a few things to know about:
- Update `/next.config.js` to update the redirects
- Use `/components/misc/preview-link.tsx` to add link previews to any text on hover
- The [fleeting-notes-website](https://github.com/fleetingnotes/fleeting-notes-website) repository is a fork with lots of good examples (including, post-list, comments, etc.)
- The `/common_md/` directory is where the markdown files are stored in the [common markdown](https://commonmark.org/) format. Use [obsidian-export](https://github.com/zoni/obsidian-export) to convert your notes to common markdown
## Publish the repository and link it with an MD repository
1. [[publish-your-obsidian-notes-with-linked-blog-starter|Create and publish]] your forked md repository
2. [[update-publish-settings-github-actions|Update the `BLOG_REPO` environment variable]] to point to your forked repo
3. OPTIONAL: [[connect-obsidian-vault-with-github|Connect your Obsidian Vault with Github]]

View File

@ -1,40 +1,31 @@
---
title: "Home"
title: "A Customizable Obsidian Publish alternative using Next.JS"
---
# Host your second brain with Next.JS
# A Customizable Obsidian Publish alternative using Next.JS
This repository is a modified version of the blog starter provided by Next. JS. Below are some added features of the [linked-blog-starter](https://github.com/matthewwong525/linked-blog-starter):
This repository is a modified version of the blog starter provided by Next.JS. Below are some added features of the [linked-blog-starter](https://github.com/matthewwong525/linked-blog-starter):
- Automatically generated backlinks and link previews
- [[works-out-of-the-box-with-markdown-files|Works out of the box]] with your markdown files (No configuration needed)
- Supports markdown & Obsidian specific markdown syntax (via [obsidian-export](https://github.com/zoni/obsidian-export))
- Embed "PreviewLinks" outside of the markdown files (See the footer in the [example](https://linked-blog-starter.vercel.app/home))
- Highly customizable with Next.js, Tailwind v3 and React
## How to use this with Obsidian markdown files
To use this with Obsidian, you'll need to use [obsidian-export](https://github.com/zoni/obsidian-export) to [[convert-obsidian-notes-to-common-markdown|convert your obsidian notes to a common markdown]] format. Once in the common markdown format, add the markdown files to the `/common_md` folder and the blog posts will be created.
## Why I created this?
It's true that there are many Obsidian Publish alternatives, but, many of these solutions are hard to [[deploy-a-custom-linked-blog-starter|customize]], difficult to publish, and tend to [[linked-blog-starter-does-not-reinvent-wheel|reinvent the wheel]]. With this repository, I want to create a simple template that takes care of everything. Here's what the publish workflow looks like after [[publish-your-obsidian-notes-with-linked-blog-starter|setting everything up:]]
Here are the external libraries I used to help me convert Obsidian markdown files to beautiful HTML:
- [obsidian-export](https://github.com/zoni/obsidian-export) (Obsidian MD -> [Common MD](https://commonmark.org/))
- [remarkjs](https://github.com/remarkjs/remark) (Common MD -> HTML)
- [github-markdown-css](https://github.com/sindresorhus/github-markdown-css) (HTML -> Beautiful HTML)
1. Write a note in `/publish` folder within Obsidian
2. Run the backup command [[connect-obsidian-vault-with-github|using the Obsidian Git plugin]]
3. Done. Your notes are published.
## Demo
[https://linked-blog-starter.vercel.app/](https://linked-blog-starter.vercel.app/)
## Deploy your own
Only deploy through this method, if you want to get a quick server up and running. Otherwise, I'd recommend following the [[publish-your-obsidian-notes-with-linked-blog-starter|instructions to integrate this with your Obsidian Vault]].
Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example) or preview live with [StackBlitz](https://stackblitz.com/github/matthewwong525/linked-blog-starter)
Deploy the example using [Vercel](https://vercel.com/new/git/external?repository-url=https://github.com/matthewwong525/linked-blog-starter&project-name=linked-blog-starter&repository-name=linked-blog-starter) or preview live with [StackBlitz](https://stackblitz.com/github/matthewwong525/linked-blog-starter)
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/blog-starter&project-name=blog-starter&repository-name=blog-starter)
## Custom examples
### Related examples
- [Fleeting Notes](https://fleetingnotes.app)
## [[install-linked-blog-starter|Installation]]
![[install-linked-blog-starter]]
# Notes
- `linked-blog-starter` uses [Tailwind CSS](https://tailwindcss.com) [(v3.0)](https://tailwindcss.com/blog/tailwindcss-v3).
- Markdown files are [[statically-generated|statically generated]]
- Markdown is styled using [generated GitHub flavoured markdown](https://github.com/sindresorhus/github-markdown-css)
- [Fleeting Notes](https://fleetingnotes.app) - L

View File

@ -1,4 +1,5 @@
1. Clone this repo by running `git clone https://github.com/matthewwong525/linked-blog-starter`
2. `cd linked-blog-starter`
3. `npm install`
4. `npm run dev`
4. `npm run dev`
5. Go to `localhost:3000` in your browser

View File

@ -0,0 +1,13 @@
---
title: "linked-blog-starter does not reinvent the wheel"
date: 2022-12-12
---
I'm not a fan of [[reinventing-the-wheel|reinventing the wheel]], thus, I've searched for the best libraries out there to help me make this website. Here are a few external libraries I used:
## Converting MD to HTML
- [obsidian-export](https://github.com/zoni/obsidian-export) (Obsidian MD -> [Common MD](https://commonmark.org/))
- [remarkjs](https://github.com/remarkjs/remark) (Common MD -> HTML)
- [github-markdown-css](https://github.com/sindresorhus/github-markdown-css) (HTML -> Beautiful HTML)
## Others:
- Obsidian Git to help with [[connect-obsidian-vault-with-github|publishing notes from within the Obsidian Vault]]

View File

@ -20,7 +20,6 @@ By the end of this tutorial, you'll have a github repository that will automatic
**Note**: Make sure you don't delete the `/publish/home.md` file as that is your "landing page"
Additional Readings
- [[connect-obsidian-vault-with-github|How to connect Obsidian with Github]]
- [[update-publish-settings-github-actions|Updating the publish settings]]
- [[deploy-a-custom-linked-blog-starter]]
Optionally, you can:
- [[connect-obsidian-vault-with-github|Publish Notes within your Obsidian Vault]] by installing the Obsidian Git plugin
- [[update-publish-settings-github-actions|Update the publish settings]] to publish your notes to a [[deploy-a-custom-linked-blog-starter|custom version]] of the linked-blog-starter

View File

@ -0,0 +1,5 @@
---
title: "Reinventing the Wheel"
date: 2022-12-12
---
> In programming, the phrase "reinventing the wheel" refers to the act of writing code to implement a function or feature that already exists in a library or framework. For example, if a programmer writes a function to sort a list of numbers when there is already a sorting function available in the standard library, they would be said to be "reinventing the wheel."

View File

@ -3,7 +3,7 @@ title: "Update the Publish Settings"
---
There are two things you can modify in the workflow. The publish directory and the blog repository.
- `BLOG_REPO`: Next.JS app repository template that is used to publish your markdown notes. This is useful when you [[customize-linked-blog-starter|create your own custom linked blog]]
- `BLOG_REPO`: Next.JS app repository template that is used to publish your markdown notes. This is useful when you [[deploy-a-custom-linked-blog-starter|create your own custom linked blog]]
- `PUBLISH_DIR`: The folder that is published to the linked blog. All files and attachments in this folder will be published on the web
Go into `.github/workflows/publish.yml` in your forked repository forked from [linked-blog-starter-md](https://github.com/matthewwong525/linked-blog-starter-md) and update the environment variables to your desire