Nothing beats free. With Next.js, i can deploy multiple websites without worrying about hosting limitations. With WordPress even if i find a cheap host that can host multiple add-on domains, i am still limited by the RAM usage as WordPress is a dynamic website (every page load requires server workloads). With Next.js, everything is statically generated into pure HTML/CSS/JS.
Some free hosting options that are currently available
Vercel https://vercel.com/ Netlify https://www.netlify.com/ Firebase https://firebase.google.com/products/hosting Surge.sh https://surge.sh/ Loading Speeds User experience is top priority in my case. This blog loads way faster than what i used to have on WordPress. Will update this post after running it in the tools below.
Tools that i use
Some problems & the solutions i found
Had issues using React hooks in MDX - But here’s a workaround (LINK) Sharing to Social Media - https://www.npmjs.com/package/next-share Estimated Time to Read - https://github.com/diogomoretti/use-reading-time Copying code - This is a surprise for me as that was out of the box (see the code block below) Here’s an example on embedding a YouTube video in a nextjs post
<iframe width="560" height="315" src="https://www.youtube.com/embed/Sklc_fQBmcs" title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
In the past without continous integration, you had to export the file as a zip. Drag it into the Netlify platform to upload. This is a tedious and manual process.
Now, a simple push to master branch automatically builds my netlify project which is made possible with webhooks.
Open source & helpful community
I’m a fan of free and starter kits that does all the heavy lifting. I have no time to rebuild everything from a pure nextjs blank app.
This is a great nextjs tailwind starter kit that i highly recommend. It has almost everything you need for a personal blog. Great job Tim if you are reading!
This is NOT a recommended approach for non developers. Using the template requires knowledge in programming to debug errors that may be ambiguious. Things do break easily and requires you to modify source code. If you want to reuse the project, either you fork it or create a PR and hope the owner accepts it. e.g Not every project i have has an image, so when i removed the imgSrc property from projectsData it broke the app. I then had to make it an optional in another file.