DEV Community: Artemiy Vereshchinskiy

Backendless Fullstack Development: React useForm + RushDB

Artemiy Vereshchinskiy — Thu, 26 Jun 2025 15:53:48 +0000

TL;DR: This example shows how to build a full-stack application using React Hook Form + RushDB with zero schema setup, backend efforts or data normalization. View the complete source code.

In modern web development, we often spend more time dealing with data modeling, normalization, and database migrations than on the actual business logic that drives our applications. What if we could skip all of that and focus solely on the shape of our data and the user experience?

This article explores how combining React Hook Form with RushDB creates a powerful, backendless approach to fullstack development that eliminates the traditional complexity of working with form data.

The Traditional Form Submission Flow

Let's consider what typically happens when building a form in a web application:

Define database schema/migrations
Create models with proper validation
Build controllers to handle data transformation
Set up services to process business logic
Design a REST API to connect your frontend
Implement API calls from your frontend form
Normalize nested data before storing it

This approach requires maintaining multiple data representations across your stack, writing repetitive boilerplate code, and continuously synchronizing changes between layers. Even with ORMs and other tools, the complexity remains significant.

The Backendless Approach with RushDB

RushDB offers a radically different approach by providing a graph database that:

Accepts any JSON structure directly
Automatically normalizes nested objects into a graph
Requires zero schema setup or migrations
Preserves the exact shape of your data

This means you can take your form data exactly as it is structured in your frontend and store it directly without any transformation or normalization.

Let's See It In Action

Let's examine a comprehensive form implementation using React Hook Form with Zod validation and RushDB for storage.

1. Setting Up RushDB

First, we initialize the RushDB client:

// db.ts
import { RushDB } from "@rushdb/javascript-sdk";

// Initialize RushDB
export const db = new RushDB(env.RUSHDB_API_TOKEN);

That's it! No schema definitions, no models, no complex setup.

You can get a free API token by signing up at app.rushdb.com.
For more information on getting started, see the official documentation.

2. Defining Our Form Schema

We use Zod to define the validation schema for our form:

// Form validation schema
const formSchema = z.object({
  // Personal Information
  firstName: z.string().min(2, "First name must be at least 2 characters"),
  lastName: z.string().min(2, "Last name must be at least 2 characters"),
  email: z.string().email("Invalid email address"),
  phone: z.string().min(10, "Phone number must be at least 10 digits"),
  dateOfBirth: z.string().min(1, "Date of birth is required"),

  // Address Information (nested object)
  address: z.object({
    street: z.string().min(5, "Street address is required"),
    city: z.string().min(2, "City is required"),
    state: z.string().min(2, "State is required"),
    zipCode: z.string().min(5, "ZIP code must be at least 5 characters"),
    country: z.string().min(2, "Country is required"),
  }),

  // Professional Information
  company: z.string().min(2, "Company name is required"),
  position: z.string().min(2, "Position is required"),
  experience: z.enum(["entry", "junior", "mid", "senior", "lead", "executive"]),
  salary: z.number().min(0, "Salary must be a positive number"),
  skills: z.array(z.string()).min(1, "At least one skill is required"),

  // Preferences (nested object with boolean values)
  preferences: z.object({
    newsletter: z.boolean(),
    notifications: z.boolean(),
    publicProfile: z.boolean(),
    dataSharing: z.boolean(),
  }),

  // Additional Information
  bio: z.string().max(500, "Bio must be less than 500 characters"),
  website: z.string().url("Invalid URL").optional().or(z.literal("")),
  linkedIn: z.string().url("Invalid LinkedIn URL").optional().or(z.literal("")),
  github: z.string().url("Invalid GitHub URL").optional().or(z.literal("")),
});

type FormData = z.infer<typeof formSchema>;

Notice how we naturally represent the form data with nested objects and arrays - this matches exactly how we think about the data in our application.

3. Submitting Form Data to RushDB

The most remarkable part is how we handle form submission:

