OG Card Generator - Card-style Link Generation App for Static Sites

Introduction Video

https://www.youtube.com/watch?v=k6avQD1RerY

Overview

On platforms like Hatena Blog and Medium, when you insert a link to an external page, it's displayed in a card format, which looks quite stylish.

For static sites, it's difficult to create typical card-style links that use OGP from external sites, as content needs to be finalized at build time.
Therefore, I created an app that outputs a card-style link in HTML/CSS format when given the URL of the target page, addressing this issue.

In essence, it's this ↓:

OG Card

Note that I used AngularDart for this project.
Details are described in this article.

AngularDart as a Development Environment for Small Web AppsI often used React or Next.js when creating small web apps, but this time I tried AngularDart, which has high compatibility with Material Design. AngularDart comes with types by default and makes it easy to use Material Design components, allowing for smooth development. However, since it's not js, it means departing from the existing ecosystem, and I feel there are also disadvantages such as a smaller community.Oct 11, 2018, 4:23 PM UTC

How to Use

As the Demo site is currently not available, please check the GitHub code if needed.

https://github.com/esplo/og-card-generator

It is currently archived.