DEV Community

Cover image for Creating a Chatbot from Scratch and Vibe Coding the UI๐Ÿ’ƒ

Creating a Chatbot from Scratch and Vibe Coding the UI๐Ÿ’ƒ

Rohan Sharma on June 21, 2025

Hey all, I hope you remember me. (Yes?? LMK in the comment section.) In this blog, I will discuss Radhika: Adaptive Reasoning & Intelligence ...
Collapse
 
rohan_sharma profile image
Rohan Sharma

Hey all, I hope you like it!

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
rohan_sharma profile image
Rohan Sharma

Bruh is killing me publicly

Collapse
 
uzondu9 profile image
Uzondu

Beautiful product. We've got both a product designer and software developer. If you keep up with this you are in for several opportunities. Besides this, you've now got an excellent piece to add to your portfolio. If I may ask how do you combine AI tools like lovable and bolt to build the UI in conjunction with popular libraries and frameworks like Next and React. Are basic web technologies still relevant and how far do you go with these AI tools. Sorry if it's so long, I am drafting a tech stack plan.

Collapse
 
rohan_sharma profile image
Rohan Sharma

Are basic web technologies still relevant and how far do you go with these AI tools.

Yes, it is. They are the basics. But with the help of AI tools like v0, lovable, bolt, etc., you will be able to ship the frontend very quickly. All you need to provide is a prompt, and keep prompting until you get the final result according to what you thought. But yeah, it's frustrating because these tools make a lot of mistakes.

Sorry if it's so long, I am drafting a tech stack plan.

No no. That's fine! I'm happy that you liked my project. Thank you ๐Ÿ‘‘

Collapse
 
abhiwantechnology profile image
Abhiwan Technology

Very intresting topic is discused above regarding developing the chatbot. Most of the India based top blockchain game development services providers companies also were developing chatbots by integerating latest technology and doing innovation which makes the coding more engaging for developers.

Collapse
 
rohan_sharma profile image
Rohan Sharma

I need to try blockchain too. But the thing is, this domain is still struggling.

Collapse
 
aniruddhaadak profile image
ANIRUDDHA ADAK

osm

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you Aniruddha!

Collapse
 
anni profile image
Anietie Brownson

Nice one Rohan
I especially love the way you created the different modes
Looking at the system prompt made me chuckle though
What if Radhika decides to leave you?

Collapse
 
rohan_sharma profile image
Rohan Sharma

Ahhh please ๐Ÿ˜‚๐Ÿคฃ

Collapse
 
chiragagg5k profile image
Chirag Aggarwal

Radhika is a lucky girl ๐Ÿ˜‚

Collapse
 
rohan_sharma profile image
Rohan Sharma

If she exists

Collapse
 
njal profile image
Florios Katsouros

This is honestly one of the most ambitious AI UI integrations Iโ€™ve seen lately โ€” combining multi-provider LLM logic with real-time mode switching, voice input, and a full frontend experience is no joke.

Loved how cleanly you've modularized the provider logic โ€” especially the way you route through different system prompts and dynamically adjust the models (llama for reasoning, qwen for creativity etc). Thatโ€™s smart.

Curious: how does latency behave when switching between providers mid-session? And are there fallback options if one fails (like Groq timing out, for example)?

Also really liked the use of v0 + ChatGPT for interface prototyping โ€” the results actually look coherent, which isn't always easy when prompting UI

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you so much.

how does latency behave when switching between providers mid-session? And are there fallback options if one fails (like Groq timing out, for example)?
No, not yet. But nice suggestion. I will implement it.

the results actually look coherent, which isn't always easy when prompting UI
I don't depend on them totally. They give the response, I make changes and save, then again I ask for other features or UI changes. This practice saves a lot of time/.

Btw, this comments also seems like an AI generated one (or better I can say, chatGPT). Isn't it? ๐Ÿ˜‚๐Ÿคฃ

Collapse
 
itxitpro_llc profile image
ITXITPro LLC

This was a refreshing read, Rohan!

Loved how you broke down the process of building a chatbot from scratch while also focusing on UI aesthetics โ€” the "vibe coding" angle adds a fun and relatable twist. The conversational interface is clean and intuitive.

