Designing a Customizable, SEO-Optimized Personal Website With React + Next.JS

For the past couple of years, my personal website has been hosted on a Heroku free dyno. It was Node.JS with an Express backend and a EJS front-end. It worked well for the most part, but there were several downsides.

1. After 30 minutes of no use, my dyno would go to sleep, leading to high load times since the server needed to restart
2. Any content changes required redeploying the site
3. An Express backend is overkill since its only purpose was to route users to each page

While none of these issues are earth-shattering, it was definitely a sub-optimal setup, particularly since slow loading time is a bad user-experience and results in poor SEO.

Issues 1 and 3 are easily solved by migrating the site to a static hosting solution (i.e get rid of the Node.JS server and serve raw HTML, CSS, and Javascript). Issue 2, however, would require some kind of backend to fix because the site data would have to be hosted somewhere other than my codebase.

At first glance, these seem counter to each other. This is where React comes in.

React.JS

React is an increasingly popular JS framework which makes it easy to build dynamic webpages that run entirely on…