What is Xata: A Review of Serverless Database Features

Xata.io key features

Xata is the ultimate solution for Jamstack developers looking to quickly set up their database schema and streamline their development workflow. With Xata, you can enjoy the following key features:

What makes Xata.io different?

A website search feature is crucial for providing a great user experience. With Jamstack, you can create high-performance websites, but to truly maximize its benefits, you need an effective website search feature.

Developers face many challenges when creating website search features. Leveraging multiple tools is necessary to ensure excellent user experience, but this comes at the cost of increased overhead and effort. Setting up separate tools such as Algolia or database systems like MongoDB, PostgreSQL, or MySQL is time-consuming and complex. Traditional CMS tools lack robust analytical and search engine capabilities.

In contrast to other solutions, Xata.io offers a solution that combines all the benefits you need. You can easily set up an effective website search feature and access data with just a few clicks, cutting back on additional effort and time.

Let’s dive deep into Xata.io

With just a few simple steps, let's create a compact database of Medium articles on Xata and develop an API using Vercel Edge Functions to search through these articles. This will showcase how quickly and efficiently you can harness the power of Xata.io to optimize your blog and gain access to your articles in mere minutes.

1. Autogenerate schema based on CSV file

Let’s prepare a database of Medium articles from the following Kaggle dataset. In order to easily import data from a CSV file to the Xata.io database, you need to simply install the CLI tool and run the following command:

npm install -g @xata.io/cli@latest

After successful installation, you need to log in via CLI in order to connect to your Xata.io database on further steps:

xata auth login

Next, you need to run the following command in the folder of your CSV file as follows:

xata import csv file.csv --create --table my_first_table

Remember to replace my_first_table with your table name.

Finally, you can see that our database is populated with the data of CSV files. Moreover, we see that Xata automatically generated a schema for our table.

In order to check the autogenerated schema we can run the following command: xata schema dump, which shows us the JSON definition of our schema as follows.

2. Initialize our Xata.io application and set up Xata SDK and configs

Now, since we successfully imported our articles via CLI, we can proceed and create our search API endpoint in Vercel Edge to access our articles via the web.

We will skip the part of scaffolding the Next.js application and Edge Function. You can follow up on this guide.

In order to make requests to our Xata table we need to install the SDK and set up Xata environment variables.

Surprisingly this is super easy to do with a single terminal command in our root folder as follows:

xata init --db https://arenhovsepyan-s-workspace-nfl160.us-east-1.xata.sh/db/news-articles

You can find this command under the Search Engine section in the Xata dashboard.

he above command generates the following files, which we will cover shortly:

- src/xata.ts
- .xatarc
- .env

3. Create an endpoint to search our articles

Since we already set up our Xata SDK, we can proceed and finalize our blog search API.

Here is the full code that we need to put under /pages/api/search.ts for our /api/search endpoint In Next.js app with the following content.

import type { NextRequest } from "next/server";
import { getXataClient } from "@/xata";

const xata = getXataClient();

export const config = {
  runtime: "edge",
};

export default async function handler(req: NextRequest) {
  const query = req.nextUrl.searchParams.get("exp") || '';

  const records = await xata.search.all(query, {
    tables: [
      {
        table: "articles",
        target: [
          { column: "text", weight: 4 },
          { column: "title", weight: 3 },
          { column: "author", weight: 2 },
        ],
      },
    ],
    fuzziness: 2,
    prefix: "phrase",
  });

  return new Response(JSON.stringify(records, null, 2), {
    status: 200,
    headers: {
      "content-type": "application/json",
    },
  });
}

In the above code, we are using exp query search param as an expression and passing it to xata.search.all method that takes two parameters

In the configuration object, we can specify the following properties:

4. Testing our Xata table search

Let’s take a look at what we’ve built together with the help of Xata.io. You can run npm run dev, and our Next.js application should listen under localhost:3000

Let’s search all articles that contain the term architect, and we see JSON responses of articles that contain the word architect.

Now let’s search for Python articles. For this, we need to make a request to the following URL:

Final Thoughts

We can see how quickly we can set up our CMS with the help of Xata.io. It has a neat JavaScript SDK that allows us to quickly prototype our application and forget about the overhead of software maintenance of our database and search engine.

By default, it handles search indexing and provides great tools to cover our JamStack website's needs for user search. Simply with multiple lines of code, we utilized a fully-fledged online search for our mini-blog.

Xata is a must-have tool for JamStack developers looking for a fast and easy way to set up their database schema and search engine. It offers a JSON-like schema definition, a relational data model with a strict schema, support for JSON-like objects, and various column types.