Forem: cuongnp

VaultMind: Your AI Calendar Assistant with Auth0-Powered Security

cuongnp — Mon, 27 Oct 2025 01:30:57 +0000

This is a submission for the Auth0 for AI Agents Challenge

What I Built

VaultMind is an AI-powered calendar assistant that transforms how you manage your schedule. Instead of clicking through calendar interfaces, just tell VaultMind what you need:

💬 "Am I free tomorrow afternoon?" - Instant availability checks
📅 "Schedule a team standup next Monday at 2pm" - Smart event creation with conflict detection
🌍 "What time is 3pm Tokyo in San Francisco?" - Automatic timezone conversion across 19 global zones
⚠️ "Find me 30 minutes this week" - Intelligent scheduling with conflict warnings

The Problem It Solves

Modern professionals waste 2+ hours per week on calendar management:

Manual timezone calculations for distributed teams
Checking availability across multiple calendars
Avoiding double-bookings and scheduling conflicts
Context-switching between chat, email, and calendar apps (Update soon!)
And more!!

VaultMind eliminates this friction by leveraging AI agents that integrate seamlessly with the Google Calendar API, using real data instead of mock responses or templates.

Key Features

✅ Real API Integration: interacts with Google Calendar API for actual event management

🤖 True AI Understanding: integrates OpenAI for natural language processing

🔐 Enterprise Security: Auth0 Management API with short-lived tokens—no stored credentials

🌍 Global Timezone Support: support multiple timezones with live clocks for distributed teams

⚠️ Smart Conflict Detection: Warns before creating overlapping events

📊 Real-Time Validation: See actual calendar events appear instantly

Demo

Live Demo: https://vaultmind-app.vercel.app

GitHub Repository: https://github.com/mrdaiking/vaultmind

Demo Account:

Email: vmind97@gmail.com
Password: vaultmind@97

Important: If you want to test the full Google Calendar integration, please register in the waitlist first and I will add you to the audience list of Google OAuth consent screen since this app is still in testing mode. Sorry about this!

Screenshots

Landing Page with Real-World Use Cases

How I Used Auth0 for AI Agents

AI Chat Interface with Timezone Support

Smart Conflict Detection

Real Google Calendar Integration

How I Used Auth0 for AI Agents

Architecture

VaultMind implements Auth0's best practices for securing AI agents with three layers of security:

1. JWT Validation with JWKS Caching

Every API request validates the Auth0 JWT token:


async def verify_jwt(credentials: HTTPAuthorizationCredentials):

# Fetch and cache Auth0's public keys (JWKS)

jwks = await get_jwks()

# Verify JWT signature, issuer, audience, expiration

payload = jwt.decode(

token,

public_key,

algorithms=["RS256"],

audience=AUTH0_AUDIENCE,

issuer=f"https://{AUTH0_DOMAIN}/"

)

logger.info(f"[AUTH] JWT verified for user: {payload.get('sub')}")

return payload

Security Benefits:

✅ Cached JWKS reduces Auth0 API calls (1-hour TTL)
✅ Prevents token forgery with signature verification
✅ Validates issuer, audience, and expiration automatically

2. Auth0 Management API for Secure Token Exchange

Instead of storing refresh tokens (security risk!), VaultMind uses Auth0 Management API to fetch short-lived Google Calendar tokens on-demand:


async def get_google_access_token_from_management_api(user_sub: str):

# Get Management API token (cached, 24hr expiry)

mgmt_token = await get_management_api_token()

# Fetch user's Google identity with access token

response = await client.get(

f"https://{auth0_domain}/api/v2/users/{user_sub}",

headers={"Authorization": f"Bearer {mgmt_token}"},

params={"fields": "identities", "include_fields": "true"}

)

# Extract Google access token from identities

for identity in user_data.get("identities", []):

if identity.get("provider") == "google-oauth2":

return identity.get("access_token") # Short-lived token!

Security Benefits:

✅ Zero Stored Credentials: App never stores refresh tokens
✅ Short-Lived Tokens: Google tokens expire in ~1 hour
✅ Runtime Token Retrieval: Fetched only when needed
✅ Scoped Access: Minimal Calendar API permissions

3. Structured Audit Logging

Every AI agent action is logged with security context:


# Tagged logging for production observability

logger.info("[AUTH] ✅ JWT verified for user: google-oauth2|123456")

logger.info("[MGMT] 🔑 Requesting Management API token...")

logger.info("[CALENDAR] ✅ Created calendar event: abc123xyz")

logger.info("[AI] Processing message: 'Am I free tomorrow?'")



# Comprehensive audit trail

audit_log.log_action(

user_id=user_claims.get('sub'),

action='create_calendar_event',

details={'event_id': event_id, 'title': title},

success=True

)

Logging Tags:

[AUTH] - JWT validation and token retrieval
[MGMT] - Auth0 Management API operations
[CALENDAR] - Google Calendar API calls
[AI] - OpenAI agent processing
[ERROR] - Security failures and API errors

Auth0 Configuration Highlights

Google Social Connection:

✅ Enabled Google OAuth2 with Calendar scopes
✅ Configured https://www.googleapis.com/auth/calendar permission
✅ Users must re-authenticate to grant calendar access

Management API Permissions:

✅ Enabled read:users for user identity lookup
✅ Enabled read:user_idp_tokens for Google token retrieval
✅ Machine-to-machine authentication with client credentials

Security Settings:

✅ JWT token expiration: 10 hours
✅ Allowed callback URLs: Production + localhost
✅ CORS configured for frontend domain only
✅ Rate limiting enabled on backend API
✅ Prevent prompt injection with moderation filters

Tech Stack

Frontend:

Next.js 15.5.6 (App Router)
Tailwind CSS for responsive design
Auth0 Next.js SDK (@auth0/nextjs-auth0)

Backend:

FastAPI (Python 3.11.9)
Auth0 JWT validation with PyJWT
Google Calendar API integration
OpenAI GPT-4o-mini for natural language processing
pytest + black + flake8 for code quality (Make code production-ready)

Infrastructure:

Vercel (Frontend deployment)
Render.com (Backend deployment)
Structured logging with tags for observability

Lessons Learned and Takeaways

Read Auth0 Docs Thoroughly: Management API is hidden in advanced docs—don't miss it
Use Structured Logging Early: [TAG] prefixes make production debugging trivial
Test with Real APIs: Mock data hides integration issues
Deploy Often: Vercel + Render made continuous deployment seamless
Validate in Production: Local testing ≠ real-world behavior

🚀 Next Steps

If I had more time, I'd add:

Email Integration: Schedule from Gmail threads
Token Vault of Auth0: Store other sensitive info securel
Multi-Calendar Support: Merge personal + work calendars
More Agentic: Integrate with more platforms
Your feedback!: Feature requests from early users

🙏 Thank You

Huge thanks to Auth0 and the DEV Community for this challenge! Building VaultMind demonstrated that secure AI agents are feasible today with the right architecture. This project ignited my motivation to explore new technologies, and I’m thrilled to build more tools in the future. I genuinely appreciate the opportunity to participate. I made numerous mistakes, but I learned a lot along the way. Just start! Do it right! Do it better. That’s all.

Special shoutout to:

Auth0 Management API docs (excellent tools for security)—I’m eager to explore more Auth0 features.
OpenAI GPT-4o-mini (affordable and powerful).
Google Calendar API (surprisingly well-designed)—I look forward to exploring more Google APIs.

Try VaultMind: https://vaultmind-app.vercel.app

GitHub: https://github.com/mrdaiking/vaultmind

TechCodx: https://techcodx.com

Twitter/X: https://twitter.com/techcodx)

Twitter/X: https://twitter.com/cuongnp0506

Youtube: https://www.youtube.com/@techcodx

Built with ❤️ for the Auth0 for AI Agents Challenge

Build Your First MCP Server with Notion and OpenAI - A Developer's Guide

cuongnp — Mon, 13 Oct 2025 13:51:11 +0000

Introduction

Hey developers! 👋

MCP (Model Context Protocol) is everywhere these days, but let's be honest - most explanations are too abstract. Today, we'll get our hands dirty and build something real: a smart assistant that answers questions about your Notion tasks using OpenAI.

No fluff, just code. By the end of this post, you'll have a working MCP system that you can actually use!

What We'll Learn

Build a complete MCP architecture from scratch
Connect OpenAI (Host) ↔ Node.js (Client) ↔ Notion (Server)
Implement JSON-RPC 2.0 communication
Create a simple web UI for testing
80% hands-on coding, 20% theory ⚡

Prerequisites

Before we start coding:

Notion account with a task database (enable developer mode)
OpenAI API key
Node.js installed
Basic JavaScript knowledge

Tech Stack

Node.js/Express - Backend server and MCP components
OpenAI GPT - AI Host for natural language processing
Notion API - Data source for tasks
JSON-RPC 2.0 - Communication protocol between components
HTML/JavaScript - Simple frontend UI

How It Works

Here's the architecture we're building:

The flow:

User asks: "What tasks are due this week?"
OpenAI (Host) calls MCP Client with context
Client sends JSON-RPC request to MCP Server
Server queries Notion API
Data flows back up the chain
OpenAI generates a natural language answer

Project Structure

mcp-demo/
├── server.js          # Express app + Host entrypoint
├── mcpHost.js         # OpenAI integration + orchestration
├── mcpClient.js       # JSON-RPC client communication
├── mcpRpcServer.js    # JSON-RPC server + Notion queries
├── notion.js          # Notion API wrapper
├── gpt.js             # OpenAI API wrapper
├── public/
│   └── index.html     # Web UI
└── package.json

Step-by-Step Implementation

1. Set Up the Project

mkdir mcp-demo && cd mcp-demo
npm init -y
npm install express axios dotenv

Create .env file:

NOTION_TOKEN=your_notion_integration_token
NOTION_DATABASE_ID=your_notion_database_id
OPENAI_API_KEY=your_openai_api_key

2. Build the Notion API Handler

Create notion.js:

const axios = require('axios');

class NotionClient {
  constructor() {
    this.token = process.env.NOTION_TOKEN;
    this.databaseId = process.env.NOTION_DATABASE_ID;
    this.baseURL = 'https://api.notion.com/v1';
  }

  async queryTasks(filter = {}) {
    try {
      const response = await axios.post(
        `${this.baseURL}/databases/${this.databaseId}/query`,
        { filter },
        {
          headers: {
            'Authorization': `Bearer ${this.token}`,
            'Notion-Version': '2022-06-28',
            'Content-Type': 'application/json'
          }
        }
      );

      return this.formatTasks(response.data.results);
    } catch (error) {
      throw new Error(`Notion API error: ${error.message}`);
    }
  }

  formatTasks(rawTasks) {
    return rawTasks.map(task => ({
      id: task.id,
      title: task.properties.Name?.title[0]?.text?.content || 'Untitled',
      status: task.properties.Status?.select?.name || 'No Status',
      due_date: task.properties.Due?.date?.start || null,
      priority: task.properties.Priority?.select?.name || 'Normal'
    }));
  }
}

module.exports = NotionClient;

3. Create the MCP Server (JSON-RPC)

Create mcpRpcServer.js:

const express = require('express');
const NotionClient = require('./notion');

const app = express();
app.use(express.json());

const notionClient = new NotionClient();

// JSON-RPC 2.0 handler
app.post('/rpc', async (req, res) => {
  const { jsonrpc, method, params, id } = req.body;

  try {
    let result;

    switch (method) {
      case 'getTasks':
        result = await notionClient.queryTasks(params?.filter);
        break;

      case 'getTasksByStatus':
        result = await notionClient.queryTasks({
          property: 'Status',
          select: { equals: params.status }
        });
        break;

      default:
        throw new Error(`Method not found: ${method}`);
    }

    res.json({ jsonrpc: '2.0', result, id });
  } catch (error) {
    res.json({
      jsonrpc: '2.0',
      error: { code: -32603, message: error.message },
      id
    });
  }
});

const PORT = process.env.RPC_PORT || 3001;
app.listen(PORT, () => {
  console.log(`🚀 MCP RPC Server running on port ${PORT}`);
});

4. Build the MCP Client

Create mcpClient.js:

const axios = require('axios');

class MCPClient {
  constructor(serverUrl = 'http://localhost:3001/rpc') {
    this.serverUrl = serverUrl;
    this.requestId = 0;
  }

  async call(method, params = {}) {
    const payload = {
      jsonrpc: '2.0',
      method,
      params,
      id: ++this.requestId
    };

    try {
      const response = await axios.post(this.serverUrl, payload, {
        headers: { 'Content-Type': 'application/json' }
      });

      if (response.data.error) {
        throw new Error(response.data.error.message);
      }

      return response.data.result;
    } catch (error) {
      throw new Error(`MCP Client error: ${error.message}`);
    }
  }

  // Convenience methods
  async getTasks() {
    return this.call('getTasks');
  }

  async getTasksByStatus(status) {
    return this.call('getTasksByStatus', { status });
  }
}

module.exports = MCPClient;

5. Create the OpenAI Handler

Create gpt.js:

const axios = require('axios');

class GPTClient {
  constructor() {
    this.apiKey = process.env.OPENAI_API_KEY;
    this.baseURL = 'https://api.openai.com/v1';
  }

  async generateAnswer(userQuestion, contextData) {
    const messages = [
      {
        role: 'system',
        content: `You are a helpful assistant that answers questions about Notion tasks. 
                 Use the provided context data to give accurate, friendly answers.
                 Context: ${JSON.stringify(contextData, null, 2)}`
      },
      {
        role: 'user',
        content: userQuestion
      }
    ];

    try {
      const response = await axios.post(
        `${this.baseURL}/chat/completions`,
        {
          model: 'gpt-3.5-turbo',
          messages,
          temperature: 0.7,
          max_tokens: 500
        },
        {
          headers: {
            'Authorization': `Bearer ${this.apiKey}`,
            'Content-Type': 'application/json'
          }
        }
      );

      return response.data.choices[0].message.content;
    } catch (error) {
      throw new Error(`OpenAI error: ${error.message}`);
    }
  }
}

module.exports = GPTClient;

6. Build the MCP Host

Create mcpHost.js:

const MCPClient = require('./mcpClient');
const GPTClient = require('./gpt');

class MCPHost {
  constructor() {
    this.mcpClient = new MCPClient();
    this.gptClient = new GPTClient();
  }

  async processQuestion(userQuestion) {
    try {
      // Determine what data we need based on the question
      let contextData;

      if (userQuestion.toLowerCase().includes('incomplete') || 
          userQuestion.toLowerCase().includes('todo')) {
        contextData = await this.mcpClient.getTasksByStatus('To Do');
      } else if (userQuestion.toLowerCase().includes('done') || 
                 userQuestion.toLowerCase().includes('completed')) {
        contextData = await this.mcpClient.getTasksByStatus('Done');
      } else {
        // Default: get all tasks
        contextData = await this.mcpClient.getTasks();
      }

      // Generate natural language response
      const answer = await this.gptClient.generateAnswer(userQuestion, contextData);

      return {
        success: true,
        answer,
        tasksCount: contextData.length
      };
    } catch (error) {
      return {
        success: false,
        error: error.message
      };
    }
  }
}

module.exports = MCPHost;

7. Create the Main Server

Create server.js:

require('dotenv').config();
const express = require('express');
const path = require('path');
const MCPHost = require('./mcpHost');

const app = express();
app.use(express.json());
app.use(express.static('public'));

const mcpHost = new MCPHost();

// API endpoint for questions
app.post('/ask', async (req, res) => {
  const { question } = req.body;

  if (!question) {
    return res.status(400).json({ error: 'Question is required' });
  }

  const result = await mcpHost.processQuestion(question);
  res.json(result);
});

app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'public', 'index.html'));
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`🎉 MCP Demo running at http://localhost:${PORT}`);
});

8. Create the Web UI

Create public/index.html:

<!DOCTYPE html>
<html>
<head>
    <title>MCP Demo - Ask About Your Notion Tasks</title>
    <style>
        body { font-family: Arial, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; }
        .chat-container { border: 1px solid #ddd; height: 400px; overflow-y: scroll; padding: 10px; margin: 10px 0; }
        .message { margin: 10px 0; padding: 10px; border-radius: 5px; }
        .user { background: #e3f2fd; text-align: right; }
        .assistant { background: #f1f8e9; }
        input[type="text"] { width: 70%; padding: 10px; }
        button { padding: 10px 20px; background: #2196F3; color: white; border: none; border-radius: 5px; cursor: pointer; }
    </style>
</head>
<body>
    <h1>🤖 MCP Demo: Ask About Your Notion Tasks</h1>
    <p>Try asking: "What tasks do I have?", "Show me incomplete tasks", "List done items"</p>

    <div id="chat" class="chat-container"></div>

    <input type="text" id="question" placeholder="Ask about your Notion tasks..." />
    <button onclick="askQuestion()">Ask</button>

    <script>
        async function askQuestion() {
            const question = document.getElementById('question').value;
            if (!question.trim()) return;

            addMessage(question, 'user');
            document.getElementById('question').value = '';

            try {
                const response = await fetch('/ask', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ question })
                });

                const result = await response.json();

                if (result.success) {
                    addMessage(result.answer, 'assistant');
                } else {
                    addMessage(`Error: ${result.error}`, 'assistant');
                }
            } catch (error) {
                addMessage(`Network error: ${error.message}`, 'assistant');
            }
        }

        function addMessage(text, sender) {
            const chat = document.getElementById('chat');
            const message = document.createElement('div');
            message.className = `message ${sender}`;
            message.textContent = text;
            chat.appendChild(message);
            chat.scrollTop = chat.scrollHeight;
        }

        document.getElementById('question').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') askQuestion();
        });
    </script>
</body>
</html>

🚀 Running Your MCP Demo

Start the MCP RPC Server:

   node mcpRpcServer.js

Start the main application:

   node server.js