const onSubmit = async (data: FormData) => {
  try {
    // Save to RushDB
    await db.records.createMany({
      label: "FORM_DATA",
      data,
    });

    reset(); // Reset form after successful submission
  } catch (error) {
    // ..
  } finally {
    // ..
  }
};

That's it! Just a single API call to store the entire form data, including nested objects and arrays, without any normalization or transformation.

This image shows the actual network request containing the raw form data that gets sent to RushDB. Notice how the nested structure stays intact with no transformation required.

What's Happening Behind the Scenes?

When you submit the form data to RushDB:

The entire JSON structure is accepted as-is
Nested objects (like address and preferences) are automatically normalized into separate nodes in the graph
Array items (like skills) are stored as a normal Property of FORM_DATA Record
The original structure is preserved for querying later

RushDB handles all the complexity of storing a deeply nested object structure while maintaining the relationships between entities.

The 3D graph visualization shows how RushDB has automatically normalized your form data into a graph structure. Each node represents an entity from your form, and the edges show the relationships between them.

Despite being stored as a graph, RushDB also provides this familiar table view of your data. This makes it easy to query and analyze your data in a familiar way.

Benefits of This Approach

1. Zero Backend Complexity

No need to:

Define schemas or migrations
Create models or DTOs
Build controllers and services
Normalize data manually

2. Preserve Natural Data Structures

Store data in the same shape as your application thinks about it
No need to flatten nested objects
Arrays are handled seamlessly

3. Full-Stack Type Safety

Your Zod schema generates TypeScript types that can be used throughout your application
The same types work for both form validation and data storage

4. Rapid Development

Focus on business logic and UX, not database structure
Iterate quickly without worrying about schema changes
Add new fields without migrations

Querying the Data

One of the most powerful aspects of RushDB is its ability to query this complex data structure easily. For example, finding all form submissions from senior engineers:

const seniorEngineers = await db.records.find({
  labels: ["FORM_DATA"],
  where: {
    experience: "senior",
    position: { $contains: "Engineer" },
  },
});

Or finding all users who have subscribed to the newsletter and have JavaScript skills:

const subscribedJsDevelopers = await db.records.find({
  labels: ["FORM_DATA"],
  where: {
    preferences: {
      newsletter: true,
    },
    skills: { $contains: "JavaScript" },
  },
});

Conclusion

The combination of React Hook Form for frontend validation and RushDB for data storage creates a powerful backendless approach to full-stack development. It allows you to focus on what really matters - the shape of your data and the user experience - without getting bogged down in database schemas, normalization, and complex backend architectures.

This approach is particularly well-suited for:

Rapid prototyping and MVP development
Applications with complex, nested data structures
Teams looking to reduce backend complexity
Projects where the data model is evolving rapidly

By removing the traditional backend complexity, you can build sophisticated applications faster and with less code. RushDB's ability to handle nested JSON structures directly means you can model your data in the most natural way for your application without worrying about how it will be stored.

For more information about RushDB's capabilities, check out the official documentation and explore the examples repository.

Source Code: The complete example from this article is available at github.com/rush-db/examples/tree/main/vite-react-useForm

Introducing RushDB: Zero-Config Instant Database for Modern Apps & AI Era

Artemiy Vereshchinskiy — Sun, 16 Feb 2025 17:53:20 +0000

In today's fast-paced development landscape, managing databases shouldn't slow you down. RushDB is a zero-config, graph-powered instant database designed to streamline data ingestion, normalization, and querying. Built for modern apps, AI, and DS/ML workflows, it offers automatic schema handling, ACID compliance, and a seamless developer experience.

Forget rigid schemas and manual indexing - RushDB lets you push raw JSON or CSV, automatically structures relationships, and optimizes queries on the fly. Whether you're building SaaS, AI models, or large-scale data applications, RushDB accelerates your workflow so you can focus on innovation, not infrastructure.

tldrl;

GitHub Repository

Homepage - rushdb.com

Demo App

Docs

Why RushDB?

Traditional databases slow teams down with complex setup, rigid schemas, and manual optimizations. We've seen firsthand how data management creates unnecessary friction, delaying feature development and forcing engineers to wrestle with infrastructure instead of shipping great products.