Would love to see a follow-up post on integrating NLP models or deploying it to platforms like Telegram or Slack. Keep sharing more builds like this!

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you.

Would love to see a follow-up post on integrating NLP models or deploying it to platforms like Telegram or Slack. Keep sharing more builds like this!
NOTED!

Collapse
 
nevodavid profile image
Nevo David

Growth like this is always nice to see. Kinda makes me wonder - what keeps stuff going long-term? Like, beyond just the early hype?

Collapse
 
rohan_sharma profile image
Rohan Sharma

I don't know the answer, but I just wanted to create this. Let's see how far it goes.

Collapse
 
hudel91 profile image
Hugue Delmas Poe

Bonjour, je suis HUGUE,
Je suis ici pour une aide car j'ai eu a m'inscrire sur discord et fait des diffรฉrents types de liaison avec bot-hosting. Et levanter-delta donc je suis a la recherche de CODE DE Dร‰PLOIEMENTS Pour crรฉer un bot WhatsApp.. Merci pour votre soutien.

Collapse
 
rohan_sharma profile image
Rohan Sharma

Salut Hugue, j'ai dรฉjร  joint le lien GitHub au blog. Mais voilร  : github.com/RS-labhub/Radhika

J'espรจre que cela t'aidera.

Collapse
 
thibaultmardinli profile image
Thetoolist

Dope ๐Ÿ˜Ž

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you!

Collapse
 
khaja_hussain_db1f84efe83 profile image
Khaja Hussain

Woww!!. Nice.๐Ÿ‘

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you!

Collapse
 
jennie_py profile image
Priya Yadav

wohhhhhhoooo

Collapse
 
rohan_sharma profile image
Rohan Sharma

Yusssssssssssssss

Collapse
 
infinity profile image
Kyle

Why did you go with Vercel AI SDK instead of Openrouter, for example?

Collapse
 
rohan_sharma profile image
Rohan Sharma

It's free, and we can add api key for multi-llm providers specifically. Openrouter is good(single api for all providers), but with balance.

Collapse
 
k0msenapati profile image
K Om Senapati

Great

Collapse
 
dotallio profile image
Dotallio

Love the multi-mode approach, and the extra effort on UI and voice is awesome.
Which provider do you find gives the best vibes for BFF mode?

Collapse
 
rohan_sharma profile image
Rohan Sharma

Groq and OpenAI. I like them!

Collapse
 
jennie_py profile image
Priya Yadav

nice !!

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you

Collapse
 
jyoti_ranjanjena_a3178e7 profile image
Jyoti Ranjan Jena

Wow imaginary gf app

Collapse
 
rohan_sharma profile image
Rohan Sharma

Ehehehe.

Anyway, it's my gf. You can still ask something productive to her. ๐Ÿ˜‚๐Ÿคฃ

Collapse
 
thenikhilraj profile image
Nikhil Raj

Good Job Bhai!!

Collapse
 
rohan_sharma profile image
Rohan Sharma

Sukriyaa!

Collapse
 
nadeem_zia_257af7e986ffc6 profile image
nadeem zia

Its perfect

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thank you!!

Collapse
 
faseeu profile image
Faseeu

Bud!
This doesn't have tools support or MCP support, librechat has it but that's not a thing in next js and for production so will you add the support.

Collapse
 
rohan_sharma profile image
Rohan Sharma

I need to research about it a bit. Thanks for your suggestions. How you come up with this?

Collapse
 
tabot_konraldeyong_8edbf profile image
Tabot Konrald Eyong

Thanks really impactful

Collapse
 
rohan_sharma profile image
Rohan Sharma

I'm glad you liked it.

Collapse
 
emilia_greendevald_ef88ad profile image
Emilia greendevald

great! thanks

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thanks to you too for reading!

Collapse
 
leetblogger profile image
leet blogger

Nice Rohan!!

Collapse
 
rohan_sharma profile image
Rohan Sharma

Thanks for reading!

Collapse
 
dkthedev profile image
Dmitrii

Is it real that you're trying to understand model type based on hardcodes? No offense, but it might be handled more efficiently.

Collapse
 
rohan_sharma profile image
Rohan Sharma

It was easy, actually. If you see my code, it's very unorganized. However, I will organize it soon. I have pre-done most of the work already.

But I would love to hear about the most efficient methods from you.