DEV Community

Cover image for Kendo CV Builder
Om343
Om343

Posted on

Kendo CV Builder

This is a submission for the KendoReact Free Components Challenge.

I built a Kendo Cv-builder. a minimal yet intuitive cv builder powered by kendo ui beautiful and accessible components

The project styling is achieved entirely with kendo-ui components and vanilla css.

Demo

deployed app : Cv-builder

Code Repo : repo

KendoReact Components Used

Kendo UI Components Used in this Project
Animations
Fade **- Used for page transitions
**Slide
- Used for page transitions
Expand- Used for page transitions
Layout
Splitter- Main layout component for dividing the interface into panels
Buttons
Button - Used throughout forms and navigation
Inputs
TextBox- Basic text input in forms
MaskedTextBox- Formatted text input (likely for phone numbers)
Checkbox- Used in experience form (probably for "current job" checkbox)
Date Inputs
DatePicker - Used in education and experience forms for dates
Labels
Label- Form field labels throughout the application
Editor
Editor- Rich text editor for summary and experience descriptions
EditorTools- Toolbar configuration for the editor (Bold, Italic, Underline, Lists, Links)
PDF
PDFExport- For generating PDF versions of the CV
Tooltip
Tooltip- Used in sidebar navigation for enhanced UX
Theming
Bootstrap Theme @progress/kendo-theme-bootstrap for consistent styling

[Optional: Code Smarter, Not Harder prize category] AI Coding Assistant Usage

I used the kendo mcp server in cursor for creating almost all the ui components for this project. here is one of the example i used to add a tooltip component

Top comments (2)

Collapse
 
kenjisan profile image
Kenji

I was not able to use the kendo MCP server in cursor, how did you use it ?

Collapse
 
om343 profile image
Om343

hello, first you need to add the config of mcp from kendo docs, here is the link for that : docs. paste the config in mcp.json in cursor. and whenever you need to call the assistant , use the phrases like 'kendo' as you can see in image. This will utilize the mcp server