RushDB removes these barriers entirely by blending the best of both worlds - the freedom of writing data like MongoDB and the structured flattening of SQL. It automates data normalization, optimizes queries on the fly, and eliminates the need for manual indexing or schema design. The result? A frictionless developer experience that lets you focus on building, scaling, and delivering value—without getting stuck in database operations.

How RushDB Unlocks Developer Productivity

Zero Configuration – Just push any JSON or CSV; RushDB automatically suggests types, normalizes data, and labels relationships - all on the fly.
Graph-Powered Storage – Automatically structures relationships between data.
ACID Transactions – Ensures consistency and reliability.
Powerful Yet Simple Querying – RushDB eliminates the gap between how you perceive data and how you query it, making data retrieval frictionless and natural - so you can focus on shipping products, not syntax.
Self-Hosted or Cloud – Deploy anywhere with ease, or choose RushDB Cloud. Start building in under 30 seconds.
SDK-like DX Even for REST API – Enjoy a seamless developer experience with an intuitive, structured API that feels like an SDK, minimizing boilerplate and complexity.

Use Cases

SaaS & Apps

RushDB is perfect for modern SaaS applications requiring fast, schema-less data ingestion and querying.

AI & ML Research

With its graph-powered structure, RushDB simplifies working with interconnected datasets, making it ideal for AI-driven applications.

IoT & Search Engines

RushDB efficiently stores and retrieves large-scale IoT data and searchable content with built-in indexing.

Key Features

1. Accepts Any JSON, JSONB, and CSV Data

RushDB allows developers to push raw JSON or CSV data without worrying about schema definitions. RushDB automatically normalizes data and structures it as a graph, making queries fast and intuitive.

Create Record

Python:

from rushdb import RushDB

db = RushDB("API_TOKEN")

data = {
    "name": "Google LLC",
    "address": "1600 Amphitheatre Parkway, Mountain View, CA 94043, USA",
    "foundedAt": "1998-09-04T00:00:00.000Z",
    "rating": 4.9
}

record = db.records.create("COMPANY", data)

TypeScript:

const db = new RushDB('API_TOKEN');

const data = {
    name: 'Google LLC',
    address: '1600 Amphitheatre Parkway, Mountain View, CA 94043, USA',
    foundedAt: '1998-09-04T00:00:00.000Z',
    rating: 4.9
}

const record = await db.records.create("COMPANY", data)

Query Records

Python:

query = {
    "labels": ["COMPANY"],
    "where": {
        "name": {"$contains": "Goog"},
        "rating": {"$gte": 4}
    }
}

records = db.records.find(query)

TypeScript:

const records = await db.records.find({
    labels: ['COMPANY'],
    where: {
        name: { $contains: 'Goog' },
        rating: { $gte : 4 }
    }
})

Learn more in the docs

2. Automatic Data Normalization and Type Inference

RushDB takes raw input data and automatically structures it into a connected graph, allowing for seamless navigation across relationships.

Example JSON data

/* ORDER */
{
  "total": 109.98,                           <-- PROPERTY total:`number`
  "status": "processing",                    <-- PROPERTY status:`string`
  "placedAt": "2025-02-15T09:35:26+00:00",   <-- PROPERTY placedAt:`datatime`
  "SHIPPING": {                              <-- RECORD :SHIPPING
    "address": "123 Main St, City, Country", <-- PROPERTY address:`string`
    "method": "express",                     <-- PROPERTY method:`string`
    "cost": 9.99                             <-- PROPERTY cost:`number`
  }
}

Above payload will be automatically normalized into separate flat Records. And relationship between ORDER and SHIPPING will be created automatically.

Learn more in the docs

3. Relationships

RushDB automatically creates relationships between Records based on JSON input, which is normalized into separate flat Records.

However, relationship creation isn't limited to data loading. You can also establish relationships between existing Records, providing a powerful tool to add more meaning to your data.

Managing Relationships:
Python:

