This is a submission for the KendoReact Free Components Challenge.

What I Built

VibePilot streamlines social media management by integrating AI-powered content creation, visual scheduling, and analytics in one elegant platform.

Live demo: https://vibepilot.netlify.app/

Key Features

AI Content Assistant

Enhances social media posts with platform-specific optimization
Provides conversational guidance for content creation
Integrates Cohere's API for natural language processing

Visual Content Calendar

Drag-and-drop scheduling with color-coded platform indicators
Displays optimal posting times based on audience engagement
Identifies scheduling conflicts and content distribution gaps

Performance Analytics

Visualizes engagement across platforms with interactive charts
Compares AI-enhanced vs. standard content performance
Identifies top-performing content types and posting times

Streamlined Post Management

Create posts for multiple platforms simultaneously
Apply platform-specific formatting automatically
Track publishing status with visual indicators

Tech Stack

Frontend: React + TypeScript
UI Components: KendoReact
State Management: React Query
Authentication: JWT
AI Integration: Cohere API
Deployment: Netlify

NOTE: This is just a prototype for submitting to the challenge

Demo

demo link : https://vibepilot.netlify.app/

repo : https://github.com/Amlan-git/VibePilot-

Image description

Image description
Image description
Image description

Image description

KendoReact Experience

Using KendoReact in VibePilot was honestly a game-changer. I wanted to build something that looked polished and felt intuitive — without spending weeks on custom UI from scratch — and KendoReact delivered on that right out of the gate.

Getting started was super smooth. I activated the free commercial license in just a couple of minutes, used the license key, and everything worked seamlessly. No weird setup issues, no blocked features as well, just a solid dev experience from the start.

Once I got going, the components really helped me move fast.

here are all the Kendo UI components used in this project:

1. Layout Components

  • AppBar, AppBarSection, AppBarSpacer
  • Drawer, DrawerContent
  • Card, CardHeader, CardTitle, CardBody, CardActions
  • TabStrip, TabStripTab
  • Avatar

2. Form Components

  • Form, Field, FormElement, FieldWrapper
  • Input, TextArea
  • Button, ButtonGroup, FloatingActionButton
  • DropDownList, MultiSelect
  • DateTimePicker, DateRangePicker, DatePicker
  • Upload
  • Label, Hint, Error

3. Data Visualization

  • Grid, GridColumn, GridToolbar
  • Chart, ChartSeries, ChartSeriesItem
  • Various chart components for analytics

4. UI Components

  • Dialog, DialogActionsBar
  • Notification, NotificationGroup
  • Tooltip
  • Loader
  • Badge
  • Chip, ChipList
  • Icon

5. Scheduler Components

Various scheduler components from @progress/kendo-react-scheduler

Common Components:

  • Avatar
  • Icon

Kendo React Packages (version 7.4.0):

  1. Core Packages:

Image description

  1. UI Component Packages:

Image description

  1. Data & Form Packages:

Image description

  1. Date & Time Packages:

Image description

  1. Visualization Packages:

Image description

  1. Additional Functionality:
    Image description

  2. Theme Package:

Image description

AIm to Impress

GenAI used : cohere AI

VibePilot uses Cohere AI for two main features:

  1. Content Enhancement: The app integrates Cohere's language generation capabilities through the cohereService.ts service to help users optimize their social media content. Key functionalities include:
    Content rewriting with different tones (professional, casual, promotional, etc.)
    Hashtag generation for social posts
    Content idea generation
    Post optimization for better engagement
    The service uses Cohere's /generate endpoint with the "command" model

  2. AI Assistant Chat: Users can interact with an AI assistant powered by Cohere's chat capabilities:
    The chat feature maintains conversation history for context
    It uses Cohere's /chat endpoint with the "command" model
    The implementation handles back-and-forth dialogue in a conversational UI

Thank you !

Thank you for taking the time to explore VibePilot. 🚀

Your interest and feedback mean the world to me. Whether you're a creator or a fellow developer, I hope you like VibePilot.

If you've made it this far, thank you for your support! 🙏✨ I can't wait to hear your thoughts on this project. Building VibePilot was more than just a coding project - from wrestling with Cohere's AI capabilities to crafting an intuitive interface with KendoReact, this project pushed me to grow both as a developer and a problem-solver.