Personal Website (v2.0)

I’m back :)

Since the last devlog, I added a neat transition across the pages, made some changes to the status detector on the front page (previously checked hackatime & slack presence, now it also checks for last message sent), and added post visibility in Payload CMS!

I also improved the README to add the build instructions, fixed the page titles/metadata, and added SEO.

The website is finally coming together! Currently working on the contact page, which will have all my methods of contact and some random social links (which I haven’t finished adding yet). This will be the last page :D

I’ve finally finished with the blog reader page! I ripped out the custom converters I was working on and replaced it with the @tailwindcss/typography plugin.

Been working on the blog reader page but got discouraged after noticing I’m gonna have to scrap all the default Payload converters… 😭 I’ve made a couple small changes as well, like forcing the footer to the bottom of the page. I also added Vercel Blob storage compatibility for uploaded media (and wasted a bunch of time troubleshooting, but I guess that’s what you get when you use Next.js v16 with Payload CMS, since it’s technically not officially supported…). I probably wouldn’t use Vercel Blob storage for any other projects, but since I’m not planning to upload many photos for the blog, might as well simplify things.

Yippee, I have finished the blogs page completely! Now it’s time to build the blog reader page, which shouldn’t be too difficult thanks to Payload CMS’s tools. :D

I’ve been working on the blog page for a while, and I also added pagination! Now we just need to have <- and -> navigation on the bottom of the page :D

I’m experimenting with the position of the music player, I’m thinking pinning it to the bottom of the screen might look nicer!

I made a couple more refinements, and I added a music player on the homepage! I’m still playing around with its position, but for now I think this looks pretty good.

I’ve been working on implementing a new API route which will display what song I’m currently listening to! It uses the Spotify API and I’ve added refresh token logic as well :D

(Yes, I’m aware the access token isn’t being persisted heh)

Hello! To be honest, I completely forgot to document my journey on here (got too distracted with learning Next.js) so this devlog will cover everything I have so far.

I’ve worked on the following over the past few days…

• Created the Next.js application and built the header and footer.
• Added a hero, about me, and a cool navigation of skills to the homepage (as well as a neat-looking grid background).
• Added a status section which uses the Slack API + Hackatime API to check what I’m doing at the current moment (as well as display my local time).
• Built the database and implemented Payload CMS (which I’ll be using to build the blog page eventually).
• Reformatted the file structure a gazillion times to make sure it’s noice and clean (also moved the status to an API endpoint rather than serving it in a server component directly).
• Created a constants.tsx file so I can update certain labels and nav items without modifying the HTML.

But what took you so long, you may ask? Well, most of the libraries I’m using for this project are completely new to me, so most of this time was spent doing trial and error… oh and I also was super indecisive and keep adding/removing implementations.

The icons for the skills section probably took me over an hour to find, ughhh it sucked.

I’m working on my first project! This is so exciting. I can’t wait to share more updates as I build.