project = db.records.create(
    "PROJECT", {"name": "Secret Project", "budget": 1000000}
)

employee = db.records.create(
    "EMPLOYEE", {"name": "Nikola Tesla"}
)

options = RelationshipOptions(type="HAS_EMPLOYEE")

# create Relationship
project.attach(employee, options)

# delete Relationship
project.detach(employee)

TypeScript:

const project = await db.records.create('PROJECT', {
    name: 'Secret Project',
    budget: 1000000
})

const employee = await db.records.create('EMPLOYEE', {
    name: 'Nikola Tesla'
})

// create Relationship
await project.attach(employee, { type: 'HAS_EMPLOYEE' })

// delete Relationship
await project.detach(employee)

Learn more in the docs

4. Query Smarter, Not Harder

Effortlessly find exactly what you need. With automated, on-the-fly data normalization, you can query complex, deeply interconnected data without workarounds or unnecessary overhead - just clear, intuitive access to your data.

Examples

Python:

db.records.find(
    {
        "labels": ["COMPANY"],
        "where": {
            "stage": "seed",
            "address": {"$contains": "USA"},
            "foundedAt": {"$lte": {"$year": 2000}},
            "rating": {
                "$or": [{"$lt": 2.5}, {"$gte": 4.5}]
            },
            "EMPLOYEE": {
                "$relation": {"type": "HIRED", "direction": "out"},
                "$alias": "$employee",
                "salary": {
                    "$gte": 500_000
                }
            },
        },
        "aggregate": {
            "employees": {
                "fn": "collect",
                "alias": "$employee",
                "limit": 10
            }
        },
        "skip": 0,
        "limit": 100
    }
)

TypeScript:

await db.records.find({
  labels: ['COMPANY'],
  where: {
    stage: 'seed',
    address: { $contains: 'USA' },
    foundedAt: {
      $lte: { $year: 2000 }
    },
    rating: {
      $or: [{ $lt: 2.5 }, { $gte: 4.5 }]
    },
    EMPLOYEE: {
      $relation: { type: 'HIRED', direction: 'out' },
      $alias: '$employee',
      salary: {
        $gte: 500_000
      }
    }
  },
  aggregate: {
    employees: {
      fn: 'collect',
      alias: '$employee',
      limit: 10
    }
  },
  skip: 0,
  limit: 100
})

Under the hood, RushDB transforms this into an optimized and powerful Cypher query. The query engine allows developers to think about data naturally, the way we intuitively use and perceive it, while RushDB handles the complexity behind the scenes:

MATCH (record:__RUSHDB__LABEL__RECORD__:COMPANY { __RUSHDB__KEY__PROJECT__ID__: $projectId })

WHERE (any(value IN record.stage WHERE value = "seed"))
AND (any(value IN record.address WHERE value =~ "(?i).*USA.*"))
AND (any(value IN record.foundedAt WHERE apoc.convert.fromJsonMap(`record`.`__RUSHDB__KEY__PROPERTIES__META__`).`foundedAt` = "datetime" AND datetime(value) <= datetime({year: 2000})))
AND ((any(value IN record.rating WHERE value < 2.5) OR any(value IN record.rating WHERE value >= 4.5)))

ORDER BY record.`__RUSHDB__KEY__ID__`
DESC SKIP 0 LIMIT 100

OPTIONAL MATCH (record)-[:HIRED]->(record1:EMPLOYEE) WHERE (any(value IN record1.salary WHERE value >= 500000))
WITH record, record1
WHERE record IS NOT NULL AND record1 IS NOT NULL

WITH record,
apoc.coll.sortMaps(collect(DISTINCT record1 {
    .*, __RUSHDB__KEY__LABEL__: [label IN labels(record1) WHERE label <> "__RUSHDB__LABEL__RECORD__"][0]
}), "__RUSHDB__KEY__ID__")[0..10] AS `employees`

