How I created a Responsive Personal Portfolio Website with Next.js

Jordan Wells
5 min readMay 30, 2022
The final result, jordantwells.com

Almost two years ago, I created my first website using HTML, CSS, and Python. Now, I’ve reinvented it using a modern and robust front-end development framework known as Next.js. For the past week, I have been developing it and now I’m proud to present www.jordantwells.com.

I created the first website to learn the “ins and outs” of web development fundamentals, and now I’ve created this new website to learn how front-end development is done with a slick JavaScript framework. It definitely wasn’t an easy journey, but I hope I can pass on some of the cool things that I’ve learned about along the way.

As always, if you want to see any of the code that made all this possible, it is available on my GitHub.

Why is Next.js great?

Next.js logo

Next.js is a framework built on top of React, the popular JavaScript front-end development library. The benefit? Statically generated pages are reactive, and Next.js will hydrate your application client-side to give it full interactivity.

Additionally, there are many ways to render your site. Content can be rendered by the server (Server-Side…

--

--