nuvo Launch Guide

Welcome to our launch guide for implementing the nuvo frontend library in your project

‍

As a software engineer, you understand the importance of streamlining your development process and providing dynamic functionality to your applications. nuvo is a powerful JavaScript-based importer library that can help you achieve this goal. By integrating nuvo, you can easily onboard and import customer data, allowing you to offer a self-service importer to your users. This guide will show you how to easily integrate nuvo into your project in just four simple steps.

‍

Step 1: Import the Library

‍

The first step in implementing nuvo React is to import the library into your project. You can do this by using either NPM or Yarn. If you are using NPM, you can run the following command:

npm installnuvo-react

‍

If you are using Yarn, you can run the following command:

yarn add nuvo-react

‍

As a software engineer, you understand the importance of a structured data model for your application. To streamline this process, nuvo React offers a no-code data model generator, which lets you easily customize the model for your project. You can manually create the schema using the provided documentation if preferred. (Note: This step is optional but highly recommended).

‍

Step 2: Choose the License Key

‍

Once the library is imported, you will need to choose a license key. If you are still in the testing phase of your project, you can choose the dev key. However, you can choose a live key if you are already a customer. This will give you access to all of the features and functionality of the library.

‍

Step 3: Choose Your Target Data Model

‍

As a software engineer, you understand the importance of a structured data model for your application. To streamline this process, nuvo React offers a no-code data model generator, which lets you easily customize the model for your project. You can manually create the schema using the provided documentation if preferred. (Note: This step is optional but highly recommended).

‍

Step 4: Implement the Component

‍

To complete the setup, you need to integrate the component into your front-end application.

‍

nuvo React generates a code snippet for you based on the inputs and selections from steps 1 to 3. Simply copy and paste the code into your app to add nuvo React’s dynamic functionality.

‍
The entire setup process, including steps 1 to 3, can be found in the “Setup” tab on nuvo’s user platform.

‍
This covers the basics of setting up nuvo and using its functionality. You can refer to the links and functionality in the nuvo Importer documentation for a more advanced setup, including all its features.

‍

• Cleaning Functions: For advanced validation, external server calls, or data modifications, you can use cleaning functions such as onEntryInit, onEntryChange, or columnHooks.
• White-labeling: To tailor the importer’s style to fit your company’s brand, you can use the style property to customize every aspect of it. This includes adjusting the primary and secondary colours, adding border-radius, hover animation, font types, etc. Find here more info about styling.
• Multiple Language Support: To serve customers in different countries, you can add multi-language support to the UI using the i18nOverrides property in the importer. You can adjust the UI texts for each language and even modify the default English texts if needed. Find here more info about multi-language.

‍

Book a first exploratory call with our team and get to know how to set up a data import process that works in less than 60 minutes.

‍