RETURN collect(DISTINCT record {
    __RUSHDB__KEY__ID__: record.__RUSHDB__KEY__ID__,
    __RUSHDB__KEY__PROPERTIES__META__: record.__RUSHDB__KEY__PROPERTIES__META__,
    __RUSHDB__KEY__LABEL__: [label IN labels(record) WHERE label <> "__RUSHDB__LABEL__RECORD__"][0],
    `employees`
}) AS records

Learn more in the docs

5. Transactions

RushDB is fully ACID-compliant, providing robust tools to ensure data consistency and reliability. With the Transactions API, you can execute multiple operations confidently - either every request completes successfully, or all changes are rolled back, maintaining data integrity.

Working with transactions in RushDB is seamless:

Python:

tx = db.transactions.begin()

try:
    # Create some Records
    item = db.records.create(
        "ITEM",
        {"title": "Nike Air Max 270", "price": 150},
        transaction=tx,
    )

    owner = db.records.create(
        "OWNER",
        {"name": "Jane Smith", "email": "janesmith@example.com"},
        transaction=tx
    )

    options = RelationshipOptions(type="OWN", direction="out")

    # create Relationship
    owner.attach(item, options, transaction=tx)

    # Simulate an error
    raise ValueError("Simulated error")

    # Commit the Transaction if all operations succeed
    tx.commit();

except ValueError:
    #  If any records or relationships creation failed, roll back the entire operation
    transaction.rollback()

TypeScript:

const tx = await db.tx.begin();

try {
  // Create some Records
  const item = await db.records.create('ITEM', {
    title: 'Nike Air Max 270',
    price: 150
  }, tx);

  const owner = await db.records.create('OWNER', {
    name: 'Jane Smith',
    email: 'janesmith@example.com',
  }, tx);

  // create Relationship
  await owner.attach(item, {
    type: 'OWN',
    direction: 'out',
  }, tx);

  // Simulate an error
  throw new Error('Simulated error')

  // Commit the Transaction if all operations succeed
  await tx.commit();
} catch (e) {
  // If any Records or Relationships creation failed, roll back the entire operation
  await tx.rollback();
}

Learn more in the docs

6. Properties: Lightweight Connectors That Unify Your Data

Minimal data overhead, maximum impact—RushDB’s Properties system enables developers to build best-in-class search experiences while unlocking deeper insights from their data.

Properties act as intelligent containers that links Records, connecting fields with the same name and type across different data entities. For example, if multiple Records - regardless of Label - share a color property with the value red, RushDB will automatically surface all relevant Records. It’s like querying across multiple SQL tables by a common field and value, but without the complexity.

This makes Properties a powerful tool for data discovery, search, and seamless cross-entity relationships.

Example

Python:

query = {
    "where": {
        "color": "red"
    }
}

records = db.records.find(query)

TypeScript:

const records = await db.records.find({
    where: {
        color: 'red'
    }
})

Moreover, with the Properties API, building advanced search experiences is straightforward. Developers can seamlessly query related Records across different entities without complex joins or manual indexing. Whether you're implementing faceted search, dynamic filtering, or personalized recommendations, RushDB ensures your data remains connected and instantly accessible.

Python:

# Property `name` [string]
db.properties.values(
  "0192397b-8579-7ce2-a899-01c59bad63f8"
)
# Response
{
  "values": [
    "Eleanor Whitaker",
    "Marcus Donovan",
    "Priya Kapoor",
    "Julian Alvarez"
  ],
  "type": "string"
}

# Property \`size\` [number]
db.properties.values(
  "019412c0-2051-71fe-bc9d-26117b52c119"
)
# Response
{
  "min": 5.5,
  "max": 12.5,
  "values": [5.5, 6, 6.5, 7, 7.5, 8, 8.5, ...],
  "type": "number"
}

TypeScript:

// Property `name` [string]
await db.properties.values(
  '0192397b-8579-7ce2-a899-01c59bad63f8'
)
// Response
{
  values: [
    'Eleanor Whitaker',
    'Marcus Donovan',
    'Priya Kapoor',
    'Julian Alvarez'
  ],
  type: 'string'
}