Open your browser: Go to http://localhost:3000
Ask questions like:
- "What tasks do I have?"
- "Show me incomplete items"
- "List all done tasks"

Database Notion:

What is the difference between MCP vs Function Calling?

Function Calling is OpenAI calling your functions directly. MCP is a standardized protocol where:

Multiple AI systems can use the same servers
Better separation of concerns
Standardized communication via JSON-RPC
More scalable for complex architectures

What is the difference between MCP vs HTTP APIs

Aspect	MCP	HTTP API
Protocol	JSON-RPC 2.0	REST/GraphQL
Standardization	High	Varies
AI Integration	Native	Custom
Tooling	Growing	Mature

Next Steps

Want to level up? Try adding:

Authentication for secure access
Caching for better performance
Multiple data sources (Google Calendar, Trello, etc.)
Advanced filtering based on user intent
Real-time updates with WebSockets

Reference

Conclusion

You just built a complete MCP system! 🎉 This architecture pattern is powerful because it standardizes how AI systems communicate with data sources. As MCP adoption grows, you'll be ahead of the curve.

What's next? Try this pattern with your own data sources. The possibilities are endless!

Want more hands-on AI tutorials? Check out my blog at techcodx.com for the latest in AI development, DevOps automation, and practical coding tutorials. Let's build the future together! 🚀

Found this helpful? Drop a ❤️ and share with your dev friends!

How to Build an AI-Powered Code Review Bot with GitHub Action, Slack, and LLMs

cuongnp — Tue, 23 Sep 2025 04:10:38 +0000

Introduction

Recently I usually see many teams struggle with code reviews due to time constraints and inconsistent feedback. So, I decided to create an AI-powered code review bot that automates the process, providing quick and consistent feedback on pull requests. In this post, I'll walk you through building this bot using GitHub Actions, Slack, and LLMs.

What You’ll Learn

How to trigger AI code reviews on every pull request
How to send review results to Slack with interactive buttons
How to connect GitHub, Slack, and your backend for seamless automation
How to use LLMs (like OpenAI) for code intelligence

How It Works

Figure: System Architecture Overview

Tech Stack

GitHub Actions for automation
NextJs for example codebase
Node.js/Express backend for Slack interactivity
Slack App for notifications and actions (You should create a trial workspace, and 2 accounts for testing)
Cloudflare Tunnel a free service that creates a temporary, secure, and public-facing URL for your localhost-based services
OpenAI (or any LLM) for code review intelligence (OpenAI, Gemini, etc)

Prerequisites

GitHub account
Slack workspace
Node.js (v18+)
GitHub personal access token (repo, pull_requests scopes)
Slack bot token (chat:write, commands, interactivity)
OpenAI API key (or other LLM provider)
(Optional) ngrok or Cloudflare Tunnel for local testing

Project folder

Here’s the project structure:

code-review-llm/
├── .github/
│   └── workflows/
│       └── code-review.yml         # GitHub Actions workflow for AI code review
├── src/
│   └── services/
│       ├── reviewRunner.js         # Main script to run LLM code review
│       ├── llmService.js           # LLM API integration
│       ├── reviewService.js        # Review logic
│       └── ...                     # Other utilities/services
├── public/
│   └── vite.svg                    # Static assets
├── App.jsx, main.jsx, App.css      # Frontend entry and styles
├── package.json, README.md         # Project metadata and docs
└── slack-backend/
    ├── index.js                    # Express backend for Slack interactivity
    ├── package.json                # Backend dependencies
    ├── .env                        # Backend environment variables (not committed)
    └── README.md                   # Backend setup instructions

Step-by-Step Guide

1. Set Up the GitHub Action

Triggers on pull requests, runs AI review, posts to Slack.
Add OPENAI_API_KEY and SLACK_BOT_TOKEN as repository secrets.

Figure: GitHub Action Setting

name: AI Code Review
on:
  pull_request:
    types: [opened, synchronize, reopened]
jobs:
  code-review:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      pull-requests: write
      actions: read
      issues: read
    steps:
      - name: Checkout code
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
          token: ${{ secrets.GITHUB_TOKEN }}
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '18'
          cache: 'npm'
      - name: Install dependencies
        run: npm ci
      - name: Get PR diff
        id: diff
        run: |
          git fetch origin ${{ github.event.pull_request.base.ref }}
          DIFF=$(git diff origin/${{ github.event.pull_request.base.ref }}...HEAD --unified=3)
          echo "diff<<EOF" >> $GITHUB_OUTPUT
          echo "$DIFF" >> $GITHUB_OUTPUT
          echo "EOF" >> $GITHUB_OUTPUT
      - name: Run AI Code Review
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
          PR_NUMBER: ${{ github.event.pull_request.number }}
          REPO_OWNER: ${{ github.repository_owner }}
          REPO_NAME: ${{ github.event.repository.name }}
          PR_DIFF: ${{ steps.diff.outputs.diff }}
        run: node src/services/reviewRunner.js
      - name: Send review summary log to Slack
        env:
          SLACK_BOT_TOKEN: ${{ secrets.SLACK_BOT_TOKEN }}
        run: |
          SUMMARY=$(cat review-summary.txt 2>/dev/null || echo "No summary file found.")
          curl -X POST https://slack.com/api/chat.postMessage \
            -H "Authorization: Bearer $SLACK_BOT_TOKEN" \
            -H "Content-type: application/json" \
            --data "{\"channel\": \"test-bot\", \"text\": \"$SUMMARY\"}"
      - name: Send LLM review to Slack with buttons
        env:
          SLACK_BOT_TOKEN: ${{ secrets.SLACK_BOT_TOKEN }}
        run: |
          curl -X POST https://slack.com/api/chat.postMessage \
            -H "Authorization: Bearer $SLACK_BOT_TOKEN" \
            -H "Content-type: application/json" \
            --data '{
              "channel": "test-bot",
              "text": "Code review for PR #${{ github.event.pull_request.number }}: ${{ github.event.pull_request.title }}",
              "blocks": [
                {
                  "type": "section",
                  "text": {
                    "type": "mrkdwn",
                    "text": "*Code Review Request*\n*PR #${{ github.event.pull_request.number }}:* ${{ github.event.pull_request.title }}\n\n*LLM Review:*\nReview output here\n\nPlease review and take action below:"
                  }
                },
                {
                  "type": "actions",
                  "elements": [
                    {
                      "type": "button",
                      "text": { "type": "plain_text", "text": "✅ Approve" },
                      "value": "approve_${{ github.event.pull_request.number }}",
                      "action_id": "approve_action",
                      "style": "primary"
                    },
                    {
                      "type": "button",
                      "text": { "type": "plain_text", "text": "💬 Request Changes" },
                      "value": "comment_${{ github.event.pull_request.number }}",
                      "action_id": "comment_action",
                      "style": "danger"
                    }
                  ]
                }
              ]
            }'

2. Backend for Slack Interactivity

Handles button clicks and updates GitHub PRs.
Use a dedicated GitHub bot account for API token.

