Using with Create React App

Create React App is a tool for scaffolding and building React applications.

The create-react-app script allows developers to provide custom templates through the --template option. For KendoReact applications, you can choose between four different templates, depending on the preferred technology stack:

• cra-template-kendo—A template for React applications using KendoReact.
• cra-template-kendo-sass—Adds sass support.
• cra-template-kendo-typescript—Adds typescript support.
• cra-template-kendo-typescript-sass—Adds support for both typescript and sass.

The following code snippet demonstrates the usage of the cra-template-kendo template:

Copy Codenpx create-react-app my-react-app --template cra-template-kendo

Create KendoReact App

The create-kendoreact-app tool is a thin wrapper around create-react-app. It provides a setup wizard that guides the user through the process of creating a new React application with KendoReact Components.

The following code snippet shows how to start building a new app with the Create KendoReact App tool:

Copy Codenpx create-kendoreact-app

The script above will run you through the following questions and pre-apply the corresponding cra-template-kendo template:

Copy Code? What is the name of your project? my-kendoreact-app
? Do you want to use TypeScript? Yes
? Do you want to use SASS? Yes
? Which Kendo UI Theme do you want to use?
  default
❯ bootstrap
  material

Options

The create-kendoreact-app tool accepts the same options as create-react-app and adds the following on top:

• --theme
• --typescript
• --sass

The options listed above allow you to skip the create-kendoreact-app wizard and set these options as arguments, for example:

Copy Codenpx create-kendoreact-app my-kendoreact-app --typescript --sass --theme=material

For more information on the recommended workflow for using KendoReact with Create React App, refer to the article on getting started.

Suggested Links

• The React Guide on Getting Started
• All Things React Telerik Blog Page