Why Build A Developer Portfolio?
A developer portfolio website showcases a developer's work and presents them in the best possible light to potential employers. Side projects are a great asset and should be highlighted on the portfolio site to maximize job-seeking value.
When I was looking for a new job as a developer, I realized that having a portfolio website would be a great way to showcase my skills and experience to potential employers. I wanted to improve my skills as a developer and have a platform to display my work and side projects.
Josh Comeau, a well-known developer, wrote a book called (‘Build an Effective Dev Portfolio’) which I used as a focal point in the development of my site.
Tech Stack
When I was searching for a tech stack for my portfolio website, one of the most important factors for me was having access to excellent documentation. I wanted to learn and experiment with a stack that was well-documented and easy to understand. Additionally, I was looking for a tech stack that would be fast and efficient. I wanted to create a website that would load quickly and provide a great user experience.
Furthermore, I wanted to learn tools that would be useful in the future. I didn't want to invest time and energy into a tech stack that wouldn't benefit me in the long run. I wanted to learn skills that would make me a more well-rounded and versatile developer. Therefore, I carefully considered each tool in the stack I chose, making sure it would be beneficial for my future development projects.
Here is what I used:
Next.js
Next.js is a popular React framework that allows developers to build server-side rendered React applications. Next.js eliminates the need for setting up a complex build system, enabling developers to focus on building their applications. With Next.js, developers can easily create static websites, server-side rendered applications, and even progressive web applications.
MDX
MDX is a markup language that combines Markdown syntax with React components. This allows developers to write markdown files that can include interactive React components. MDX is perfect for creating documentation sites, blogs, and other content-driven websites. With MDX, developers can easily create interactive and engaging content without the need for complex build systems.
Tailwind
Tailwind is a utility-first CSS framework that allows developers to create responsive designs with minimal effort. Tailwind provides a set of pre-defined CSS classes that developers can use to style their applications. Developers can easily customize their designs by editing their Tailwind configuration files. Tailwind is perfect for building static websites as it eliminates the need for writing custom CSS, enabling developers to focus on building their applications.
Vercel
Vercel is a cloud-based platform that provides developers with a simple and intuitive way to deploy their applications. Vercel supports a variety of frameworks and languages, including Next.js, React, Vue, and Angular. With Vercel, developers can quickly deploy their applications to a global CDN, ensuring that their applications are fast and responsive to users worldwide.
Design
My primary goal while designing this website was to ensure that the information and call-to-action that people needed to see first were given the highest priority.
To achieve this, I made sure to keep the design simple and minimalist, with a focus on content. However, I also wanted to ensure that the design was not plain, as design is an extension of a company's or person's identity and it communicates a certain mood or feeling. In fact, one of my colleagues recently shared with me that good design can make people feel something.
I believe that prioritizing the right information and call-to-action is crucial for any website, particularly a developer portfolio website. It helps potential employers quickly understand the developer's skills and experience, which can increase the chances of getting hired. Overall, I am pleased with how the design turned out and how it effectively highlights my work and side projects.
I drew inspiration for my website from other sites, including Delba de Oliveira (delba.dev) and Lee Robinson (leerob.io). Delba's navbar even influenced my own design. I think that finding inspiration in the work of others can be beneficial. As the saying goes, "Good artists copy, great artists steal," a quote often attributed to Pablo Picasso.
Why a Blog?
When I decided to add a blog to my portfolio site, I had several reasons in mind. My primary objective was to gain a deeper understanding of using Next.js and improve my coding skills overall. As I embarked on this project, I soon realized that having a blog would provide me with a platform to compile my thoughts and notes on the projects I am building. By writing about what I am working on, I am able to reflect on my progress, identify areas for improvement, and keep track of my learnings.
Moreover, I view this blog as more than just a place for filler content. It is also a classroom for my thoughts, a place where I can document my journey as a developer. In the future, as I look back on my posts, I hope to see how I have grown and evolved as a coder.
That said, I am not creating this blog solely for my own benefit. If there are people out there who can benefit from the things I find and learn, I am more than happy to share my knowledge with them. I believe that by sharing ideas and insights, we can all grow and learn together, and that is something that I am excited to be a part of.
Conclusion
In conclusion, building a developer portfolio website is an excellent way to showcase your skills and experience to potential employers. By highlighting your work and side projects, you can increase your chances of getting hired. When building your portfolio website, it's important to carefully consider your tech stack, keeping in mind factors such as documentation, efficiency, and usefulness for future projects. Additionally, prioritizing the right information and call-to-action is crucial for any website, particularly a developer portfolio website. Finally, finding inspiration in the work of others can be beneficial in creating an effective and engaging design.