useaiml

2.0.0 • Public • Published

useAIML

useAIML is a comprehensive collection of custom React hooks designed to simplify and enhance machine learning workflows within React applications. Whether you're a data scientist, developer, or enthusiast, useAIML provides a suite of hooks that streamline data handling, preprocessing, feature engineering, model training, evaluation, and more, enabling seamless integration of machine learning functionalities into your projects.

Table of Contents

Features

useAIML offers a wide range of React hooks tailored for various stages of the machine learning pipeline:

  • Data Loading & Management: Fetch and manage data from multiple sources.
  • Data Preprocessing: Clean, scale, and transform data to prepare it for modeling.
  • Feature Engineering: Enhance your dataset with engineered features for better model performance.
  • Model Training: Train, save, and load machine learning models directly within your React components.
  • Evaluation & Metrics: Compute essential metrics to evaluate model performance.
  • Visualization: Generate insightful visualizations to interpret data and model results.
  • Advanced Functionalities: Includes hooks for cross-validation, hyperparameter tuning, online learning, and more.

Installation

Install useAIML via NPM:

npm install useaiml

Or with Yarn:

yarn add useaiml

Quick Start

Here's a basic example of how to use the useDataLoader hook to fetch and display data in a React component:

import React from 'react';
import { useDataLoader } from 'useaiml';

const DataDisplay = () => {
  const { data, error } = useDataLoader('https://api.example.com/data');

  if (error) return <div>Error: {error}</div>;
  if (!data) return <div>Loading...</div>;

  return (
    <div>
      <h1>Data Loaded Successfully!</h1>
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  );
};

export default DataDisplay;

Directory Structure

Ensure your project directory is organized correctly. Given that all hooks and index.js are in the same folder, your structure should look like this:

useAIML/
├── hooks/
│   ├── useDataLoader.js
│   ├── useDataSplitter.js
│   ├── useScaler.js
│   ├── useMetrics.js
│   ├── useModelLoader.js
│   ├── useModelSaver.js
│   ├── useVisualization.js
│   ├── useCrossValidation.js
│   ├── useHyperparameterTuning.js
│   ├── useLinearRegression.js
│   ├── useLogisticRegression.js
│   ├── useSVR.js
│   ├── useSVC.js
│   ├── useDTRegressor.js
│   ├── useDTClassifier.js
│   ├── useRFRegressor.js
│   ├── useRFClassifier.js
│   ├── useNBRegressor.js
│   ├── useNBClassifier.js
│   ├── usePCA.js
│   ├── usePreprocessor.js
│   ├── useKNNRegressor.js
│   ├── useKNNClassifier.js
│   ├── useKMeans.js
│   ├── useXGBoost.js
│   ├── useLightGBM.js
│   ├── useCatBoost.js
│   ├── useDBSCAN.js
│   ├── useDatasetGenerator.js
│   ├── useDataGenerator.js
│   ├── useSyntheticData.js
│   ├── useFeatureEngineering.js
│   ├── useDataAugmentation.js
│   ├── useDataCleaning.js
│   ├── useHandleMissingValues.js
│   ├── useEDA.js
│   ├── useDistanceCalculation.js
│   ├── useSimilarity.js
│   ├── useFeatureSelection.js
│   ├── useImbalancedHandling.js
│   ├── useModelExplainability.js
│   ├── usePipeline.js
│   ├── useBatchPrediction.js
│   ├── useOnlineLearning.js
│   └── useModelMonitoring.js
│   └── useNN.js
├── index.js
├── package.json
├── README.md
└── LICENSE

Available Hooks

useAIML provides a variety of hooks categorized based on their functionality. Below is an overview of each hook along with detailed descriptions, parameters, return values, and usage examples.

Data Handling


