Test

H2

H3

hello

Nice To meet you!
Pseudo
Good AfterNoon

Test

H2

H3

hello

Nice To meet you!
Pseudo
Good AfterNoon

Test

H2

H3

hello

Nice To meet you!
Pseudo
Good AfterNoon

During certain periods of my life, photography was my greatest passion, just as much as I do today with Open Source and programming. Instagram was once a delightful, minimalist platform for photo sharing that I frequently used - until Meta's acquisition changed everything. While I could even tolerate the algorithms, ads, and short videos, the recent change of profile photo grids' aspect ratio from square to 4:5 was the final straw - an arrogant decision that impacts every user's content without providing proper solutions.

I am not sure if anger or disappointment are the right words to describe my feelings. But I'm certainly lucky to be a frontend developer - so I can leverage my skills to build my own website and host my photos here.

I requested to download all my data from Instagram (it took roughly a day to process in my case), and imported them to the website. Thankfully, the downloaded data was relatively easy to process, with photos dating back to 2015. I use sharp to process the images and compress them with this script. This automation helps me manage the photos without worrying about image sizes for hosting.

Looking through these old photos brings back so many memories. While some may not meet my current standards - and I admittedly feel a bit embarrassed sharing them - they hold too many precious memories to leave behind. So I decided to keep most of them - hope you won't look too closely at them :P

Here are some of my recent photos:

It's a shame that the image quality from Instagram isn't great, since they compress photos heavily upon posting. I might replace some of them with higher quality originals in the future, but for now, I think it's a good start.

That said, I hope to get back into regularly sharing photos (as I keep saying 😅), especially now that I have my own platform for it.

Thanks for reading! And I hope you find my photos interesting. Cheese 🧀!

[!TIP]
Just a quick tip, that you can use > [!TIP] to create
a GitHub-style alert in your README.md like this.

> [!TIP]
> Just a quick tip, that you can use `> [!TIP]` to create
> a GitHub-style alert in your README.md like this.

The original GitHub proposal is here. It's rolled out basically everywhere on GitHub now.

Use it in your website

And in case you like it, and wanted to use it in your own website, I wrote a quick markdown-it plugin for it:

Vite

If you are using unplugin-vue-markdown:

import MarkdownItGitHubAlerts from 'markdown-it-github-alerts'
// vite.config.ts
import Markdown from 'unplugin-vue-markdown/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    Markdown({
      markdownItSetup(md) {
        md.use(MarkdownItGitHubAlerts)
      }
    })
  ],
})

VitePress

If you are using VitePress, you can add this to your .vitepress/config.js:

import MarkdownItGitHubAlerts from 'markdown-it-github-alerts'
import { defineConfig } from 'vitepress'

export default defineConfig({
  markdown: {
    config(md) {
      md.use(MarkdownItGitHubAlerts)
    }
  }
})

Nuxt Content

Nuxt Content use remark instead of markdown-it, so the plugin won't work yet. I will implement it later if there is demand.

Reference

• Commit of this blog post and setting it up
• Proposal to VitePress for adding this by default

[!IMPORTANT]
Thanks for reading! :)

Note that the format is like Co-authored-by: name <name@example.com>, normally GitHub will fill that for you so you don't need to worry about that, but if you want to add it manually, you have to get the email addresses of the contributors. But how do you know their emails?

Well, technically you can indeed find their email by multiple ways, but actually, you don't need to. The easiest way is to copy their user id and append with @users.noreply.github.com that provided by GitHub automatically, for example:

Co-authored-by: antfu <antfu@users.noreply.github.com>

Disclaimer: All the words are only representing my opinions. None of them applies to the Windi CSS's author nor the team.

I spoke out for Windi CSS just because keeping silence on this also means we are encouraging such things to happen again in the open-source community.

Tailwind was once my favorite CSS framework and I was really happy to see we made it works on Vite much faster with @voorjaar's astonishing Windi CSS compiler. But I was totally unexpected to see that end up being like this. Don't get me wrong, it's great to see Tailwind's long pain get solved officially with Tailwind JIT and benefit the community. What I am saying is that Tailwind used/inspired by Windi's idea without even mentioning Windi CSS once and claiming it's their own ideas (until 20min after my tweets about that, they appended two tweets in the comments, mentioned about Windi but still implies it's their idea. That's all we got). No official reply of this whole thing, not updates to their repo's README, at all.

I don't want to speculate what's the reasons or motivations behind it, all I know is that I will not use any products from Tailwind Labs anymore. If you think I was reacting too much or it was not a big deal, then I truly wish such things would never happend on you once again.

On the bright side, Windi pushed Tailwind to make the JIT and improved the DX and Tailwind forced Windi to be independent and evolving to not being a "Tailwind accessory" any longer.

There is another community based CSS-in-JS alternative called Twind, which you definitely want to check out (they are working closely with Windi to bring an uniformed community standard/spec of our DSL, cheers @sastan!).

As for myself, I will spend more time on working with Windi CSS to make it even better. Here is some of exciting things we are working on:

Thanks for reading though. Don't feel any pressure about using any tools that you needed. I choose not to use them just because my personal preference. I don't want to force anyone to switch their stack because reading this post, we will keep improve it and show you which is the better one you should use :)