Back to Templates

Interactive Slack Approval & Data Submission System with Webhooks

Created by

Created by: Niranjan G || niranjan

Niranjan G

Last update

Last update 2 days ago

Share


Slack Bot n8n Integration Hub - Workflow Submission

๐Ÿš€ Showcase: Endless Possibilities with n8n Integration

This repository demonstrates a powerful Slack Bot Socket App that seamlessly integrates with n8n for automation workflows. This is just a showcase of what's possible when combining Slack's interactive capabilities with n8n's automation power - the possibilities are truly endless!

๐Ÿ“‹ Project Overview

Repository: slack-n8n-integration-hub

Status: โœ… Committed and Ready for Submission

This project showcases how to create seamless interactions between Slack users and n8n workflows, demonstrating:

  • Real-time Data Submission from Slack to n8n workflows
  • Interactive Approval/Rejection workflows triggered from Slack
  • Secure Webhook Communication with optional Basic Authentication
  • Dynamic Modal Interactions with immediate feedback
  • Error Handling and User Experience optimization

๐ŸŽฏ Key Features Demonstrated

1. Data Input Integration

  • Users can submit custom data directly from Slack
  • Data is instantly sent to n8n workflows for processing
  • Real-time feedback and confirmation messages

2. Approval Workflow Automation

  • Interactive approve/reject buttons in Slack modals
  • Decisions trigger different n8n workflow paths
  • Automated decision logging and processing

3. Enhanced User Experience

  • Modal closes automatically after actions
  • Submit button positioned below input for better UX
  • Comprehensive error handling and user feedback

4. Security & Authentication

  • Optional HTTP Basic Auth for webhook security
  • Environment-based configuration management
  • Secure credential handling

๐Ÿ”ง Technical Implementation

Slack Bot Features:

  • Socket Mode for real-time communication
  • Custom slash commands (/automation)
  • Interactive modals with dynamic content
  • Button actions and form submissions

n8n Integration:

  • Webhook triggers for data reception
  • Structured payload formats
  • Authentication support
  • Error handling and response management

Workflow Payload Examples:

Data Submission:

{
  "type": "data_submission",
  "data": "User input data here",
  "user": {
    "id": "U1234567890",
    "name": "username"
  },
  "timestamp": "2024-01-01T12:00:00.000Z",
  "source": "slack_bot"
}

Approval Action:

{
  "type": "approval_action",
  "action": "approve",
  "user": {
    "id": "U1234567890",
    "name": "username"
  },
  "timestamp": "2024-01-01T12:00:00.000Z",
  "source": "slack_bot"
}

๐ŸŒŸ Why This Matters for n8n Community

This project demonstrates how n8n can be the backbone for:

  • Human-in-the-loop automation workflows
  • Interactive approval processes
  • Real-time data collection from team communication tools
  • Seamless integration between chat platforms and automation
  • Scalable workflow triggers from multiple sources

๐Ÿš€ Endless Possibilities

This is just the beginning! With this foundation, you can build:

  • IT Service Desk automation with Slack approvals
  • Content Publishing workflows with team reviews
  • Data Collection and processing pipelines
  • Incident Management with automated escalations
  • Project Management with status updates and approvals
  • Customer Support ticket routing and responses
  • DevOps Deployments with approval gates
  • Financial Approvals with audit trails
  • HR Processes with automated workflows
  • Marketing Campaigns with content approvals

๐Ÿ“ Repository Structure

slack-n8n-integration-hub/
โ”œโ”€โ”€ app.js                          # Main Slack Bot application
โ”œโ”€โ”€ package.json                    # Dependencies and scripts
โ”œโ”€โ”€ .env.example                    # Environment configuration template
โ”œโ”€โ”€ README.md                       # Complete setup documentation
โ”œโ”€โ”€ CONTRIBUTING.md                 # Contribution guidelines
โ”œโ”€โ”€ Slack_Bot_n8n_Integration_Hub.json  # n8n workflow export
โ”œโ”€โ”€ n8n-workflow-examples.json     # Additional workflow examples
โ””โ”€โ”€ test-webhook.js                 # Webhook testing utilities

๐ŸŽ‰ Ready for n8n Community

This workflow is:

  • โœ… Fully Tested and working
  • โœ… Well Documented with setup instructions
  • โœ… Open Source and ready for community use
  • โœ… Extensible for various use cases
  • โœ… Production Ready with error handling

๐Ÿ”— Get Started

  1. Clone the repository: git clone https://github.com/iam-niranjan/slack-n8n-integration-hub.git
  2. Follow the setup guide in the main README.md
  3. Import the n8n workflows from the JSON files
  4. Customize for your use case and explore the possibilities!

This showcase demonstrates that with n8n and Slack integration, the automation possibilities are truly endless! ๐Ÿš€

Ready to submit to n8n community for sharing and collaboration.