app.post('/slack/interactive', async (req, res) => {
  const payload = JSON.parse(req.body.payload);
  const { actions, user, response_url } = payload;
  const action = actions[0];
  const prNumber = action.value.replace(/^(approve|comment)_/, '');
  if (action.action_id === 'approve_action') {
    // Approve PR via GitHub API
});

Use Cloudflare Tunnel or ngrok for local testing.

npm install -g cloudflared
cloudflared tunnel --url http://localhost:3000

Configure Slack app with the tunnel URL for interactivity.

Figure: Slack Request URL

4. Create a new branch and push a commit

Open a pull request to see the bot in action and we got the result like below:

Figure: AI code review summary

We will see the bot posts a summary to Slack with buttons to approve or request changes.

Figure: Slack bot message

Clicking "Approve" or "Request Changes" will update the PR accordingly.

Figure: Approve or Request Changes

Next Steps

Extend Slack actions (e.g., custom comments, assign reviewers)
Integrate with other chat tools (Discord, Teams)

Repo

GitHub: code-review-llm

Conclusion

You’ve built an AI-powered code review bot that saves time and boosts productivity. Try customizing it for your team and share your results!

This post is originally published on TechCodex - If you found this guide helpful, please share it with your network and leave a comment below! Happy coding! 🚀

Automate Next.js Deployment to AWS EC2 with Ansible — A Beginner-Friendly Guide

cuongnp — Sat, 16 Aug 2025 03:13:51 +0000

The Problem: Manual Deployment Hell

Picture this: You've built an amazing Next.js app. Your users love it. But every time you want to deploy a new feature, you have to:

SSH into your server
Pull the latest code
Run npm install and npm run build
Restart your app
Pray nothing breaks

In my company, our maintainer had to update apps one by one across multiple servers. It was slow, error-prone, and frankly... boring.

I thought to myself: "Can I automate this process?"

The answer? Yes! And that's where Ansible comes in.

What is Ansible? (Explained for JavaScript Developers)

Think of Ansible like package.json scripts, but for servers instead of your local machine.

Instead of running:

npm run build
npm start

You write an Ansible "playbook" that does this across multiple servers automatically:

- name: Build and deploy Next.js app
  hosts: all
  tasks:
    - name: Install dependencies
      npm: path=/home/app
    - name: Build app
      command: npm run build
    - name: Start with PM2
      command: pm2 start ecosystem.config.js

The magic? One command deploys to 1 server or 100 servers. Same process, zero headaches.

Our Deployment Architecture

Here's what we're building:

Why this setup?

GitHub Actions: Free CI/CD (if you're already using GitHub)
Ansible Controller: One place to manage all deployments
Multiple App Servers: Scale easily by adding more EC2 instances

Step 1: Create Your Ansible Controller (EC2)

First, let's set up our "command center" — an EC2 instance that will run Ansible.

Launch EC2 Instance

AMI: Amazon Linux 2 (free tier eligible)
Instance Type: t2.micro (free tier)
Security Group: Allow SSH (port 22) from your IP
Key Pair: Create or use existing (you'll need this!)

Install Ansible

SSH into your controller and run:

sudo yum update -y
sudo yum install -y python3-pip
pip3 install ansible --user

# Add to PATH
echo 'export PATH=$HOME/.local/bin:$PATH' >> ~/.bashrc
source ~/.bashrc

# Verify installation
ansible --version

💡 Pro Tip: Save your SSH key (.pem file) securely — you'll need it for GitHub Actions later!

Step 2: Create Your App Server(s)

Now let's create the EC2 instance(s) where your Next.js app will run.

Launch App Server EC2

AMI: Amazon Linux 2023 (newer, better performance)
Instance Type: t3.micro or larger (depending on your app)
Security Group:
- SSH (port 22) from Ansible Controller
- HTTP (port 3000) from anywhere (or your Load Balancer)
Key Pair: Same as your Ansible Controller

Test SSH Connection

From your Ansible Controller, test that you can reach your app server:

ssh -i ~/.ssh/your-key.pem ec2-user@YOUR-APP-SERVER-IP

If this works, you're ready for the next step!

Step 3: Create the Ansible Playbook

This is where the magic happens. Create a file called deploy.yml:

- name: Deploy Next.js app to EC2
  hosts: nextjs_servers
  gather_facts: yes
  become: yes
  vars:
    app_dir: /home/ec2-user/app
    app_owner: ec2-user
    app_group: ec2-user
    app_repo: https://github.com/YOUR-USERNAME/YOUR-REPO.git
    app_branch: main
    app_subdir: my-nextjs-app
  tasks:
    - name: Check if Node.js is installed
      ansible.builtin.command: node -v
      register: node_check
      ignore_errors: true
      changed_when: false

    - name: Ensure prerequisites are installed on Amazon/RedHat (dnf)
      when: (ansible_facts.os_family | lower) in ["redhat"] or (ansible_facts.distribution == 'Amazon')
      ansible.builtin.dnf:
        name:
          - git
          - ca-certificates
        state: present

    - name: Ensure application directory exists
      ansible.builtin.file:
        path: "{{ app_dir }}"
        state: directory
        owner: "{{ app_owner }}"
        group: "{{ app_group }}"
        mode: "0755"

    - name: Checkout application repository
      ansible.builtin.git:
        repo: "{{ app_repo }}"
        dest: "{{ app_dir }}"
        version: "{{ app_branch }}"
        force: yes
        update: yes
      become_user: "{{ app_owner }}"

    - name: Install Node.js 18.x on Amazon Linux 2023
      when: ansible_facts.distribution == 'Amazon' and ansible_facts.distribution_major_version == '2023' and (node_check.rc is defined and node_check.rc != 0)
      ansible.builtin.shell: |
        set -e
        sudo dnf -y install nodejs
      args:
        executable: /bin/bash

    - name: Install PM2 globally
      when: pm2_check.rc is defined and pm2_check.rc != 0
      ansible.builtin.shell: |
        set -e
        sudo npm install -g pm2
      args:
        executable: /bin/bash

    - name: Ensure 2G swapfile exists (to avoid OOM during npm install)
      when: (swap_status.stdout | trim) == ""
      block:
        - name: Allocate swapfile
          ansible.builtin.command: fallocate -l 2G /swapfile
          args:
            creates: /swapfile
        - name: Set swapfile permissions
          ansible.builtin.file:
            path: /swapfile
            mode: "0600"
        - name: Format and enable swapfile
          ansible.builtin.shell: |
            mkswap /swapfile
            swapon /swapfile

    - name: Install dependencies
      become_user: "{{ app_owner }}"
      ansible.builtin.shell: |
        set -e
        if [ -f package-lock.json ]; then
          npm ci --no-audit --no-fund --prefer-offline
        else
          npm install --no-audit --no-fund --prefer-offline
        fi
      args:
        chdir: "{{ working_dir }}"
        executable: /bin/bash
      environment:
        NODE_OPTIONS: "--max-old-space-size=512"

    - name: Build Next.js app
      become_user: "{{ app_owner }}"
      ansible.builtin.shell: |
        set -e
        npm run build
      args:
        chdir: "{{ working_dir }}"
        executable: /bin/bash

    - name: Start or restart app with PM2
      become_user: "{{ app_owner }}"
      ansible.builtin.shell: |
        set -e
        pm2 start npm --name "nextjs-app" -- run start || pm2 restart nextjs-app
        pm2 save
      args:
        chdir: "{{ working_dir }}"
        executable: /bin/bash

Create Inventory File

Create inventory.ini:

[nextjs_servers]
your-app-server-ip ansible_user=ec2-user ansible_ssh_private_key_file=~/.ssh/your-key.pem

🎯 What this playbook does:
✅ Installs Node.js and PM2
✅ Clones your latest code
✅ Installs dependencies safely
✅ Builds your Next.js app
✅ Starts it with PM2 (keeps running even if SSH disconnects)

Step 4: Test Your Playbook Locally

Before automation, let's make sure everything works:

# Test connection
ansible all -i inventory.ini -m ping

# Run the full deployment
ansible-playbook -i inventory.ini deploy.yml

If everything works, you should see:

✅ All tasks completed successfully
✅ Your Next.js app running on http://your-server-ip:3000

Step 5: Automate with GitHub Actions

Now for the automation magic! Create .github/workflows/deploy.yml in your Next.js repository:

name: Deploy with Ansible

on:
  push:
    branches: [main]
  workflow_dispatch: {}

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: 📥 Checkout repository code
        uses: actions/checkout@v4

      - name: 🔐 Setup SSH key for server access
        shell: bash
        run: |
          set -euo pipefail
          mkdir -p ~/.ssh && chmod 700 ~/.ssh

          # Create temporary file for the key
          TMP_KEY=$(mktemp)
          printf "%s" "${{ secrets.ANSIBLE_SSH_PRIVATE_KEY }}" > "$TMP_KEY"

          # Handle different key formats
          if grep -q "BEGIN .*PRIVATE KEY" "$TMP_KEY"; then
            echo "✅ Found PEM format key"
            cp "$TMP_KEY" ~/.ssh/id_rsa
          else
            echo "🔧 Trying to decode as base64..."
            base64 -d "$TMP_KEY" > ~/.ssh/id_rsa
          fi

          chmod 600 ~/.ssh/id_rsa

          # Validate the key
          if ! ssh-keygen -y -f ~/.ssh/id_rsa >/dev/null 2>&1; then
            echo "❌ SSH key is invalid!"
            exit 1
          fi

          eval "$(ssh-agent -s)"
          ssh-add ~/.ssh/id_rsa
          rm -f "$TMP_KEY"

      - name: 🔒 Add server fingerprints to known hosts
        shell: bash
        run: |
          for host in "${{ secrets.ANSIBLE_HOST }}" "${{ secrets.ANSIBLE_APP_HOST }}"; do
            if [[ -n "$host" ]]; then
              ssh-keyscan -H "$host" >> ~/.ssh/known_hosts 2>/dev/null || true
            fi
          done

      - name: 🚀 Deploy Next.js app via Ansible
        shell: bash
        run: |
          set -euo pipefail

          USER_TO_USE="ec2-user"
          CONTROL_HOST="${{ secrets.ANSIBLE_HOST }}"
          SSH_OPTS="-o StrictHostKeyChecking=no -o ServerAliveInterval=30"

          # Create workspace on control host
          ssh ${SSH_OPTS} "${USER_TO_USE}@${CONTROL_HOST}" \
            "sudo install -d -m 755 -o ${USER_TO_USE} -g ${USER_TO_USE} /home/${USER_TO_USE}/deploy"

          # Upload playbook
          scp ${SSH_OPTS} ansible/deploy.yml "${USER_TO_USE}@${CONTROL_HOST}:/home/${USER_TO_USE}/deploy/"

          # Create inventory
          INVENTORY=$(mktemp)
          cat > "$INVENTORY" <<'INV'
          [nextjs_servers]
          app ansible_host=${{ secrets.ANSIBLE_APP_HOST }} ansible_user=ec2-user ansible_ssh_private_key_file=/home/ec2-user/.ssh/your_key.pem
          INV

          scp ${SSH_OPTS} "$INVENTORY" "${USER_TO_USE}@${CONTROL_HOST}:/home/${USER_TO_USE}/deploy/inventory.ini"
          rm -f "$INVENTORY"

          # Install Ansible if needed
          ssh ${SSH_OPTS} "${USER_TO_USE}@${CONTROL_HOST}" '
            if ! command -v ansible-playbook >/dev/null 2>&1; then
              sudo yum -y install python3-pip
              python3 -m pip install --user ansible
              echo "export PATH=\"$HOME/.local/bin:$PATH\"" >> ~/.bashrc
            fi
          '

          # Run deployment
          ssh ${SSH_OPTS} "${USER_TO_USE}@${CONTROL_HOST}" \
            "PATH=\"\$HOME/.local/bin:\$PATH\" ansible-playbook -i /home/${USER_TO_USE}/deploy/inventory.ini /home/${USER_TO_USE}/deploy/deploy.yml"

          echo "🎉 Deployment completed successfully!"

Add GitHub Secrets

In your GitHub repo, go to Settings → Secrets → Actions and add:

ANSIBLE_SSH_PRIVATE_KEY: Your .pem file content (the whole file!)
ANSIBLE_HOST: Your Ansible Controller's public IP
ANSIBLE_APP_HOST: Your app server's IP

⚠️ Important: Never commit SSH keys to your repository. Always use GitHub Secrets!

Step 6: Deploy and Celebrate! 🎉

Now comes the moment of truth:

Commit and push your changes to the main branch
Watch GitHub Actions run your workflow

Visit your app at http://your-server-ip:3000

If everything worked, you'll see your Next.js app running!

Troubleshooting Common Issues

"SSH Connection Refused"

Check Security Groups allow port 22
Verify your SSH key is correct
Test manual SSH connection first

"npm install fails with error 137"

This is an out-of-memory error. The playbook includes a swapfile creation to prevent this.

"Playbook not found"

Make sure your file paths in the GitHub Actions workflow match your actual file structure.

Going Beyond: Scale Like a Pro

Deploy to Multiple Servers

Add more servers to your inventory.ini:

[nextjs_servers]
app-server-1 ansible_user=ec2-user
app-server-2 ansible_user=ec2-user  
app-server-3 ansible_user=ec2-user

One command now deploys to all servers! 🚀

Add a Load Balancer

Use AWS Application Load Balancer to distribute traffic across your servers.

Environment Variables

Add environment-specific configs to your playbook:

- name: Create .env file
  copy:
    content: |
      NODE_ENV=production
      DATABASE_URL={{ database_url }}
      API_KEY={{ api_key }}
    dest: "{{ app_dir }}/.env"

What's Next?

This setup gives you a solid foundation, but there's always room to grow:

Docker + ECS/EKS for container-based deployments
Blue-Green deployments for zero-downtime updates
Monitoring with tools like New Relic or Datadog
Automated testing before deployment

But honestly? What you've built here can handle most real-world applications. I've used similar setups for production apps serving thousands of users.

Final Thoughts

Remember when deploying meant manually SSH-ing into servers and crossing your fingers? Those days are over.

With this setup, you push code and walk away. Ansible handles the rest. Your app deploys consistently every time, whether it's to 1 server or 100.

The best part? You learned this without becoming a DevOps expert. You're still a frontend/fullstack developer — just one who happens to know how to automate deployments like a pro.

Want to see more DevOps content for developers? Follow me and let me know in the comments what you'd like to automate next!

Originally published at TechByCuong.com

How Do Machines Learn? A Beginner-Friendly Breakdown

cuongnp — Mon, 21 Jul 2025 08:19:57 +0000

Introduction

In my previous post, I shared an overview of AI and how to start learning AI in 2025. Today, as we continue this series, let's dive deeper into the AI world and explore a fundamental concept.

Have you ever wondered why your phone's camera can recognize your face, or how Gmail automatically sorts spam emails? The answer lies in machine learning – but what does that actually mean?

Think of it like teaching a child to distinguish between cats and dogs. Parents show real-world examples, pointing out the differences until the child learns to identify them independently. Machine learning works similarly – we provide as many examples as possible during training, allowing the system to predict results based on vast amounts of data.

A perfect example of this is handwriting recognition applications, where machines learn to read different handwriting styles by analyzing thousands of writing samples.

Machine Learning is the science (and art) of programming computers so they can learn from data

— Aurélien Géron

Types of Machine Learning

Let's break down the three main types in simple terms:

Supervised Learning

The machine learns from labeled data, like teaching it to identify "spam" or "not spam" emails by showing thousands of pre-labeled examples.

Example: Email spam detection, medical diagnosis systems, image classification

Unsupervised Learning

The system finds hidden patterns in data without being given specific labels, like discovering customer groups based on purchasing behavior.

Example: Customer segmentation, recommendation systems, market research analysis

Reinforcement Learning

The machine learns through trial and error, receiving rewards for correct actions and penalties for mistakes – similar to training a pet or learning to play a game.

Example: Game-playing AI (like AlphaGo), autonomous vehicles, chatbot optimization

Real-World Machine Learning Applications

You interact with machine learning more often than you might think:

Social media feeds: Algorithms decide which posts you see first
Autonomous vehicles: Self-driving cars navigate using ML algorithms
Email filtering: Automatic spam detection and organization
Voice assistants: Siri, Alexa, and Google Assistant understand your commands
Streaming services: Netflix and Spotify recommendations
E-commerce: Product suggestions on Amazon and other platforms

Let's dive deeper in an example

Challenge: Predicting Home Values

Step 1: Import Libraries

import pandas as pd
from sklearn.linear_model import LinearRegression
from sklearn.model_selection import train_test_split
from matplotlib import pyplot as plt

What's happening here?

pandas - Think of this as Excel for Python. It helps us organize data in tables
LinearRegression - This is our AI "brain" that will learn to predict house prices
train_test_split - A helper that splits our data into "study material" and "exam questions"
matplotlib - For creating charts and graphs (like making a presentation)

Step 2: Create Sample Data (Our House Examples)

# Sample house data
data = {
    'bedrooms': [2, 3, 4, 2, 3, 4, 5, 3, 2, 4],
    'bathrooms': [1, 2, 3, 1, 2, 2, 3, 2, 1, 3],
    'sqft': [1000, 1500, 2000, 900, 1200, 1800, 2500, 1400, 800, 2200],
    'price': [200000, 300000, 400000, 180000, 250000, 350000, 500000, 280000, 150000, 420000]
}

What's happening here?

We're creating a dictionary (like a filing cabinet) with 4 categories
Each list contains 10 examples of houses with their features
bedrooms - How many bedrooms each house has
bathrooms - How many bathrooms each house has
sqft - Square footage (house size)
price - What each house actually sold for

Step 3: Convert Data to DataFrame (Organize Like a Spreadsheet)

df = pd.DataFrame(data)

What it looks like:

   bedrooms  bathrooms  sqft   price
0         2          1  1000  200000
1         3          2  1500  300000
2         4          3  2000  400000
...

Step 4: Separate Features and Target (Input vs Output)

# Features (input) and target (output)
X = df[['bedrooms', 'bathrooms', 'sqft']]
y = df['price']

What's happening here?

X (features) = What we KNOW about a house (bedrooms, bathrooms, size)
y (target) = What we want to PREDICT (the price)

Real-world analogy:

X = The house description you show to a real estate agent
y = The price estimate they give you back

Why this separation?

The machine needs to learn: "When I see these features (X), the price should be (y)"
It's like teaching a child: "When you see these clues, this is the answer"

Step 5: Split Data for Training and Testing (Study vs Exam)

# Split data into training and testing sets
X_train, X_test, y_train, y_test = train_test_split(X, y, test_size=0.2, random_state=42)

What's happening here?

test_size=0.2 means 20% for testing, 80% for training
random_state=42 ensures we get the same split every time (for consistency)

Step 6: Create the AI Model (Build the Brain)

# Create and train the model
model = LinearRegression()
model.fit(X_train, y_train)

What's happening here?

LinearRegression() creates an empty "brain" that can learn patterns
model.fit() is like the "learning" phase - it studies the training data

Step 7: Make a Prediction (Test the AI)

# Make predictions
new_house = pd.DataFrame([[3, 2, 1600]], columns=['bedrooms', 'bathrooms', 'sqft'])
predictions = model.predict(new_house)

What's happening here?

We create a new house with 3 bedrooms, 2 bathrooms, and 1600 sqft
model.predict() asks our trained AI: "What do you think this house costs?"
The AI uses what it learned to give us an estimated price

Step 8: Display the Results (Show the Answer)

print(f"House with 3 bedrooms, 2 bathrooms, 1600 sqft")
print(f"Predicted price: ${predictions[0]:,.2f}")

Step 9: Check Model Accuracy (How Good Is Our AI?)

# Show accuracy
accuracy = model.score(X_test, y_test)
print(f"Model accuracy: {accuracy:.2f}")

What we got

Run python your-code.py, you will got the result like this:

House with 3 bedrooms, 2 bathrooms, 1600 sqft
Predicted price: $311,844.96
Model accuracy: 0.98

Final thoughts

Machine learning isn't magic – it's all about data. The more quality data you have, the more accurate your results
Understanding these fundamentals is the best foundation for diving deeper into your AI journey
Every AI application you use daily relies on these core machine learning principles

Ready to explore more AI concepts? Follow along as we continue this journey into the fascinating world of artificial intelligence!

🔗 Enjoyed this post? Check out more on my blog:

👉 https://www.techcodx.com

AI in 2025: Why It Matters More Than Ever — And How Developers Can Ride the Wave

cuongnp — Sat, 12 Jul 2025 13:16:57 +0000

Back in 2016, I was a university student working on a search engine optimization assignment. We used a basic Python library — Scikit-learn — to optimize the search engine for an e-commerce site. It was fascinating, but at that time, I didn't feel deeply connected to it. So I chose a different path and became a mobile application engineer.

Fast forward to now — I've explored tools like ChatGPT, Gemini, TensorFlow, and more. Over the years, one thing became clear: AI is no longer coming — it's already here. And developers who learn how to use it now won't just keep up — they'll lead.

But before diving into the ocean of AI, we need to ask the essential question: Why?

Why We Need AI

In 2025, we're swimming in data — from social networks, sensors, websites, and apps. Traditional programming (if/else logic, rule-based systems) just can't keep up anymore.

We need systems that can learn, adapt, and find patterns on their own. That's where AI comes in.

"AI is no longer coming — it's already here. And developers who learn how to use it now won't just keep up — they'll lead."

AI, Machine Learning, Deep Learning, and GenAI

Understanding the AI landscape can be confusing with all the buzzwords. Let me break it down:

Artificial Intelligence (AI)

The broadest field — making machines think and act intelligently.
- Machine Learning (ML) Algorithms that learn from data without explicit programming.
- Deep Learning (DL) Neural networks with many layers for complex pattern recognition.
  - Generative AI (GenAI) Creates new content like text, images, and code using deep neural networks.

If AI is the car, ML is the engine, DL is the turbocharged version — and GenAI is the rocket that takes us to the moon.

A Quick History of AI (Only the Cool Stuff)

1956 – Birth of AI

The term "Artificial Intelligence" is coined at the Dartmouth Conference.
1997 – Deep Blue Wins

IBM's Deep Blue defeats chess champion Garry Kasparov.
2012 – ImageNet Breakthrough

Deep learning revolutionizes computer vision.
2022–24 – AI Goes Mainstream

ChatGPT, Gemini, and Claude reach millions worldwide.
2025 – Developer Integration

AI becomes essential in everyday development workflows.

What Developers Can Actually Do with AI

💡 Be friends with AI

Use tools like GitHub Copilot, ChatGPT, or Gemini to boost productivity. Think of them as your coding companion — not a replacement, but a powerful assistant.

⚡ Create faster than ever

Design UIs, debug code, generate boilerplate, or build MVPs in a fraction of the time.

Solve new problems

Analyze behavior, forecast trends, generate content, and build assistants that understand context.

Learn deeper with AI as your teacher

Use AI to break down algorithms, explain concepts, and deepen your understanding.

✳️ Proactive use of AI makes you a better, more efficient developer.

❌ Passive use turns you into someone who copies without learning.

And let's be real — you don't want to write a piece of code in 1 minute, only to spend the next 5 hours debugging what you didn't understand.

How to Learn AI in 2025 – A Practical Roadmap

Find Your "Why"

Do you want to build cool apps? Solve problems? Your "why" keeps you going.
Learn the Basics of Python

Python is beginner-friendly and the primary language of AI.
Understand Core AI/ML Concepts

Start with regression, classification, and neural networks. Focus on practical learning.
Try Prebuilt Tools

Use Hugging Face, Google's Teachable Machine, and ChatGPT to experiment.
Build a Project

Start small. Maybe a price predictor or sentiment analyzer. You’ll learn faster by building.
Dive Deeper with Frameworks

Explore TensorFlow or PyTorch and try building your own models.
Stay Updated

Follow trusted sources like OpenAI, Midjourney, and Hugging Face.

🤝 You're not alone

Join AI communities. Share your progress. Learn together. I’ll be sharing more in upcoming posts — let’s grow together.

Final Thought

Some developers ask: “Aren’t you afraid AI will replace you?”

Here’s the truth — AI is just a smarter search engine. And you can be replaced by anything, not just AI, if you stop learning.

So stop worrying. Start exploring.

AI is a tool. And when you know how to use it, you’ll go further, faster.

🔗 Enjoyed this post? Check out more on my blog:

👉 https://www.techcodx.com

Navigating the World of AI Agents: A Complete Guide for Developers and Non-Coders

cuongnp — Sun, 02 Mar 2025 08:23:11 +0000

What Are AI Agents in Today's AI Landscape?

AI Agents are autonomous or semi-autonomous systems that can perceive their environment, make decisions, and take actions to achieve specific goals. Unlike traditional AI systems that perform singular tasks, agents can combine multiple capabilities to solve complex problems through a series of coordinated actions. They represent the evolution from passive AI tools to proactive digital assistants that can initiate processes, manage workflows, and interact with various systems on behalf of users.

Modern AI agents typically consist of:

A foundation model (like GPT-4 or Claude) providing reasoning capabilities
Memory systems for context retention
Tools and API connections for real-world interaction
Planning mechanisms for multi-step tasks
Feedback loops for self-improvement

Real-World Applications of AI Agents

AI agents are transforming industries through practical applications that demonstrate their versatility:

Business Operations

Meeting assistants that join calls, take notes, extract action items, and follow up with participants
Customer service agents handling inquiries across multiple channels with human-like conversation
Research assistants gathering information from various sources and producing comprehensive reports

Personal Productivity

Email managers categorizing, summarizing, and drafting responses to correspondence
Personal shoppers searching for products across platforms based on preferences and budget
Learning companions creating personalized educational content and providing feedback

Technical Operations

Code maintenance agents reviewing repositories, suggesting improvements, and fixing issues
DevOps assistants monitoring systems, diagnosing problems, and implementing solutions
Data analysis agents cleaning datasets, running analyses, and visualizing results

For Non-Coders: Embracing AI Agents Without Technical Expertise

Even without programming knowledge, you can leverage AI agents through:

No-Code Platforms

Agent builders like Zapier's AI Actions, Bardeen, or Notion AI that offer visual interfaces
Workflow automation tools that integrate with existing applications
Pre-built agent templates that can be customized for specific needs

Practical Steps:

Identify repetitive tasks in your workflow that could benefit from automation
Explore consumer-facing agents like Anthropic's Claude or specialized tools like Mem or Copilot
Start with guided solutions that offer templates and step-by-step setup processes
Gradually increase complexity as you become comfortable with the technology
Join communities where you can learn from others' experiences and implementations

For Developers: Unlocking the Full Potential of AI Agents

As a developer, you can:

Build Custom Agents

Design domain-specific agents tailored to particular industries or use cases
Create multi-agent systems where specialized agents collaborate on complex tasks
Implement agent orchestration frameworks that coordinate multiple AI components

Extend Existing Capabilities

Develop custom tools and plugins for agent platforms
Create middleware connecting agents to proprietary systems and data sources
Build evaluation frameworks to measure and improve agent performance

Technical Integration

Incorporate agents into existing applications through APIs
Deploy agents as standalone services in cloud environments
Implement agent capabilities in mobile applications for on-device assistance

Building AI Agents: Technologies and Considerations

Core Components

Foundation Models: LLMs like GPT-4, Claude, Llama, or Mistral for reasoning and generation
Memory Systems: Vector databases (Pinecone, Weaviate) for retrieval and context management
Tool Integration: LangChain, LlamaIndex, or custom connectors for API access
Planning Frameworks: ReAct, Reflexion, or custom planning loops for complex tasks
Deployment Infrastructure: Docker, Kubernetes, or serverless platforms

Development Approaches

Agent Frameworks: LangChain, AutoGPT for faster development
Custom Architectures: Building proprietary agent systems for specific requirements
Hybrid Approaches: Combining pre-built components with custom elements

Critical Considerations

Safety and Alignment: Ensuring agents act according to human values and instructions
Privacy and Security: Protecting sensitive data and preventing unauthorized access
Reliability: Building robust systems that handle edge cases gracefully
Transparency: Making agent decision-making processes understandable
Cost Management: Optimizing for efficiency in token usage and API calls

Getting Started

Experiment with frameworks like LangChain or LlamaIndex
Build simple agents first, focusing on well-defined tasks
Implement robust evaluation methods to measure performance
Iterate based on user feedback and observed limitations
Scale gradually as reliability improves

By understanding these components and considerations, both developers and non-technical users can harness the power of AI agents to transform their workflows and create new possibilities in their respective domains.

🔥 Stop Duplicate Data! How Redis Locks Saved Our App from Firestore Trigger Chaos

cuongnp — Sat, 22 Feb 2025 09:00:03 +0000

Hey there, fellow developers! 👋 Today, I want to share a tricky problem I encountered with Firestore triggers and how Redis locks saved the day. If you're running distributed systems on multiple servers, this one's for you.

The Problem: Duplicate Data from Firestore Triggers

In our application, we had a Firestore trigger that would fire whenever a new document was created. This trigger was supposed to process the data and insert it into our items table. Simple enough, right?

Here's what our initial setup looked like:

const admin = require('firebase-admin');
const db = admin.firestore();

exports.onItemCreated = db.collection('items').onCreate(async (snap, context) => {
  const newItem = snap.data();

  try {
    // Initially, we just inserted the data directly
    await insertIntoItemsTable(newItem);
  } catch (error) {
    console.error('Error processing item:', error);
  }
});

The Plot Twist: Multiple EC2 Instances

Everything worked fine until we scaled to two EC2 instances. Then we noticed something odd - duplicate entries in our items table! The problem? Our Firestore trigger was running on both EC2 instances simultaneously, and our database constraints weren't enough to prevent duplicates.

Enter Redis Locks: The Solution

Here's how we fixed it using Redis locks:

const Redis = require('ioredis');
const admin = require('firebase-admin');

const redis = new Redis({
  host: 'your-redis-host',
  port: 6379
});
const db = admin.firestore();

exports.onItemCreated = db.collection('items').onCreate(async (snap, context) => {
  const newItem = snap.data();
  const documentId = snap.id;
  const lockKey = `lock:firestore:item:${documentId}`;

  try {
    // Try to acquire the lock
    const acquired = await redis.set(
      lockKey,
      'locked',
      'NX',  // Only set if key doesn't exist
      'EX',  // Set expiry
      30     // 30 seconds expiry
    );

    if (!acquired) {
      console.log(`Lock already acquired for document ${documentId}`);
      return;
    }

    // Now safely process and insert the item
    await insertIntoItemsTable(newItem);

    // Release the lock after successful processing
    await redis.del(lockKey);

  } catch (error) {
    console.error('Error processing item:', error);
    // Make sure to release the lock even if processing fails
    await redis.del(lockKey);
  }
});

async function insertIntoItemsTable(item) {
  // Your database insertion logic here
  // This will only run on one EC2 instance now!
}

Why This Works

Unique Lock per Document: We create a unique Redis lock using the Firestore document ID.
First Come, First Served: Only the first EC2 instance that acquires the lock processes the document.
Automatic Cleanup: The 30-second expiry ensures locks are released even if our process crashes.
Safe Release: We always release the lock whether the processing succeeds or fails.

Results in Production

After implementing this solution:

Zero duplicate entries in our items table
Clean processing logs
No more data inconsistencies
Better resource utilization (no wasted processing)

Key Learnings

Always Consider Distribution: Even simple triggers can cause issues in distributed environments.
Database Constraints Aren't Always Enough: Sometimes you need application-level locking.
Lock Timeouts Are Critical: Choose an expiry time that covers your longest possible processing time.
Monitor Lock Acquisition: Log when locks can't be acquired to track potential issues.

Tips for Implementation

Use a Redis client with good error handling
Implement proper monitoring for lock acquisition failures
Keep lock times as short as practical
Consider adding retry logic for lock acquisition in critical processes

Have you faced similar challenges with Firestore triggers or distributed processing? I'd love to hear your stories in the comments!

Happy coding! 🚀

How I Slashed CPU Usage by 20%: 5 Proven SQL Optimization Techniques

cuongnp — Sun, 25 Aug 2024 04:10:02 +0000

Last week, my team faced a serious issue with our RDS when the CPU usage spiked dramatically, causing significant disruptions to our system and impacting our clients. After investigating, we identified inefficient SQL queries as one of the primary cause. Here are the five key actions we took to improve performance.

First thing first: identifying the cause

The issue was clearly tied to SQL, but we needed to pinpoint the exact source—whether it was a specific cluster, database, or instance (master or slave). Fortunately, AWS provides robust tools that allowed us to track down the most resource-intensive queries.

The Approach

Efficient Use of Indexes
- We conducted a thorough review of all indexes on the affected tables. This involved analyzing the query execution plans to identify any missing or unused indexes. We then updated the DDL (Data Definition Language) to add indexes where necessary and removed those that were redundant. This helped in speeding up data retrieval by allowing the database to locate records more quickly.
Optimizing Joins
- We scrutinized the queries involving multiple table joins. By examining the relationships and data flow between tables, we identified opportunities to reduce the number of joins, particularly in cases where certain joins were unnecessary or could be replaced with more efficient subqueries. We also ensured that the joined columns were properly indexed to improve join performance.
Limiting Data Retrieval
- We noticed that several queries were fetching large volumes of data, much of which was unnecessary. To mitigate this, we used LIMIT clauses to restrict the number of rows returned by queries. We also optimized SELECT statements to retrieve only the specific columns needed, rather than using SELECT *, which retrieves all columns and can lead to inefficiencies.
Implementing Query Caching
- For queries that were frequently executed with the same parameters, we enabled query caching. This allowed the database to store the result set of these queries, so subsequent executions could be served from the cache instead of re-running the entire query. We carefully configured the cache expiration and invalidation settings to ensure data freshness while maximizing performance gains.
Optimizing Database Design
- We revisited the overall database design, focusing on areas that were causing bottlenecks. This included normalizing certain tables to reduce redundancy and improve data integrity, as well as denormalizing where appropriate to reduce the need for complex joins. We also scaled our architecture by adding read replicas (slave instances) to offload read operations from the master database, balancing the load and improving performance.

The Outcome

After implementing these optimizations, we saw a 20% reduction in CPUUtilization, leading to a more stable and efficient system.

Implementing CI/CD for ReactJS Projects: Gitlab + Slack

cuongnp — Tue, 23 Jul 2024 01:42:36 +0000

Scenario Overview

In my project, I have two primary servers: one for the development team and another for the Quality Control (QC) team. Each time a developer commits code, they need to build the project and commit the build files as a new commit on their branch. The build command used varies depending on the target environment, affecting the endpoints within the project.

To streamline this process, I set up a CI/CD pipeline using GitLab CI/CD, which automates the build and deployment steps and pushes the new commit to a dedicated deploy repository. Here's a step-by-step breakdown of the implemented workflow:

Developer Commits Code: Developers commit their changes to the repository.
Add Tag to Trigger CI/CD: To run the CI/CD pipeline, developers add a specific tag to their commit.
CI/CD Pipeline Execution: The pipeline runs, building the project based on the tag.
Push Build Artifact: The built artifacts are committed yo the deploy repository as a new commit.
Slack Notification: A notification is sent to Slack upon successful deployment.

Prerequisites

ReactJS project
Define two build types in package.json: build-dev and build-qc
Two repositories: develop and deploy
Two branches in the deploy repo: feature/develop_deploy and feature/testing_develop
Slack channel webhook URL

Let's dive into it!

CI/CD Configuration

1. Install Stage

install_dependencies:
  stage: install
  image: node:latest
  script:
    - npm install --legacy-peer-deps
  rules:
    - if: '$CI_COMMIT_TAG =~ /^build-(dev|qc)-.*$/'

Purpose: This stage installs all the necessary dependencies required for the project.

image: node: Specifies the Docker image to be used for this stage. Here, I use the latest Node.js image.
script: Contains the commands to be executed in this stage. In this case, it runs npm install --legacy-peer-deps to install the Node.js dependencies, allowing for compatibility with older peer dependencies.
rules: This specifies when the job should run. It uses a regular expression to check if the commit tag matches the pattern build-dev- or build-qc-, meaning this job runs only if such tags are present.

2. Build Stage

build_project:
  stage: build
  image: node:latest
  script:
    - echo "CI_COMMIT_TAG=$CI_COMMIT_TAG" 
    - >
      if [[ "$CI_COMMIT_TAG" == "build-dev"* ]]; then
        npm run build:dev
      elif [[ "$CI_COMMIT_TAG" == "build-qc"* ]]; then
        npm run build:qc
      else
        echo "No specific build command for this tag."
      fi
  artifacts:
    paths:
      - build/
    expire_in: 1 hour
  rules:
    - if: '$CI_COMMIT_TAG =~ /^build-(dev|qc)-.*$/'

Purpose: This stage builds the project based on the environment specified by the tag.

image: node: Uses the latest Node.js image.
script: Executes the following commands:
- echo "CI_COMMIT_TAG=$CI_COMMIT_TAG": Prints the commit tag to verify the tag.
- The conditional block checks the tag:
  - If the tag starts with build-dev, it runs npm run build:dev.
  - If the tag starts with build-qc, it runs npm run build:qc.
  - Otherwise, it prints a message saying no specific build command is found for the tag.
artifacts: Specifies the files to be preserved after the job is done. Here, it keeps the build/ directory for 1 hour.
rules: Similar to the install stage, this job runs only if the commit tag matches the pattern build-dev- or build-qc-.

3: Deploy Stage

deploy_project:
  stage: deploy
  image: alpine:latest
  before_script:
    - apk update && apk add git openssh-client
    - eval $(ssh-agent -s)
    - echo "$SSH_PRIVATE_KEY" | tr -d '\r' > private_key
    - chmod 600 private_key
    - ls -l private_key  # Verify the permissions
    - echo "$SSH_PRIVATE_KEY" | wc -c  # Check the length of the SSH_PRIVATE_KEY
    - ssh-add private_key
    - mkdir -p ~/.ssh
    - chmod 700 ~/.ssh
    - ssh-keyscan gitlab.com >> ~/.ssh/known_hosts
    - chmod 644 ~/.ssh/known_hosts
    - git config --global user.email "your email" 
    - git config --global user.name "your username" 
  script:
    - apk add --no-cache curl # Install curl
    - echo "Deploying the project... $CI_COMMIT_TAG"
    - BRANCH_NAME="feature/develop_deploy" # Default branch name
    - 'if [[ "$CI_COMMIT_TAG" == *qc* ]]; then BRANCH_NAME="feature/testing_deploy"; fi'

    - mkdir tmp_repo && cd tmp_repo
    - git clone deploy-repo .
    - echo "Checking out to $BRANCH_NAME"
    - git checkout $BRANCH_NAME  # Corrected to use the variable
    - cp -r ../build/* .
    - git add .
    - git diff --quiet --exit-code || git commit -m "Deploying artifacts from CI - $CI_COMMIT_TAG"
    - git push || echo "No changes to push."
    - >
      curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"Deployment of $CI_COMMIT_TAG completed successfully.\"}" "YOUR WEBHOOK URL"
  rules:
    - if: '$CI_COMMIT_TAG =~ /^build-(dev|qc)-.*/'

Purpose: This stage deploys the built project to a remote repository and notifies the team via Slack.

image: alpine: Uses a lightweight Alpine Linux image.
before_script: Prepares the environment for deployment:
- Installs necessary packages: git and openssh-client.
- Sets up SSH for secure communication.
- Adds the SSH private key.
- Configures Git with user email and name.
script: Executes the deployment commands:
- Installs curl.
- Clones the deploy repository.
- Checks out the branch feature/develop_deploy or feature/testing_deploy.
- Copies the build artifacts to the repository.
- Commits and pushes the changes.
- Sends a Slack notification upon successful deployment.
rules: This job runs only if the commit tag matches the pattern build-dev- or build-qc-.

Pipeline 🚀🚀🚀

Slack notification 🔈🔈🔈

Note

If you face the following error:

Agent pid 23
$ echo "$SSH_PRIVATE_KEY" | tr -d '\r' > private_key
$ cat private_key
$ ssh-add private_key
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@         WARNING: UNPROTECTED PRIVATE KEY FILE!          @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
Permissions 0644 for 'private_key' are too open.
It is required that your private key files are NOT accessible by others.
This private key will be ignored.

Cleaning up project directory and file based variables

Go to the setting of Gitlab -> CICD -> Variables -> Uncheck [Protect variable]

Final thought

This is just a simple idea for CI/CD. It can be improved further, so please leave your comments if you have any suggestions for improvement. Thanks for reading!

Swagger + Node.js (Express) : A Step-by-Step Guide

cuongnp — Wed, 03 Jul 2024 14:30:19 +0000

Following the post on configuring Swagger for a SpringBoot project, today I will introduce you to a step-by-step guide to set up Swagger in a Node.js (Express) project.

1. Set Up Your Project

First, create a new Node.js project if you don't have one already.

mkdir swagger-demo
cd swagger-demo
npm init -y
npm install express swagger-ui-express swagger-jsdoc

2. Create Your Express Server

Create an index.js file (or app.js, depending on your preference):

touch index.js

const express = require('express');
const swaggerUi = require('swagger-ui-express');
const swaggerJsDoc = require('swagger-jsdoc');

const app = express();
const port = process.env.PORT || 3000;

// Swagger setup
const swaggerOptions = {
  swaggerDefinition: {
    myapi: '3.0.0',
    info: {
      title: 'My API',
      version: '1.0.0',
      description: 'API documentation',
    },
    servers: [
      {
        url: 'http://localhost:3000',
      },
    ],
  },
  apis: ['./routes/*.js'], // files containing annotations as above
};

const swaggerDocs = swaggerJsDoc(swaggerOptions);
app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocs));

// Sample route
app.get('/api/hello', (req, res) => {
  res.send('Hello World!');
});

app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

3. Document Your Routes

Create a routes folder and add a hello.js file to it (or any route file):

mkdir routes
cd routes
touch hello.js

Then, add the following code to hello.js:

/**
 * @swagger
 * /api/user:
 *   get:
 *     summary: Retrieve a list of users
 *     responses:
 *       200:
 *         description: A list of users
 *         content:
 *           application/json:
 *             schema:
 *               type: array
 *               items:
 *                 type: object
 *                 properties:
 *                   id:
 *                     type: integer
 *                     example: 1
 *                   name:
 *                     type: string
 *                     example: John Doe
 */
app.get('/api/user', (req, res) => {
  res.json([{ id: 1, name: 'John Doe' }]);
});

4. Run Your Server

Start your server:

node index.js

5. Access Swagger UI

Open your browser and navigate to http://localhost:3000/api-docs. You should see the Swagger UI with your documented API.

Following these steps, you can configure Swagger for your JavaScript project, providing interactive API documentation for your development team and end-users.

Thank you for reading! See you in the next post.

Swagger + SpringBoot Project

Spring Boot + Swagger: A Step-by-Step Guide to Interactive API Documentation

cuongnp — Sun, 30 Jun 2024 03:23:59 +0000

Introduction

In today's software development, especially when dealing with APIs (Application Programming Interfaces), having clear and detailed documentation is essential. It guides developers on how to use a service, which endpoints are available, and what data to send or expect in return. Swagger has become a widely used tool for this purpose. This guide will explain what Swagger is, how it functions, and provide an illustrative example of its use.

What is Swagger?

Swagger is a powerful open-source framework backed by a large ecosystem of tools that helps developers design, build, document, and consume RESTful web services. Swagger is language-agnostic and can be used with any programming language that supports REST API development.

Key Features:

API Documentation: Swagger automatically generates interactive API documentation, allowing developers to explore and test endpoints.
Design First or Code First: Swagger supports design-first and code-first approaches, making it versatile for different development workflows.
Interactive API Console: It provides an interface to test API endpoints directly from the documentation.
Standardization: Using the OpenAPI Specification (formerly known as Swagger Specification), Swagger standardizes how APIs are described.

Before diving deeper into the practice today, you should prepare the things below:

Prerequisite

SpringBoot application source code
IntelliJ
(Option) I’m using the current project which is running on an AWS EC2 server, so if you want to deploy and test on your server
- Open port 8080 in SecurityGroup

Step 1: Setup library

Choose the appropriate setup and compatible version depending on your project's configuration, whether it's Gradle or Maven.

springfox-swagger-ui

Step 2: Create a `SwaggerConfig`

We need to configure Swagger for our application.

Java:

@Configuration
@EnableSwagger2
public class SwaggerConfig {
    @Bean
    public Docket api() {
        return new Docket(DocumentationType.SWAGGER_2)
                .select()
                .apis(RequestHandlerSelectors.basePackage("your package name"))
                .paths(PathSelectors.any())
                .build();
    }
}

Kotlin


@Configuration
@EnableSwagger2
class SwaggerConfig {
    @Bean
    fun api(): Docket {
        return Docket(DocumentationType.SWAGGER_2)
            .select()
            .apis(RequestHandlerSelectors.basePackage("your package name")) 
            .paths(PathSelectors.any())
            .build()
    }
}

Don't forget to replace “your package name” with your application (typically, your application name)

Step 3: Update Security Config

If your app is configured with a security layer, you need to modify it to allow access to the Swagger documentation.

Java

  protected void configure(HttpSecurity http) throws Exception {
        http
                .cors()
                // Other configurations...
                .antMatchers("/v2/api-docs", "/configuration/**", "/swagger*/**", "/webjars/**") // Add endpoint
                // Other configurations...

    }

Kotlin

@Throws(Exception::class)
protected fun configure(http: HttpSecurity) {
    http
        .cors()
        // Other configurations...
        .antMatchers("/v2/api-docs", "/configuration/**", "/swagger*/**", "/webjars/**") // Add endpoint
        .permitAll() // Add permit for it
        // Other configurations...
}

Step 4: Viewing the Documentation

Build and deploy (or start the server in localhost)
If you're developing on your PC, simply restart and enter this in your browser:

http://localhost:8080/swagger-ui.html/

If you’re deploying in your server

http://your-server-ip:8080/swagger-ui.html/

All of the APIs will be displayed on the Swagger page. You can try and test the APIs just like you would in POSTMAN.

Final Thought

Swagger is an invaluable tool for API development and documentation. It not only helps in maintaining up-to-date documentation but also enhances the developer experience by providing an interactive interface to explore and test APIs. By integrating Swagger into your API development workflow, you can ensure that your APIs are well-documented, easy to understand, and user-friendly.

For the Node.js project, I also guide steps. Check it out!!!
Set up swagger for NodeJS project!