DEV Community

Cover image for My Portfolio Using Next.js, Google Cloud Run and Gemini AI
Dennis
Dennis

Posted on

My Portfolio Using Next.js, Google Cloud Run and Gemini AI

New Year, New You Portfolio Challenge Submission

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

## About Me
I am a developer and engineer with a unique background that bridges the worlds of civil engineering and software development. My goal with this portfolio was to create a digital space that not only showcases my projects and skills but also reflects my journey, from building physical infrastructure to engineering intelligent web applications. I wanted to build a platform that demonstrates my skills in full-stack development, data science and my passion for leveraging AI to create practical, innovative solutions.

## Portfolio

## How I Built It
This portfolio is a full-stack Next.js 14 application written in TypeScript, embracing the modern App Router for a clean, server-centric architecture.

Tech Stack:

1. Frontend: Next.js, React, Tailwind CSS, and the beautiful, accessible component library from Shadcn/UI.

2. Backend & Databases: My backend is built with Next.js API Routes. For the primary database, I use Cloud Firestore to store and manage persistent data like my blog posts. To ensure the application is fast and secure, I also use Upstash Redis as a secondary, in-memory data store for performance-critical tasks like API rate-limiting.
Firebase Authentication secures the application and enables role-based access, where you will find my AI cover letter generator and my blog's dashboard.

3. Deployment: The entire application is deployed on Google Cloud Run through the streamlined Firebase App Hosting service, ensuring a scalable and robust production environment.

4. Google AI Integration: I used Google AI's Gemini Pro model to power two distinct features, making the portfolio interactive and functional:

- AI Assistant (Neneh): An interactive chatbot trained on my portfolio's content, allowing visitors to ask questions about my skills and experience in a conversational way.
- AI Cover Letter Generator: A private tool that takes a job description and uses Gemini to automatically generate a tailored cover letter based on the full context of my resume and projects.

## What I'm Most Proud Of
I'm particularly proud of the dual AI integration. It was a fantastic challenge to not only build a public-facing chatbot but also a practical, personalized tool like the cover letter generator. Engineering the prompts to get the exact tone and format I wanted was a rewarding process. I believe it showcases my ability to think beyond a simple "tech demo" and apply AI to solve real-world problems.

Additionally, I'm proud of the data architecture. Using Cloud Firestore for content and Upstash Redis for high-speed operations like rate-limiting was a great way to build a scalable and resilient backend. This project is a true representation of my interdisciplinary skills that blend engineering precision with the creative possibilities of modern web development and AI.

Top comments (0)