useDataLoader

  • Description: Fetches data from a specified URL and manages loading and error states.

  • Parameters:

    • url (string): The URL from which to fetch data.
  • Returns:

    • data (any): The fetched data.
    • error (string | null): Any error encountered during fetching.
  • Usage:

    const { data, error } = useDataLoader('https://api.example.com/data');
  • Example:

    import React from 'react';
    import { useDataLoader } from 'useaiml';
    
    const DataDisplay = () => {
      const { data, error } = useDataLoader('https://api.example.com/data');
    
      if (error) return <div>Error: {error}</div>;
      if (!data) return <div>Loading...</div>;
    
      return (
        <div>
          <h1>Data Loaded Successfully!</h1>
          <pre>{JSON.stringify(data, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataDisplay;

useDataSplitter

  • Description: Splits your dataset into training and testing sets.

  • Parameters:

    • data (object): The dataset to split, typically containing features and targets.
    • testSize (number): The proportion of the dataset to include in the test split (e.g., 0.2 for 20%).
  • Returns:

    • trainData (object): The training subset of the dataset.
    • testData (object): The testing subset of the dataset.
  • Usage:

    const { trainData, testData } = useDataSplitter(data, 0.2);
  • Example:

    import React from 'react';
    import { useDataSplitter } from 'useaiml';
    
    const SplitDataComponent = ({ data }) => {
      const { trainData, testData } = useDataSplitter(data, 0.2);
    
      return (
        <div>
          <h2>Training Data:</h2>
          <pre>{JSON.stringify(trainData, null, 2)}</pre>
          <h2>Testing Data:</h2>
          <pre>{JSON.stringify(testData, null, 2)}</pre>
        </div>
      );
    };
    
    export default SplitDataComponent;

Preprocessing


useScaler

  • Description: Applies scaling techniques to normalize your data.

  • Parameters:

    • data (array): The dataset to scale.
    • scalerType (string): The type of scaler to apply (e.g., 'standard', 'minmax').
  • Returns:

    • scaledData (array): The scaled dataset.
  • Usage:

    const { scaledData } = useScaler(data, 'standard');
  • Example:

    import React from 'react';
    import { useScaler } from 'useaiml';
    
    const ScaledDataComponent = ({ data }) => {
      const { scaledData } = useScaler(data, 'standard');
    
      return (
        <div>
          <h2>Scaled Data:</h2>
          <pre>{JSON.stringify(scaledData, null, 2)}</pre>
        </div>
      );
    };
    
    export default ScaledDataComponent;

useHandleMissingValues

  • Description: Handles missing values in your dataset through imputation or removal.

  • Parameters:

    • data (array | object): The dataset containing missing values.
    • strategy (string): The strategy to handle missing values (e.g., 'mean', 'median', 'mode', 'drop').
  • Returns:

    • cleanedData (array | object): The dataset with missing values handled.
  • Usage:

    const { cleanedData } = useHandleMissingValues(data, 'mean');
  • Example:

    import React from 'react';
    import { useHandleMissingValues } from 'useaiml';
    
    const HandleMissingValuesComponent = ({ data }) => {
      const { cleanedData } = useHandleMissingValues(data, 'median');
    
      return (
        <div>
          <h2>Handle Missing Values:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default HandleMissingValuesComponent;

useDataCleaning

  • Description: Cleans your data by removing duplicates, correcting inconsistencies, and performing other cleaning tasks.

  • Parameters:

    • data (array | object): The dataset to clean.
  • Returns:

    • cleanedData (array | object): The cleaned dataset.
  • Usage:

    const { cleanedData } = useDataCleaning(data);
  • Example:

    import React from 'react';
    import { useDataCleaning } from 'useaiml';
    
    const DataCleaningComponent = ({ data }) => {
      const { cleanedData } = useDataCleaning(data);
    
      return (
        <div>
          <h2>Data Cleaning:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataCleaningComponent;

Feature Engineering


useFeatureEngineering

  • Description: Enhances your dataset with engineered features to improve model performance.

  • Parameters:

    • data (array | object): The original dataset.
    • options (object): Configuration options for feature engineering (e.g., { polynomial: 2 } for polynomial features).
  • Returns:

    • engineeredData (array | object): The dataset with engineered features.
  • Usage:

    const { engineeredData } = useFeatureEngineering(data, { polynomial: 2 });
  • Example:

    import React from 'react';
    import { useFeatureEngineering } from 'useaiml';
    
    const FeatureEngineeringComponent = ({ data }) => {
      const { engineeredData } = useFeatureEngineering(data, { polynomial: 2 });
    
      return (
        <div>
          <h2>Feature Engineering:</h2>
          <pre>{JSON.stringify(engineeredData, null, 2)}</pre>
        </div>
      );
    };
    
    export default FeatureEngineeringComponent;

useFeatureSelection

  • Description: Selects the most relevant features for your models based on specified criteria.

  • Parameters:

    • data (array | object): The dataset from which to select features.
    • criteria (string | function): The criteria or method for feature selection (e.g., 'variance', 'correlation', or a custom function).
  • Returns:

    • selectedFeatures (array | object): The dataset with only the selected features.
  • Usage:

    const { selectedFeatures } = useFeatureSelection(data, 'correlation');
  • Example:

    import React from 'react';
    import { useFeatureSelection } from 'useaiml';
    
    const FeatureSelectionComponent = ({ data }) => {
      const { selectedFeatures } = useFeatureSelection(data, 'variance');
    
      return (
        <div>
          <h2>Feature Selection:</h2>
          <pre>{JSON.stringify(selectedFeatures, null, 2)}</pre>
        </div>
      );
    };
    
    export default FeatureSelectionComponent;

Model Training


useLinearRegression

  • Description: Trains a linear regression model.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained linear regression model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useLinearRegression();
  • Example:

    import React, { useEffect } from 'react';
    import { useLinearRegression, useMetrics } from 'useaiml';
    
    const LinearRegressionComponent = () => {
      const { model, train } = useLinearRegression();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [2, 4, 6, 8, 10]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Linear Regression Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default LinearRegressionComponent;

useLogisticRegression

  • Description: Trains a logistic regression model for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained logistic regression model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useLogisticRegression();
  • Example:

    import React, { useEffect } from 'react';
    import { useLogisticRegression, useMetrics } from 'useaiml';
    
    const LogisticRegressionComponent = () => {
      const { model, train } = useLogisticRegression();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Logistic Regression Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default LogisticRegressionComponent;

useSVR

  • Description: Trains a Support Vector Regressor for regression tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained SVR model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useSVR();
  • Example:

    import React, { useEffect } from 'react';
    import { useSVR, useMetrics } from 'useaiml';
    
    const SVRComponent = () => {
      const { model, train } = useSVR();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1.2, 2.3, 3.1, 4.5, 5.2]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Support Vector Regressor Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default SVRComponent;

useSVC

  • Description: Trains a Support Vector Classifier for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained SVC model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useSVC();
  • Example:

    import React, { useEffect } from 'react';
    import { useSVC, useMetrics } from 'useaiml';
    
    const SVCComponent = () => {
      const { model, train } = useSVC();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Support Vector Classifier Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default SVCComponent;

useDTRegressor

  • Description: Trains a Decision Tree Regressor for regression tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Decision Tree Regressor model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useDTRegressor();
  • Example:

    import React, { useEffect } from 'react';
    import { useDTRegressor, useMetrics } from 'useaiml';
    
    const DTRegressorComponent = () => {
      const { model, train } = useDTRegressor();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1.5, 2.7, 3.3, 4.8, 5.6]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Decision Tree Regressor Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default DTRegressorComponent;

useDTClassifier

  • Description: Trains a Decision Tree Classifier for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Decision Tree Classifier model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useDTClassifier();
  • Example:

    import React, { useEffect } from 'react';
    import { useDTClassifier, useMetrics } from 'useaiml';
    
    const DTClassifierComponent = () => {
      const { model, train } = useDTClassifier();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Decision Tree Classifier Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default DTClassifierComponent;

useRFRegressor

  • Description: Trains a Random Forest Regressor for regression tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Random Forest Regressor model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useRFRegressor();
  • Example:

    import React, { useEffect } from 'react';
    import { useRFRegressor, useMetrics } from 'useaiml';
    
    const RFRegressorComponent = () => {
      const { model, train } = useRFRegressor();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1.4, 2.5, 3.6, 4.7, 5.8]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Random Forest Regressor Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default RFRegressorComponent;

useRFClassifier

  • Description: Trains a Random Forest Classifier for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Random Forest Classifier model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useRFClassifier();
  • Example:

    import React, { useEffect } from 'react';
    import { useRFClassifier, useMetrics } from 'useaiml';
    
    const RFClassifierComponent = () => {
      const { model, train } = useRFClassifier();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Random Forest Classifier Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default RFClassifierComponent;

useNBRegressor

  • Description: Trains a Naive Bayes Regressor for regression tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Naive Bayes Regressor model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useNBRegressor();
  • Example:

    import React, { useEffect } from 'react';
    import { useNBRegressor, useMetrics } from 'useaiml';
    
    const NBRegressorComponent = () => {
      const { model, train } = useNBRegressor();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1.1, 2.2, 3.3, 4.4, 5.5]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Naive Bayes Regressor Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default NBRegressorComponent;

useNBClassifier

  • Description: Trains a Naive Bayes Classifier for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained Naive Bayes Classifier model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useNBClassifier();
  • Example:

    import React, { useEffect } from 'react';
    import { useNBClassifier, useMetrics } from 'useaiml';
    
    const NBClassifierComponent = () => {
      const { model, train } = useNBClassifier();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>Naive Bayes Classifier Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default NBClassifierComponent;

useKNNRegressor

  • Description: Trains a K-Nearest Neighbors Regressor for regression tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained KNN Regressor model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useKNNRegressor();
  • Example:

    import React, { useEffect } from 'react';
    import { useKNNRegressor, useMetrics } from 'useaiml';
    
    const KNNRegressorComponent = () => {
      const { model, train } = useKNNRegressor();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1.0, 2.0, 3.0, 4.0, 5.0]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>K-Nearest Neighbors Regressor Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default KNNRegressorComponent;

useKNNClassifier

  • Description: Trains a K-Nearest Neighbors Classifier for classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained KNN Classifier model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useKNNClassifier();
  • Example:

    import React, { useEffect } from 'react';
    import { useKNNClassifier, useMetrics } from 'useaiml';
    
    const KNNClassifierComponent = () => {
      const { model, train } = useKNNClassifier();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 0, 1, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>K-Nearest Neighbors Classifier Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default KNNClassifierComponent;

useKMeans

  • Description: Performs K-Means clustering on your dataset.

  • Parameters:

    • data (array): The dataset to cluster.
    • k (number): The number of clusters.
  • Returns:

    • clusters (array): The cluster assignments for each data point.
    • centroids (array): The centroids of the clusters.
  • Usage:

    const { clusters, centroids } = useKMeans(data, 3);
  • Example:

    import React from 'react';
    import { useKMeans } from 'useaiml';
    
    const KMeansComponent = ({ data }) => {
      const { clusters, centroids } = useKMeans(data, 3);
    
      return (
        <div>
          <h2>K-Means Clustering</h2>
          <pre>{JSON.stringify({ clusters, centroids }, null, 2)}</pre>
        </div>
      );
    };
    
    export default KMeansComponent;

useXGBoost

  • Description: Trains an XGBoost model for regression or classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained XGBoost model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useXGBoost();
  • Example:

    import React, { useEffect } from 'react';
    import { useXGBoost, useMetrics } from 'useaiml';
    
    const XGBoostComponent = () => {
      const { model, train } = useXGBoost();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [1, 3, 5, 7, 9]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>XGBoost Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default XGBoostComponent;

useLightGBM

  • Description: Trains a LightGBM model for regression or classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained LightGBM model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useLightGBM();
  • Example:

    import React, { useEffect } from 'react';
    import { useLightGBM, useMetrics } from 'useaiml';
    
    const LightGBMComponent = () => {
      const { model, train } = useLightGBM();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 1, 0, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>LightGBM Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default LightGBMComponent;

useCatBoost

  • Description: Trains a CatBoost model for regression or classification tasks.

  • Parameters:

    • None
  • Returns:

    • model (object): The trained CatBoost model.
    • train (function): Function to train the model with features and targets.
  • Usage:

    const { model, train } = useCatBoost();
  • Example:

    import React, { useEffect } from 'react';
    import { useCatBoost, useMetrics } from 'useaiml';
    
    const CatBoostComponent = () => {
      const { model, train } = useCatBoost();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          target: [0, 1, 0, 1, 1]
        };
        train(trainingData.features, trainingData.target);
      }, [train]);
    
      useEffect(() => {
        if (model && model.predict) {
          const predictions = model.predict([[6]]);
          console.log('Predictions:', predictions);
        }
      }, [model]);
    
      return (
        <div>
          <h2>CatBoost Model</h2>
          {metrics && (
            <div>
              <h3>Model Metrics:</h3>
              <pre>{JSON.stringify(metrics, null, 2)}</pre>
            </div>
          )}
        </div>
      );
    };
    
    export default CatBoostComponent;

useDBSCAN

  • Description: Performs DBSCAN clustering on your dataset.

  • Parameters:

    • data (array): The dataset to cluster.
    • eps (number): The maximum distance between two samples for one to be considered as in the neighborhood of the other.
    • minSamples (number): The number of samples in a neighborhood for a point to be considered as a core point.
  • Returns:

    • clusters (array): The cluster assignments for each data point.
  • Usage:

    const { clusters } = useDBSCAN(data, 0.5, 5);
  • Example:

    import React from 'react';
    import { useDBSCAN } from 'useaiml';
    
    const DBSCANComponent = ({ data }) => {
      const { clusters } = useDBSCAN(data, 0.5, 5);
    
      return (
        <div>
          <h2>DBSCAN Clustering</h2>
          <pre>{JSON.stringify(clusters, null, 2)}</pre>
        </div>
      );
    };
    
    export default DBSCANComponent;

useDatasetGenerator

  • Description: Generates synthetic datasets for training and testing machine learning models.

  • Parameters:

    • options (object): Configuration options for dataset generation (e.g., number of samples, number of features).
  • Returns:

    • dataset (object): The generated dataset containing features and targets.
  • Usage:

    const { dataset } = useDatasetGenerator({ samples: 100, features: 5 });
  • Example:

    import React from 'react';
    import { useDatasetGenerator } from 'useaiml';
    
    const DatasetGeneratorComponent = () => {
      const { dataset } = useDatasetGenerator({ samples: 100, features: 5 });
    
      return (
        <div>
          <h2>Generated Dataset:</h2>
          <pre>{JSON.stringify(dataset, null, 2)}</pre>
        </div>
      );
    };
    
    export default DatasetGeneratorComponent;

useDataGenerator

  • Description: Generates custom data based on specified patterns or distributions.

  • Parameters:

    • type (string): The type of data to generate (e.g., 'linear', 'polynomial', 'random').
    • options (object): Additional configuration options (e.g., noise level, number of samples).
  • Returns:

    • data (object): The generated data containing features and targets.
  • Usage:

    const { data } = useDataGenerator('linear', { samples: 50, noise: 0.1 });
  • Example:

    import React from 'react';
    import { useDataGenerator } from 'useaiml';
    
    const DataGeneratorComponent = () => {
      const { data } = useDataGenerator('polynomial', { samples: 100, noise: 0.2 });
    
      return (
        <div>
          <h2>Generated Polynomial Data:</h2>
          <pre>{JSON.stringify(data, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataGeneratorComponent;

useSyntheticData

  • Description: Creates synthetic datasets using advanced techniques for simulation and testing purposes.

  • Parameters:

    • generatorType (string): The type of synthetic data generator to use (e.g., 'GAN', 'SMOTE').
    • parameters (object): Parameters specific to the chosen generator.
  • Returns:

    • syntheticData (array | object): The generated synthetic dataset.
  • Usage:

    const { syntheticData } = useSyntheticData('SMOTE', { ratio: 1.0 });
  • Example:

    import React from 'react';
    import { useSyntheticData } from 'useaiml';
    
    const SyntheticDataComponent = () => {
      const { syntheticData } = useSyntheticData('GAN', { layers: [64, 128, 64] });
    
      return (
        <div>
          <h2>Synthetic Data Generated by GAN:</h2>
          <pre>{JSON.stringify(syntheticData, null, 2)}</pre>
        </div>
      );
    };
    
    export default SyntheticDataComponent;

Model Training

Note: The following hooks assume the use of machine learning libraries compatible with JavaScript, such as TensorFlow.js or similar.


useModelLoader

  • Description: Loads a pre-trained machine learning model from a specified path or URL.

  • Parameters:

    • modelPath (string): The path or URL to the pre-trained model.
  • Returns:

    • model (object | null): The loaded machine learning model.
    • error (string | null): Any error encountered during model loading.
  • Usage:

    const { model, error } = useModelLoader('/models/myModel.json');
  • Example:

    import React from 'react';
    import { useModelLoader } from 'useaiml';
    
    const ModelLoaderComponent = () => {
      const { model, error } = useModelLoader('/models/myModel.json');
    
      if (error) return <div>Error loading model: {error}</div>;
      if (!model) return <div>Loading model...</div>;
    
      return (
        <div>
          <h2>Model Loaded Successfully!</h2>
          {/* You can now use the model for predictions */}
        </div>
      );
    };
    
    export default ModelLoaderComponent;

useModelSaver

  • Description: Saves a trained machine learning model to a specified path or URL.

  • Parameters:

    • model (object): The trained machine learning model to save.
    • savePath (string): The path or URL where the model should be saved.
  • Returns:

    • success (boolean): Indicates whether the model was saved successfully.
    • error (string | null): Any error encountered during model saving.
  • Usage:

    const { success, error } = useModelSaver(model, '/models/myModel.json');
  • Example:

    import React from 'react';
    import { useModelSaver } from 'useaiml';
    
    const ModelSaverComponent = ({ model }) => {
      const { success, error } = useModelSaver(model, '/models/myModel.json');
    
      if (error) return <div>Error saving model: {error}</div>;
      if (!success) return <div>Saving model...</div>;
    
      return (
        <div>
          <h2>Model Saved Successfully!</h2>
        </div>
      );
    };
    
    export default ModelSaverComponent;

useMetrics

  • Description: Computes essential metrics like Mean Squared Error (MSE), accuracy, precision, recall, etc., to evaluate model performance.

  • Parameters:

    • actual (array): The actual target values.
    • predicted (array): The predicted target values from the model.
  • Returns:

    • metrics (object): An object containing computed metrics.
  • Usage:

    const { metrics } = useMetrics(actualValues, predictedValues);
  • Example:

    import React from 'react';
    import { useMetrics } from 'useaiml';
    
    const MetricsComponent = ({ actual, predicted }) => {
      const { metrics } = useMetrics(actual, predicted);
    
      return (
        <div>
          <h2>Model Metrics:</h2>
          <pre>{JSON.stringify(metrics, null, 2)}</pre>
        </div>
      );
    };
    
    export default MetricsComponent;

useCrossValidation

  • Description: Performs cross-validation to assess model performance across different subsets of the dataset.

  • Parameters:

    • model (object): The machine learning model to evaluate.
    • data (object): The dataset containing features and targets.
    • k (number): The number of folds for cross-validation.
  • Returns:

    • cvResults (array): An array containing performance metrics for each fold.
  • Usage:

    const { cvResults } = useCrossValidation(model, data, 5);
  • Example:

    import React from 'react';
    import { useCrossValidation } from 'useaiml';
    
    const CrossValidationComponent = ({ model, data }) => {
      const { cvResults } = useCrossValidation(model, data, 5);
    
      return (
        <div>
          <h2>Cross-Validation Results:</h2>
          <pre>{JSON.stringify(cvResults, null, 2)}</pre>
        </div>
      );
    };
    
    export default CrossValidationComponent;

useHyperparameterTuning

  • Description: Optimizes your model's hyperparameters to enhance performance.

  • Parameters:

    • model (object): The machine learning model to tune.
    • params (object): An object specifying the hyperparameters to tune and their possible values.
    • data (object): The dataset containing features and targets.
  • Returns:

    • bestParams (object): The set of hyperparameters that yielded the best performance.
  • Usage:

    const { bestParams } = useHyperparameterTuning(model, params, data);
  • Example:

    import React from 'react';
    import { useHyperparameterTuning } from 'useaiml';
    
    const HyperparameterTuningComponent = ({ model, data }) => {
      const params = {
        n_estimators: [50, 100, 150],
        max_depth: [5, 10, 15]
      };
      const { bestParams } = useHyperparameterTuning(model, params, data);
    
      return (
        <div>
          <h2>Best Hyperparameters:</h2>
          <pre>{JSON.stringify(bestParams, null, 2)}</pre>
        </div>
      );
    };
    
    export default HyperparameterTuningComponent;

useNN

  • Description: Builds, trains, and utilizes customizable neural networks with support for various layers and activation functions.

  • Parameters:

    • None
  • Returns:

    • layers (array): The current layers of the neural network.
    • addLayer (function): Function to add a new layer to the network.
    • removeLayer (function): Function to remove an existing layer from the network.
    • train (function): Function to train the neural network with features and targets.
    • predict (function): Function to make predictions using the trained neural network.
    • trained (boolean): Indicates whether the model has been trained.
    • lossHistory (array): Tracks the loss over training epochs.
  • Usage:

    const { layers, addLayer, removeLayer, train, predict, trained, lossHistory } = useNN();
  • Example:

    import React, { useEffect } from 'react';
    import { useNN, useMetrics } from 'useaiml';
    
    const NeuralNetworkComponent = () => {
      const { layers, addLayer, train, predict, trained, lossHistory } = useNN();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        // Add layers to the neural network
        addLayer({ type: 'dense', inputSize: 1, outputSize: 10, activation: 'relu' });
        addLayer({ type: 'dense', inputSize: 10, outputSize: 1, activation: 'sigmoid' });
    
        // Prepare training data
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          targets: [[0], [0], [1], [1], [1]]
        };
    
        // Train the neural network
        train(trainingData.features, trainingData.targets, 1000, 0.01);
      }, [addLayer, train]);
    
      useEffect(() => {
        if (trained) {
          const prediction = predict([6]);
          console.log('Prediction for input 6:', prediction);
        }
      }, [trained, predict]);
    
      return (
        <div>
          <h2>Neural Network Model</h2>
          {trained ? (
            <div>
              <h3>Training Complete</h3>
              <pre>Loss History: {JSON.stringify(lossHistory, null, 2)}</pre>
              <pre>Metrics: {JSON.stringify(metrics, null, 2)}</pre>
            </div>
          ) : (
            <div>Training in progress...</div>
          )}
        </div>
      );
    };
    
    export default NeuralNetworkComponent;

Evaluation & Metrics


useMetrics

  • Description: Computes essential metrics like Mean Squared Error (MSE), accuracy, precision, recall, etc., to evaluate model performance.

  • Parameters:

    • actual (array): The actual target values.
    • predicted (array): The predicted target values from the model.
  • Returns:

    • metrics (object): An object containing computed metrics.
  • Usage:

    const { metrics } = useMetrics(actualValues, predictedValues);
  • Example:

    import React from 'react';
    import { useMetrics } from 'useaiml';
    
    const MetricsComponent = ({ actual, predicted }) => {
      const { metrics } = useMetrics(actual, predicted);
    
      return (
        <div>
          <h2>Model Metrics:</h2>
          <pre>{JSON.stringify(metrics, null, 2)}</pre>
        </div>
      );
    };
    
    export default MetricsComponent;

useCrossValidation

  • Description: Performs cross-validation to assess model performance across different subsets of the dataset.

  • Parameters:

    • model (object): The machine learning model to evaluate.
    • data (object): The dataset containing features and targets.
    • k (number): The number of folds for cross-validation.
  • Returns:

    • cvResults (array): An array containing performance metrics for each fold.
  • Usage:

    const { cvResults } = useCrossValidation(model, data, 5);
  • Example:

    import React from 'react';
    import { useCrossValidation } from 'useaiml';
    
    const CrossValidationComponent = ({ model, data }) => {
      const { cvResults } = useCrossValidation(model, data, 5);
    
      return (
        <div>
          <h2>Cross-Validation Results:</h2>
          <pre>{JSON.stringify(cvResults, null, 2)}</pre>
        </div>
      );
    };
    
    export default CrossValidationComponent;

useHyperparameterTuning

  • Description: Optimizes your model's hyperparameters to enhance performance.

  • Parameters:

    • model (object): The machine learning model to tune.
    • params (object): An object specifying the hyperparameters to tune and their possible values.
    • data (object): The dataset containing features and targets.
  • Returns:

    • bestParams (object): The set of hyperparameters that yielded the best performance.
  • Usage:

    const { bestParams } = useHyperparameterTuning(model, params, data);
  • Example:

    import React from 'react';
    import { useHyperparameterTuning } from 'useaiml';
    
    const HyperparameterTuningComponent = ({ model, data }) => {
      const params = {
        n_estimators: [50, 100, 150],
        max_depth: [5, 10, 15]
      };
      const { bestParams } = useHyperparameterTuning(model, params, data);
    
      return (
        <div>
          <h2>Best Hyperparameters:</h2>
          <pre>{JSON.stringify(bestParams, null, 2)}</pre>
        </div>
      );
    };
    
    export default HyperparameterTuningComponent;

useNN

  • Description: Builds, trains, and utilizes customizable neural networks with support for various layers and activation functions.

  • Parameters:

    • None
  • Returns:

    • layers (array): The current layers of the neural network.
    • addLayer (function): Function to add a new layer to the network.
    • removeLayer (function): Function to remove an existing layer from the network.
    • train (function): Function to train the neural network with features and targets.
    • predict (function): Function to make predictions using the trained neural network.
    • trained (boolean): Indicates whether the model has been trained.
    • lossHistory (array): Tracks the loss over training epochs.
  • Usage:

    const { layers, addLayer, removeLayer, train, predict, trained, lossHistory } = useNN();
  • Example:

    import React, { useEffect } from 'react';
    import { useNN, useMetrics } from 'useaiml';
    
    const NeuralNetworkComponent = () => {
      const { layers, addLayer, train, predict, trained, lossHistory } = useNN();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        // Add layers to the neural network
        addLayer({ type: 'dense', inputSize: 1, outputSize: 10, activation: 'relu' });
        addLayer({ type: 'dense', inputSize: 10, outputSize: 1, activation: 'sigmoid' });
    
        // Prepare training data
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          targets: [[0], [0], [1], [1], [1]]
        };
    
        // Train the neural network
        train(trainingData.features, trainingData.targets, 1000, 0.01);
      }, [addLayer, train]);
    
      useEffect(() => {
        if (trained) {
          const prediction = predict([6]);
          console.log('Prediction for input 6:', prediction);
        }
      }, [trained, predict]);
    
      return (
        <div>
          <h2>Neural Network Model</h2>
          {trained ? (
            <div>
              <h3>Training Complete</h3>
              <pre>Loss History: {JSON.stringify(lossHistory, null, 2)}</pre>
              <pre>Metrics: {JSON.stringify(metrics, null, 2)}</pre>
            </div>
          ) : (
            <div>Training in progress...</div>
          )}
        </div>
      );
    };
    
    export default NeuralNetworkComponent;

Evaluation & Metrics


useMetrics

  • Description: Computes essential metrics like Mean Squared Error (MSE), accuracy, precision, recall, etc., to evaluate model performance.

  • Parameters:

    • actual (array): The actual target values.
    • predicted (array): The predicted target values from the model.
  • Returns:

    • metrics (object): An object containing computed metrics.
  • Usage:

    const { metrics } = useMetrics(actualValues, predictedValues);
  • Example:

    import React from 'react';
    import { useMetrics } from 'useaiml';
    
    const MetricsComponent = ({ actual, predicted }) => {
      const { metrics } = useMetrics(actual, predicted);
    
      return (
        <div>
          <h2>Model Metrics:</h2>
          <pre>{JSON.stringify(metrics, null, 2)}</pre>
        </div>
      );
    };
    
    export default MetricsComponent;

useCrossValidation

  • Description: Performs cross-validation to assess model performance across different subsets of the dataset.

  • Parameters:

    • model (object): The machine learning model to evaluate.
    • data (object): The dataset containing features and targets.
    • k (number): The number of folds for cross-validation.
  • Returns:

    • cvResults (array): An array containing performance metrics for each fold.
  • Usage:

    const { cvResults } = useCrossValidation(model, data, 5);
  • Example:

    import React from 'react';
    import { useCrossValidation } from 'useaiml';
    
    const CrossValidationComponent = ({ model, data }) => {
      const { cvResults } = useCrossValidation(model, data, 5);
    
      return (
        <div>
          <h2>Cross-Validation Results:</h2>
          <pre>{JSON.stringify(cvResults, null, 2)}</pre>
        </div>
      );
    };
    
    export default CrossValidationComponent;

useHyperparameterTuning

  • Description: Optimizes your model's hyperparameters to enhance performance.

  • Parameters:

    • model (object): The machine learning model to tune.
    • params (object): An object specifying the hyperparameters to tune and their possible values.
    • data (object): The dataset containing features and targets.
  • Returns:

    • bestParams (object): The set of hyperparameters that yielded the best performance.
  • Usage:

    const { bestParams } = useHyperparameterTuning(model, params, data);
  • Example:

    import React from 'react';
    import { useHyperparameterTuning } from 'useaiml';
    
    const HyperparameterTuningComponent = ({ model, data }) => {
      const params = {
        n_estimators: [50, 100, 150],
        max_depth: [5, 10, 15]
      };
      const { bestParams } = useHyperparameterTuning(model, params, data);
    
      return (
        <div>
          <h2>Best Hyperparameters:</h2>
          <pre>{JSON.stringify(bestParams, null, 2)}</pre>
        </div>
      );
    };
    
    export default HyperparameterTuningComponent;

useNN

  • Description: Builds, trains, and utilizes customizable neural networks with support for various layers and activation functions.

  • Parameters:

    • None
  • Returns:

    • layers (array): The current layers of the neural network.
    • addLayer (function): Function to add a new layer to the network.
    • removeLayer (function): Function to remove an existing layer from the network.
    • train (function): Function to train the neural network with features and targets.
    • predict (function): Function to make predictions using the trained neural network.
    • trained (boolean): Indicates whether the model has been trained.
    • lossHistory (array): Tracks the loss over training epochs.
  • Usage:

    const { layers, addLayer, removeLayer, train, predict, trained, lossHistory } = useNN();
  • Example:

    import React, { useEffect } from 'react';
    import { useNN, useMetrics } from 'useaiml';
    
    const NeuralNetworkComponent = () => {
      const { layers, addLayer, removeLayer, train, predict, trained, lossHistory } = useNN();
      const { metrics } = useMetrics();
    
      useEffect(() => {
        // Add layers to the neural network
        addLayer({ type: 'dense', inputSize: 1, outputSize: 10, activation: 'relu' });
        addLayer({ type: 'dense', inputSize: 10, outputSize: 1, activation: 'sigmoid' });
    
        // Prepare training data
        const trainingData = {
          features: [[1], [2], [3], [4], [5]],
          targets: [[0], [0], [1], [1], [1]]
        };
    
        // Train the neural network
        train(trainingData.features, trainingData.targets, 1000, 0.01);
      }, [addLayer, train]);
    
      useEffect(() => {
        if (trained) {
          const prediction = predict([6]);
          console.log('Prediction for input 6:', prediction);
        }
      }, [trained, predict]);
    
      return (
        <div>
          <h2>Neural Network Model</h2>
          {trained ? (
            <div>
              <h3>Training Complete</h3>
              <pre>Loss History: {JSON.stringify(lossHistory, null, 2)}</pre>
              <pre>Metrics: {JSON.stringify(metrics, null, 2)}</pre>
            </div>
          ) : (
            <div>Training in progress...</div>
          )}
        </div>
      );
    };
    
    export default NeuralNetworkComponent;

Evaluation & Metrics


useMetrics

  • Description: Computes essential metrics like Mean Squared Error (MSE), accuracy, precision, recall, etc., to evaluate model performance.

  • Parameters:

    • actual (array): The actual target values.
    • predicted (array): The predicted target values from the model.
  • Returns:

    • metrics (object): An object containing computed metrics.
  • Usage:

    const { metrics } = useMetrics(actualValues, predictedValues);
  • Example:

    import React from 'react';
    import { useMetrics } from 'useaiml';
    
    const MetricsComponent = ({ actual, predicted }) => {
      const { metrics } = useMetrics(actual, predicted);
    
      return (
        <div>
          <h2>Model Metrics:</h2>
          <pre>{JSON.stringify(metrics, null, 2)}</pre>
        </div>
      );
    };
    
    export default MetricsComponent;

Visualization


useVisualization

  • Description: Generates insightful visualizations for your data and models, such as scatter plots, histograms, and ROC curves.

  • Parameters:

    • data (array | object): The dataset to visualize.
    • options (object): Configuration options for the visualization (e.g., chart type, axes labels).
  • Returns:

    • chartData (object): The prepared data for visualization.
  • Usage:

    const { chartData } = useVisualization(data, { type: 'scatter', x: 'feature1', y: 'target' });
  • Example:

    import React from 'react';
    import { useVisualization } from 'useaiml';
    import { Scatter } from 'react-chartjs-2';
    
    const ScatterPlotComponent = ({ data }) => {
      const { chartData } = useVisualization(data, { type: 'scatter', x: 'feature1', y: 'target' });
    
      return (
        <div>
          <h2>Scatter Plot:</h2>
          <Scatter data={chartData} />
        </div>
      );
    };
    
    export default ScatterPlotComponent;

Advanced Functionalities


usePipeline

  • Description: Creates and manages machine learning pipelines, allowing for sequential processing of data and models.

  • Parameters:

    • steps (array): An array of processing steps, where each step is an object with name and transform or model properties.
  • Returns:

    • pipeline (object): The configured pipeline.
    • runPipeline (function): Function to execute the pipeline with input data.
  • Usage:

    const { pipeline, runPipeline } = usePipeline(steps);
  • Example:

    import React from 'react';
    import { usePipeline } from 'useaiml';
    
    const PipelineComponent = () => {
      const steps = [
        { name: 'scaler', transform: (data) => /* scaling logic */ },
        { name: 'model', model: /* trained model */ }
      ];
      const { pipeline, runPipeline } = usePipeline(steps);
    
      const handleRun = () => {
        const inputData = /* your input data */;
        const output = runPipeline(inputData);
        console.log('Pipeline Output:', output);
      };
    
      return (
        <div>
          <h2>Machine Learning Pipeline</h2>
          <button onClick={handleRun}>Run Pipeline</button>
        </div>
      );
    };
    
    export default PipelineComponent;

useBatchPrediction

  • Description: Makes batch predictions on large datasets efficiently.

  • Parameters:

    • model (object): The trained machine learning model.
    • batchData (array): The dataset on which to make predictions.
  • Returns:

    • predictions (array): The predicted values for the batch data.
  • Usage:

    const { predictions } = useBatchPrediction(model, batchData);
  • Example:

    import React from 'react';
    import { useBatchPrediction } from 'useaiml';
    
    const BatchPredictionComponent = ({ model, batchData }) => {
      const { predictions } = useBatchPrediction(model, batchData);
    
      return (
        <div>
          <h2>Batch Predictions:</h2>
          <pre>{JSON.stringify(predictions, null, 2)}</pre>
        </div>
      );
    };
    
    export default BatchPredictionComponent;

useOnlineLearning

  • Description: Updates your models in real-time with new data, facilitating continuous learning.

  • Parameters:

    • initialModel (object): The initial machine learning model to update.
  • Returns:

    • model (object): The updated machine learning model.
    • updateModel (function): Function to update the model with new data.
  • Usage:

    const { model, updateModel } = useOnlineLearning(initialModel);
  • Example:

    import React, { useEffect } from 'react';
    import { useOnlineLearning } from 'useaiml';
    
    const OnlineLearningComponent = ({ initialModel }) => {
      const { model, updateModel } = useOnlineLearning(initialModel);
    
      useEffect(() => {
        const newData = {
          features: [[6], [7]],
          target: [12, 14]
        };
        updateModel(newData.features, newData.target);
      }, [updateModel]);
    
      return (
        <div>
          <h2>Online Learning Model</h2>
          {model ? <div>Model updated with new data.</div> : <div>Updating model...</div>}
        </div>
      );
    };
    
    export default OnlineLearningComponent;

useModelMonitoring

  • Description: Monitors your model's performance over time, tracking metrics and detecting potential issues.

  • Parameters:

    • model (object): The machine learning model to monitor.
    • newData (array): New data to evaluate the model's performance.
  • Returns:

    • performance (object): An object containing updated performance metrics.
  • Usage:

    const { performance } = useModelMonitoring(model, newData);
  • Example:

    import React from 'react';
    import { useModelMonitoring } from 'useaiml';
    
    const ModelMonitoringComponent = () => {
      const { performance } = useModelMonitoring(model, newData);
    
      return (
        <div>
          <h2>Model Performance Monitoring:</h2>
          <pre>{JSON.stringify(performance, null, 2)}</pre>
        </div>
      );
    };
    
    export default ModelMonitoringComponent;

Data Augmentation


useDataAugmentation

  • Description: Augments your data to improve model robustness by introducing variations.

  • Parameters:

    • data (array): The original dataset to augment.
    • augmentationOptions (object): Configuration options for data augmentation (e.g., rotation angles, scaling factors).
  • Returns:

    • augmentedData (array): The augmented dataset.
  • Usage:

    const { augmentedData } = useDataAugmentation(data, { rotation: 15, scale: 1.2 });
  • Example:

    import React from 'react';
    import { useDataAugmentation } from 'useaiml';
    
    const DataAugmentationComponent = ({ data }) => {
      const { augmentedData } = useDataAugmentation(data, { rotation: 10, scale: 1.1 });
    
      return (
        <div>
          <h2>Data Augmentation:</h2>
          <pre>{JSON.stringify(augmentedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataAugmentationComponent;

Data Cleaning


useDataCleaning

  • Description: Cleans your data by removing duplicates, correcting inconsistencies, and performing other cleaning tasks.

  • Parameters:

    • data (array | object): The dataset to clean.
  • Returns:

    • cleanedData (array | object): The cleaned dataset.
  • Usage:

    const { cleanedData } = useDataCleaning(data);
  • Example:

    import React from 'react';
    import { useDataCleaning } from 'useaiml';
    
    const DataCleaningComponent = ({ data }) => {
      const { cleanedData } = useDataCleaning(data);
    
      return (
        <div>
          <h2>Data Cleaning:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataCleaningComponent;

useHandleMissingValues

  • Description: Handles missing values in your dataset through imputation or removal.

  • Parameters:

    • data (array | object): The dataset containing missing values.
    • strategy (string): The strategy to handle missing values (e.g., 'mean', 'median', 'mode', 'drop').
  • Returns:

    • cleanedData (array | object): The dataset with missing values handled.
  • Usage:

    const { cleanedData } = useHandleMissingValues(data, 'mean');
  • Example:

    import React from 'react';
    import { useHandleMissingValues } from 'useaiml';
    
    const HandleMissingValuesComponent = ({ data }) => {
      const { cleanedData } = useHandleMissingValues(data, 'median');
    
      return (
        <div>
          <h2>Handle Missing Values:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default HandleMissingValuesComponent;

Exploratory Data Analysis (EDA)


useEDA

  • Description: Performs exploratory data analysis to uncover patterns, trends, and insights within your dataset.

  • Parameters:

    • data (array | object): The dataset to analyze.
  • Returns:

    • edaResults (object): An object containing various EDA metrics and visualizations.
  • Usage:

    const { edaResults } = useEDA(data);
  • Example:

    import React from 'react';
    import { useEDA } from 'useaiml';
    
    const EDAComponent = ({ data }) => {
      const { edaResults } = useEDA(data);
    
      return (
        <div>
          <h2>Exploratory Data Analysis:</h2>
          <pre>{JSON.stringify(edaResults, null, 2)}</pre>
        </div>
      );
    };
    
    export default EDAComponent;

Distance & Similarity Calculations


useDistanceCalculation

  • Description: Computes various distance metrics between data points, such as Euclidean, Manhattan, or Cosine distance.

  • Parameters:

    • pointA (array): The first data point.
    • pointB (array): The second data point.
    • metric (string): The distance metric to use (e.g., 'euclidean', 'manhattan', 'cosine').
  • Returns:

    • distance (number): The computed distance between the two points.
  • Usage:

    const { distance } = useDistanceCalculation(pointA, pointB, 'euclidean');
  • Example:

    import React from 'react';
    import { useDistanceCalculation } from 'useaiml';
    
    const DistanceCalculationComponent = () => {
      const pointA = [1, 2];
      const pointB = [3, 4];
      const { distance } = useDistanceCalculation(pointA, pointB, 'euclidean');
    
      return (
        <div>
          <h2>Distance Calculation:</h2>
          <p>Distance between {JSON.stringify(pointA)} and {JSON.stringify(pointB)}: {distance}</p>
        </div>
      );
    };
    
    export default DistanceCalculationComponent;

useSimilarity

  • Description: Computes similarity metrics between data points, such as Cosine similarity or Pearson correlation.

  • Parameters:

    • pointA (array): The first data point.
    • pointB (array): The second data point.
    • metric (string): The similarity metric to use (e.g., 'cosine', 'pearson').
  • Returns:

    • similarity (number): The computed similarity between the two points.
  • Usage:

    const { similarity } = useSimilarity(pointA, pointB, 'cosine');
  • Example:

    import React from 'react';
    import { useSimilarity } from 'useaiml';
    
    const SimilarityComponent = () => {
      const pointA = [1, 2, 3];
      const pointB = [4, 5, 6];
      const { similarity } = useSimilarity(pointA, pointB, 'pearson');
    
      return (
        <div>
          <h2>Similarity Calculation:</h2>
          <p>Similarity between {JSON.stringify(pointA)} and {JSON.stringify(pointB)}: {similarity}</p>
        </div>
      );
    };
    
    export default SimilarityComponent;

Imbalanced Data Handling


useImbalancedHandling

  • Description: Addresses class imbalances in your datasets through techniques like oversampling, undersampling, or SMOTE.

  • Parameters:

    • data (object): The dataset containing features and targets.
    • strategy (string): The strategy to handle imbalance (e.g., 'oversample', 'undersample', 'SMOTE').
  • Returns:

    • balancedData (object): The dataset after applying imbalance handling techniques.
  • Usage:

    const { balancedData } = useImbalancedHandling(data, 'SMOTE');
  • Example:

    import React from 'react';
    import { useImbalancedHandling } from 'useaiml';
    
    const ImbalancedHandlingComponent = ({ data }) => {
      const { balancedData } = useImbalancedHandling(data, 'oversample');
    
      return (
        <div>
          <h2>Imbalanced Data Handling:</h2>
          <pre>{JSON.stringify(balancedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default ImbalancedHandlingComponent;

Model Explainability


useModelExplainability

  • Description: Provides tools and metrics to interpret and understand your model's decisions, enhancing transparency and trust.

  • Parameters:

    • model (object): The machine learning model to explain.
    • data (array): The dataset used for generating explanations.
  • Returns:

    • explanations (object): An object containing various explainability metrics and visualizations.
  • Usage:

    const { explanations } = useModelExplainability(model, data);
  • Example:

    import React from 'react';
    import { useModelExplainability } from 'useaiml';
    
    const ModelExplainabilityComponent = ({ model, data }) => {
      const { explanations } = useModelExplainability(model, data);
    
      return (
        <div>
          <h2>Model Explainability:</h2>
          <pre>{JSON.stringify(explanations, null, 2)}</pre>
        </div>
      );
    };
    
    export default ModelExplainabilityComponent;

Pipeline Management


usePipeline

  • Description: Creates and manages machine learning pipelines, allowing for sequential processing of data and models.

  • Parameters:

    • steps (array): An array of processing steps, where each step is an object with name and transform or model properties.
  • Returns:

    • pipeline (object): The configured pipeline.
    • runPipeline (function): Function to execute the pipeline with input data.
  • Usage:

    const { pipeline, runPipeline } = usePipeline(steps);
  • Example:

    import React from 'react';
    import { usePipeline } from 'useaiml';
    
    const PipelineComponent = () => {
      const steps = [
        { name: 'scaler', transform: (data) => /* scaling logic */ },
        { name: 'model', model: /* trained model */ }
      ];
      const { pipeline, runPipeline } = usePipeline(steps);
    
      const handleRun = () => {
        const inputData = /* your input data */;
        const output = runPipeline(inputData);
        console.log('Pipeline Output:', output);
      };
    
      return (
        <div>
          <h2>Machine Learning Pipeline</h2>
          <button onClick={handleRun}>Run Pipeline</button>
        </div>
      );
    };
    
    export default PipelineComponent;

Batch Prediction


useBatchPrediction

  • Description: Makes batch predictions on large datasets efficiently.

  • Parameters:

    • model (object): The trained machine learning model.
    • batchData (array): The dataset on which to make predictions.
  • Returns:

    • predictions (array): The predicted values for the batch data.
  • Usage:

    const { predictions } = useBatchPrediction(model, batchData);
  • Example:

    import React from 'react';
    import { useBatchPrediction } from 'useaiml';
    
    const BatchPredictionComponent = ({ model, batchData }) => {
      const { predictions } = useBatchPrediction(model, batchData);
    
      return (
        <div>
          <h2>Batch Predictions:</h2>
          <pre>{JSON.stringify(predictions, null, 2)}</pre>
        </div>
      );
    };
    
    export default BatchPredictionComponent;

Online Learning


useOnlineLearning

  • Description: Updates your models in real-time with new data, facilitating continuous learning.

  • Parameters:

    • initialModel (object): The initial machine learning model to update.
  • Returns:

    • model (object): The updated machine learning model.
    • updateModel (function): Function to update the model with new data.
  • Usage:

    const { model, updateModel } = useOnlineLearning(initialModel);
  • Example:

    import React, { useEffect } from 'react';
    import { useOnlineLearning } from 'useaiml';
    
    const OnlineLearningComponent = ({ initialModel }) => {
      const { model, updateModel } = useOnlineLearning(initialModel);
    
      useEffect(() => {
        const newData = {
          features: [[6], [7]],
          target: [12, 14]
        };
        updateModel(newData.features, newData.target);
      }, [updateModel]);
    
      return (
        <div>
          <h2>Online Learning Model</h2>
          {model ? <div>Model updated with new data.</div> : <div>Updating model...</div>}
        </div>
      );
    };
    
    export default OnlineLearningComponent;

Model Monitoring


useModelMonitoring

  • Description: Monitors your model's performance over time, tracking metrics and detecting potential issues.

  • Parameters:

    • model (object): The machine learning model to monitor.
    • newData (array): New data to evaluate the model's performance.
  • Returns:

    • performance (object): An object containing updated performance metrics.
  • Usage:

    const { performance } = useModelMonitoring(model, newData);
  • Example:

    import React from 'react';
    import { useModelMonitoring } from 'useaiml';
    
    const ModelMonitoringComponent = () => {
      const { performance } = useModelMonitoring(model, newData);
    
      return (
        <div>
          <h2>Model Performance Monitoring:</h2>
          <pre>{JSON.stringify(performance, null, 2)}</pre>
        </div>
      );
    };
    
    export default ModelMonitoringComponent;

Data Augmentation


useDataAugmentation

  • Description: Augments your data to improve model robustness by introducing variations.

  • Parameters:

    • data (array): The original dataset to augment.
    • augmentationOptions (object): Configuration options for data augmentation (e.g., rotation angles, scaling factors).
  • Returns:

    • augmentedData (array): The augmented dataset.
  • Usage:

    const { augmentedData } = useDataAugmentation(data, { rotation: 15, scale: 1.2 });
  • Example:

    import React from 'react';
    import { useDataAugmentation } from 'useaiml';
    
    const DataAugmentationComponent = ({ data }) => {
      const { augmentedData } = useDataAugmentation(data, { rotation: 10, scale: 1.1 });
    
      return (
        <div>
          <h2>Data Augmentation:</h2>
          <pre>{JSON.stringify(augmentedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataAugmentationComponent;

Data Cleaning


useDataCleaning

  • Description: Cleans your data by removing duplicates, correcting inconsistencies, and performing other cleaning tasks.

  • Parameters:

    • data (array | object): The dataset to clean.
  • Returns:

    • cleanedData (array | object): The cleaned dataset.
  • Usage:

    const { cleanedData } = useDataCleaning(data);
  • Example:

    import React from 'react';
    import { useDataCleaning } from 'useaiml';
    
    const DataCleaningComponent = ({ data }) => {
      const { cleanedData } = useDataCleaning(data);
    
      return (
        <div>
          <h2>Data Cleaning:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default DataCleaningComponent;

useHandleMissingValues

  • Description: Handles missing values in your dataset through imputation or removal.

  • Parameters:

    • data (array | object): The dataset containing missing values.
    • strategy (string): The strategy to handle missing values (e.g., 'mean', 'median', 'mode', 'drop').
  • Returns:

    • cleanedData (array | object): The dataset with missing values handled.
  • Usage:

    const { cleanedData } = useHandleMissingValues(data, 'mean');
  • Example:

    import React from 'react';
    import { useHandleMissingValues } from 'useaiml';
    
    const HandleMissingValuesComponent = ({ data }) => {
      const { cleanedData } = useHandleMissingValues(data, 'median');
    
      return (
        <div>
          <h2>Handle Missing Values:</h2>
          <pre>{JSON.stringify(cleanedData, null, 2)}</pre>
        </div>
      );
    };
    
    export default HandleMissingValuesComponent;

Exploratory Data Analysis (EDA)


useEDA

  • Description: Performs exploratory data analysis to uncover patterns, trends, and insights within your dataset.

  • Parameters:

    • data (array | object): The dataset to analyze.
  • Returns:

    • edaResults (object): An object containing various EDA metrics and visualizations.
  • Usage:

    const { edaResults } = useEDA(data);
  • Example:

    import React from 'react';
    import { useEDA } from 'useaiml';
    
    const EDAComponent = ({ data }) => {
      const { edaResults } = useEDA(data);
    
      return (
        <div>
          <h2>Exploratory Data Analysis:</h2>
          <pre>{JSON.stringify(edaResults, null, 2)}</pre>
        </div>
      );
    };
    
    export default EDAComponent;

Distance & Similarity Calculations


useDistanceCalculation

  • Description: Computes various distance metrics between data points, such as Euclidean, Manhattan, or Cosine distance.

  • Parameters:

    • pointA (array): The first data point.
    • pointB (array): The second data point.
    • metric (string): The distance metric to use (e.g., 'euclidean', 'manhattan', 'cosine').
  • Returns:

    • distance (number): The computed distance between the two points.
  • Usage:

    const { distance } = useDistanceCalculation(pointA, pointB, 'euclidean');
  • Example:

    import React from 'react';
    import { useDistanceCalculation } from 'useaiml';
    
    const DistanceCalculationComponent = () => {
      const pointA = [1, 2];
      const pointB = [3, 4];
      const { distance } = useDistanceCalculation(pointA, pointB, 'euclidean');
    
      return (
        <div>
          <h2>Distance Calculation:</h2>
          <p>Distance between {JSON.stringify(pointA)} and {JSON.stringify(pointB)}: {distance}</p>
        </div>
      );
    };
    
    export default DistanceCalculationComponent;

useSimilarity

  • Description: Computes similarity metrics between data points, such as Cosine similarity or Pearson correlation.

  • Parameters:

    • pointA (array): The first data point.
    • pointB (array): The second data point.
    • metric (string): The similarity metric to use (e.g., 'cosine', 'pearson').
  • Returns:

    • similarity (number): The computed similarity between the two points.
  • Usage:

    const { similarity } = useSimilarity(pointA, pointB, 'cosine');
  • Example:

    import React from 'react';
    import { useSimilarity } from 'useaiml';
    
    const SimilarityComponent = () => {
      const pointA = [1, 2, 3];
      const pointB = [4, 5, 6];
      const { similarity } = useSimilarity(pointA, pointB, 'pearson');
    
      return (
        <div>
          <h2>Similarity Calculation:</h2>
          <p>Similarity between {JSON.stringify(pointA)} and {JSON.stringify(pointB)}: {similarity}</p>
        </div>
      );
    };
    
    export default SimilarityComponent;

Examples

Example 1: Data Loading and Display

import React from 'react';
import { useDataLoader } from 'useaiml';

const DataDisplay = () => {
  const { data, error } = useDataLoader('https://api.example.com/data');

  if (error) return <div>Error: {error}</div>;
  if (!data) return <div>Loading...</div>;

  return (
    <div>
      <h1>Data Loaded Successfully!</h1>
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  );
};

export default DataDisplay;

Example 2: Training a Linear Regression Model

import React, { useEffect } from 'react';
import { useLinearRegression, useMetrics } from 'useaiml';

const LinearRegressionComponent = () => {
  const { model, train } = useLinearRegression();
  const { metrics } = useMetrics();

  useEffect(() => {
    const trainingData = {
      features: [[1], [2], [3], [4], [5]],
      target: [2, 4, 6, 8, 10]
    };
    train(trainingData.features, trainingData.target);
  }, [train]);

  useEffect(() => {
    if (model && model.predict) {
      const predictions = model.predict([[6]]);
      console.log('Predictions:', predictions);
    }
  }, [model]);

  return (
    <div>
      <h2>Linear Regression Model</h2>
      {metrics && (
        <div>
          <h3>Model Metrics:</h3>
          <pre>{JSON.stringify(metrics, null, 2)}</pre>
        </div>
      )}
    </div>
  );
};

export default LinearRegressionComponent;

Example 3: Data Preprocessing and Feature Engineering

import React, { useEffect } from 'react';
import { useScaler, useFeatureEngineering } from 'useaiml';

const PreprocessingComponent = ({ data }) => {
  const { scaledData } = useScaler(data, 'standard');
  const { engineeredData } = useFeatureEngineering(scaledData, { polynomial: 2 });

  useEffect(() => {
    console.log('Scaled Data:', scaledData);
    console.log('Engineered Data:', engineeredData);
  }, [scaledData, engineeredData]);

  return (
    <div>
      <h2>Data Preprocessing and Feature Engineering</h2>
      {/* Render or visualize processed data as needed */}
    </div>
  );
};

export default PreprocessingComponent;

Example 4: Model Monitoring

import React from 'react';
import { useModelMonitoring } from 'useaiml';

const ModelMonitoringComponent = () => {
  const { performance } = useModelMonitoring(model, newData);

  return (
    <div>
      <h2>Model Performance Monitoring:</h2>
      <pre>{JSON.stringify(performance, null, 2)}</pre>
    </div>
  );
};

export default ModelMonitoringComponent;

Example 5: Neural Network Training and Prediction

import React, { useEffect } from 'react';
import { useNN, useMetrics } from 'useaiml';

const NeuralNetworkComponent = () => {
  const { layers, addLayer, removeLayer, train, predict, trained, lossHistory } = useNN();
  const { metrics } = useMetrics();

  useEffect(() => {
    // Add layers to the neural network
    addLayer({ type: 'dense', inputSize: 1, outputSize: 10, activation: 'relu' });
    addLayer({ type: 'dense', inputSize: 10, outputSize: 1, activation: 'sigmoid' });

    // Prepare training data
    const trainingData = {
      features: [[1], [2], [3], [4], [5]],
      targets: [[0], [0], [1], [1], [1]]
    };

    // Train the neural network
    train(trainingData.features, trainingData.targets, 1000, 0.01);
  }, [addLayer, train]);

  useEffect(() => {
    if (trained) {
      const prediction = predict([6]);
      console.log('Prediction for input 6:', prediction);
    }
  }, [trained, predict]);

  return (
    <div>
      <h2>Neural Network Model</h2>
      {trained ? (
        <div>
          <h3>Training Complete</h3>
          <pre>Loss History: {JSON.stringify(lossHistory, null, 2)}</pre>
          <pre>Metrics: {JSON.stringify(metrics, null, 2)}</pre>
        </div>
      ) : (
        <div>Training in progress...</div>
      )}
    </div>
  );
};

export default NeuralNetworkComponent;

License

MIT © Sai Pavan Velidandla

This project is licensed under the MIT License. See the LICENSE file for details.

Support

If you encounter any issues or have questions, feel free to open an issue on the NPM package page or contact me directly at connectwithpavan@gmail.com.

Acknowledgements

  • Inspired by the need for seamless integration of machine learning workflows within React applications.
  • Thanks to the open-source community for providing tools and resources that made this project possible.

Package Sidebar

Install

npm i useaiml

Weekly Downloads

1

Version

2.0.0

License

MIT

Unpacked Size

433 kB

Total Files

96

Last publish

Collaborators

  • connectwithpavan