I rebuilt my blog using Next.JS and Tailwind
Finally decided to rebuild my blog/portfolio website, which used to run on Django, with Next.JS and Tailwind. I still kept Django admin running on the same droplet under the /admin url, which was surprisingly easy to do.
Would like to hear your opinions on the final result: claritydev.net.
I did my first website for aircal.co landing page and app with NextJS, NextJS Auth, tRPC, Prisma and Tailwind, and this was a total gamechanger!! Amazing how this feels fast and fun to develop with.
Best DX I had in a long time!
Well done Alex!
looks great. Good job in covering features as well, i see that you have covered og, twitter cards and meta for seo. You have related content and popular content which would hopefully help in engagement and toc as well which helps readers in switching back and forth. Do let us know if you decide to turn it into open source template.
What inspired you to rebuild your blog with Next.JS and Tailwind? What were the biggest challenges you faced in the process? How has your experience been so far with the new setup?
I was mostly looking to improve the developer and blogging experience, particularly write blog posts directly in markdown. The new setup is very fast so far. The next challenge is to optimise the page size as the number of posts grows.
It's so clean and I liked the plant image in your home page :)
Really nice result (dark and light mode also ;-))
! Did you use a template to start with or did you dev everything from scratch ?
I really love nextJS ! Been using it since 2018
I've made it from scratch, been actually thinking about turning it into a template at some point :)
That is fast. Btw you were using django templating before?
Yeah, the old version was run on Django.
Love the look of your blog and I enjoyed your article about your dev experience with ChatGPT. I've tried similar things but your thoughts around generating context-aware placeholder text isn't something I've tried. Great thoughts.
I've also been exploring Next.JS and Nextra for my SaaS and docs sites (https://docs.predictionguard.com), starting from some templates and starter packs. Enjoying working with this stack. As a non-frontend person it's been an interesting and rewarding journey. The dev workflows with things like Vercel etc. are so good.
Good clean layout. I especially like the dark theme with code syntax highlighting and the plant computer graphics on the front page - where did you get that?
One minor point is with the 'Read the blog ->' button on the front page. The '>' symbol drops down a line on my screen (Google Chrome on Linux) making it look untidy. Another minor point is
productivity-benefits-of-integrating-chatgpt-into-has a trailing hyphen which is unconventional.Nice site. Good work.
Thanks for the feedback! The landing page image I created by using Midjourney, took quite a bit of manual effort to make it sort of transparent, but I'm happy with the end result.
I'll look into the landing page button, should probably get a proper icon for it.
The urls for the posts were generated automatically when the blog was running on Django and I didn't check those, but yeah, might need to fix this one.
Not bad, liked it.
I use nextjs and tailwind for frontend and Django rest for backend. How did you do your home page without scroll ? did you use % for each part ? (Navbar, Hero Section and Footbar)?
If you give your page container
display: flexand thenflex:1to the main element, it will push down the footer to the bottom of the page.Looks really nice. I went the same route with next.js and tailwind, minus django. I think next.js is definitely right tool for the jobs, regardless of it shortcomings