// Property \`size\` [number]
await db.properties.values(
  '019412c0-2051-71fe-bc9d-26117b52c119'
)
// Response
{
  min: 5.5,
  max: 12.5,
  values: [5.5, 6, 6.5, 7, 7.5, 8, 8.5, ...],
  type: 'number'
}

Learn more in the docs

7. A Universal API for the Entire Platform

RushDB is built with a query-centric design, ensuring that most endpoints follow a consistent request format. This unified approach enhances developer experience by minimizing the learning curve - master one request structure, and you can apply it across the entire platform.

At the core of RushDB are three key entities: Record, Property, and Label. All of them can be queried using the same SearchQuery, eliminating the need for backend data gymnastics. This means you can focus on building products without worrying about complex data handling - just query once and get exactly what you need, every time.

Python

# Same DTO to rule them all
query = {
    "where": {
        "$or": [{"stage": "seed"}, {stage: "roundA"}],
        "EMPLOYEE": {
                "salary": {
                "$gte": 500_000
            }
        }
    }
}

# Find Labels of Records that match the criteria
labels = db.labels.find(query)

# Find Records that match the criteria
records = db.properties.find(query)

# Find Properties of Records that match the criteria
properties = db.labels.find(query)

TypeScript:

// Same DTO to rule them all
const query = {
  where: {
    $or: [{ stage: 'seed' }, { stage: 'roundA' }],
    EMPLOYEE: {
      salary: {
        $gte: 500_000
      }
    }
  }
}

// Find Labels of Records that match the criteria
const labels = await db.labels.find(query)

// Find Records that match the criteria
const records = await db.records.find(query)

// Find Properties of Records that match the criteria
const properties = await db.properties.find(query)

8. Powerful Dashboard: Control, Explore, and Query with Ease

RushDB comes with a feature-rich Dashboard that gives you full control over your data, projects, and API access—all in an intuitive, developer-friendly UI. Whether you're a developer or a data-driven team, the dashboard makes exploring and managing your data effortless.

Key Features:

Intelligent Data Querying – A seamless UI that fetches value variations for each filter, enabling precise searches—even for non-developers. Find exactly what you need with sniper precision.
Graph View for Natural Exploration – Visualize relationships the way you think about data, not just how it’s stored. Navigate your graph intuitively, without writing queries.
Project-Based Isolation – Each project is fully self-contained, allowing you to manage multiple independent datasets effortlessly.
Instant Data Import – Upload JSON or JSONB directly from the UI—no coding required. The fastest way to get started and familiarize yourself with RushDB.
SearchQuery Preview – Build queries visually with UI filters and easily reuse the generated configuration in your applications.
More Features Coming Soon! – We're continuously improving the dashboard to make data management even more seamless.

records table view

records graph view

9. Effortless Integration with REST API & SDKs

RushDB offers a powerful, intuitive REST API that seamlessly integrates with your applications. The API is designed with developer productivity in mind, ensuring smooth interaction with your database using minimal code. Whether you're building a complex enterprise app or a lightweight microservice, the provided SDKs streamline operations, offering straightforward methods for creating, querying, and managing your graph data. The SDK-level experience allows developers to effortlessly connect to RushDB via popular programming languages, providing rich documentation and comprehensive examples to minimize friction during integration.

10. Flexible Deployment Options: Cloud or Self-Hosted

RushDB is available in both cloud and self-hosted setups, giving you full control over your infrastructure while ensuring scalability and reliability. With the cloud version, you can quickly deploy and scale your database without worrying about maintenance, offering a fully managed, secure environment. Alternatively, the self-hosted version allows you to run RushDB on your own hardware, giving you the flexibility to customize configurations, maintain complete data control, and integrate with your existing infrastructure.

Conclusion

RushDB empowers developers by combining the best of both worlds—zero-configuration graph databases with best-in-class developer experience. Whether you're working with a cloud or self-hosted setup, RushDB offers unmatched flexibility, scalability, and ease of use, making it the go-to solution for modern applications. With an intuitive REST API and seamless SDK integration, you can focus on building innovative products, leaving the complexities of database management to RushDB.