🤖 Building an AI Chatbot with Netlify Functions and Together AI

Building an AI Chatbot with Netlify and Together AI

Over the past week, I spent about 4 hours building a proof-of-concept AI chatbot that demonstrates how to leverage modern AI services to create a functional AI assistant. In this post, I’ll share my experience, explain the technical decisions, and outline the security considerations.

Tech Stack Overview

  • Frontend: Static HTML/JS/CSS with a cyberpunk theme
  • Backend: Netlify Serverless Functions (Node.js)
  • AI Model: Together AI’s DeepSeek-V3 (via REST API)
  • Hosting: Netlify (frontend + functions) + GitHub Pages (main blog)

Why These Tools?

  1. Netlify + Serverless Functions:
    • Free tier includes generous function invocations
    • Built-in environment variable management for API keys
    • Easy deployment and version control integration
    • Zero server maintenance
  2. Together AI:
    • Access to cutting-edge models like DeepSeek-V3
    • Reliable API with high availability
    • Simple REST API integration
    • Fair pricing and good performance
  3. Static Frontend:
    • Fast loading and minimal hosting costs
    • Easy to maintain and modify
    • Works well with Netlify’s CDN

Security Considerations

Security was a top priority in this project. Here’s how I handled it:

  1. API Key Protection:
    • Together AI API key stored as Netlify environment variable
    • Never exposed to client-side code
    • All API calls handled server-side in Netlify Functions
  2. Rate Limiting:
    • Implemented basic session-based usage tracking
    • Token counting for usage monitoring
    • Robust error handling and fallback logic

Build Process

  1. Set up Netlify project structure: 
    netlify-chatbot/
├── netlify/
│   └── functions/
│       └── chatbot.js
├── public/
│   └── index.html
└── netlify.toml
  2. Created serverless function for Together AI integration
  3. Built cyberpunk-themed UI with usage stats
  4. Added technical documentation section
  5. Deployed and tested on Netlify
  6. Integrated with main Jekyll blog

Future Improvements

I’m planning several enhancements:

  1. RAG Integration:
    • Add Pinecone for vector storage
    • Implement document embedding
    • Enable context-aware responses
  2. Enhanced Features:
    • Conversation history storage
    • Multiple model support
    • Custom prompt templates
  3. Performance Optimizations:
    • Stream responses
    • Implement client-side caching
    • Add response compression

Try it Now! 🚀

Experience the chatbot in action: DaveBot Demo

The demo showcases:

  • Real-time AI responses using Together AI’s DeepSeek-V3 model
  • Cyberpunk-themed UI with token usage tracking
  • Production-grade error handling and fallback logic

Implementation Details

Check out the technical documentation in the project repository for detailed implementation notes and code examples. The project demonstrates a production-ready setup with error handling, fallback logic, and monitoring.

Time Investment

The entire project took approximately 4 hours:

  • 1 hour: Research and planning
  • 1.5 hours: Backend implementation and API integration
  • 1 hour: Frontend development and styling
  • 0.5 hours: Testing, debugging, and deployment

Cost Analysis

The implementation uses a mix of free and paid services:

  • Netlify: Free tier (includes 125k function invocations/month)
  • Together AI: Pay-as-you-go pricing with competitive rates
  • GitHub Pages: Free hosting for the blog

Conclusion

This project demonstrates how modern cloud services and AI APIs can be combined to create sophisticated applications with reliable performance. The key is choosing the right tools and implementing proper security measures from the start.

Feel free to reach out if you have questions about implementing your own version!

Written on June 25, 2025