
As you can see... I redid my website! And I actually made it this time, not just set up a hugo theme! Wow!

I want to actually use the blog section too. I like writing stuff like this, and now I have a good place to put it. Not sure what I'll write about, but I'll figure it out. And what better way to get started than to write about the fact that I redid my website, and what I used!

## The old website

The old website was a hugo theme [coder](https://github.com/luizdepra/hugo-coder) that I set up and configured and such. Setting it up was kinda fun and interesting at the time but now it's just crusty and not a good representation of what I _can_ do. I'm by no means good at making websites, but I can do more than write a config file.

That's it. Moving on.

## This new website

This here new website is made with [Next.js](https://nextjs.org), [Tailwind CSS](https://tailwindcss.com), and [TypeScript](https://www.typescriptlang.org). I've messed with Next.js a bit before but never made a static site with it. I've also used Tailwind CSS before, but not too much. It's a pain but at least it's easier than CSS? And TypeScript. Ah TypeScript. Telling me how I've screwed up my code before I even save it.

Everything on this site is themed with the [Dracula color scheme](https://draculatheme.com). I have everything I can on my laptop using these colors & themes, so it just makes sense to have it on my website too. Now that's an idea for a future post...

### Blog posts

My previous site had (not very many) posts written in Markdown, and writing stuff in Markdown is something I've always loved. I can just write, adding little annotations where I need. But with [MDX](https://mdxjs.com) I can include components right in it! You wouldn't get this if I just used Markdown...

<marquee>
  mdx go
  brrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr
</marquee>

The posts also have a similar comments section from the old site, but better. White I previously used [utterances](https://utteranc.es/), a comments system based off GitHub issues, this new site uses [giscus](giscus.app). It's essentially the same thing, but it uses discussions, which adds replies to comments, reactions, and a couple other things. It's also a lot more customizable, which is nice.

### Analytics

For analytics I'm using [plausible](https://plausible.io) this time, instead of [goatcounter](https://www.goatcounter.com). I admittedly haven't been able to try it out very much, but it looks like it's a lot better than goatcounter. It's still "privacy-friendly", as they put it, and has some cool stats. Here's some pretty sad realtime analytics from plausible:

<Analytics />

### Other trinkets

On the home page I use [lanyard](https://github.com/Phineas/lanyard), a cool little API that exposes my Discord status.

## "Conclusion"

And I think that's it... I really like how it turned out! If you're interested in further stuff about this, it's open-source on GitHub, go [check it out](https://github.com/mrhappyma/site). If you have feedback (of any kind) on this site or this post, please comment!

_p.s. if anyone knows a good vscode spell checker that works for mdx files please let me know_


And I like actually made it this time not just set up a hugo theme