DEV Community

Cover image for Develop a Free Chatbot for Your Portfolio Website: A Step-by-Step Guide with Code Examples

Develop a Free Chatbot for Your Portfolio Website: A Step-by-Step Guide with Code Examples

Melvin Prince on February 24, 2025

I’ve always enjoyed exploring ways to make portfolio sites more interactive and helpful. That’s why I decided to create a custom chatbot—something ...
Collapse
 
ibtesam_abdullah_26349c86 profile image
Ibtesam Abdullah

I have designed so many websites but never created a portfolio. This blog was very helpful for me, and now I created a portfolio according to your instructions. I also included one of my favorite projects, professional resume writing services in dubai, after creating this portfolio

Collapse
 
amann5153 profile image
AMANn5153 • Edited

nice thank for sharing

Collapse
 
ltndat1 profile image
Dat Le

Wow, this is such an amazing guide! 😄 I love how you've made it easy for anyone, even beginners, to implement a chatbot using React and Supabase. I'm especially excited about how you’ve included animations and personalized user sessions—it makes the experience feel so much more dynamic! 🤩 I have a question: How do you handle complex user queries that may require deeper context or multi-turn conversations? Would love to hear more about that! 🔥

Collapse
 
melvinprince profile image
Melvin Prince

For that you can tune the model from gemini dashboard and then use it for answers...implementing that is also a good option but there are lot more restrictions on doing it.. for something like resume sending a longer chat was more than enough

Collapse
 
jasbon_jonwick_945c4e715a profile image
Jasbon Jonwick

It looks like you're sharing an article about building a chatbot for a portfolio website using React, Supabase, and Gemini. Are you looking for feedback, help implementing something similar, or do you want to improve the guide in some way? Let me know how I can assist

Collapse
 
melvinprince profile image
Melvin Prince

please do tell if there is something to improve or fix

Collapse
 
melvinprince profile image
Melvin Prince • Edited

model: "gemini-1.5-flash"
this is the available model on free tier in Gemini.

you can view models available to you by sending a request
$ curl -X GET "generativelanguage.googleapis.com/..."

Collapse
 
razielrodrigues profile image
Raziel Rodrigues

Very nice to know they provide this

Collapse
 
aayyusshh_69 profile image
Aayush Pokharel

I have build so many DIscord bot, check out in my Github profile

Collapse
 
cng_tytnhhxydngv profile image
CÔNG TY TNHH XÂY DỰNG VÀ THƯƠNG MẠI VÂN QUÂN

Cảm ơn vì những gì bạn đã chia sẻ

Collapse
 
jaweria_adeel_f1c26e0c1db profile image
Jaweria Adeel

Fantastic guide! Loved the step-by-step approach for integrating a chatbot into a portfolio. Can’t wait to try it out. Thanks for sharing! hcalcuators.com/

Collapse
 
hitour24 profile image
hitour24

Image description

Collapse
 
finnstats_5c19af66ed9e87a profile image
finnstats

Nice