TaffyDB – JavaScript database for the browser-JS Tutorial-php.cn

TaffyDB – 适用于浏览器的 JavaScript 数据库

TaffyDB is a lightweight and powerful in-memory database that can be used in browsers and server-side applications. It is open source and free to use. In this tutorial, we will go through a few examples to show how to use TaffyDB to store some data, perform some queries on the data, and perform important operations on the data.

Let’s start with a simple example

Let's start with a very basic example where we will create some data and then try to print that data on the browser.

Our first step is to have TaffyDB. For this we have different options. The most basic method is to use a URL that contains a minified version of the "taffydb.js" file.

The code for "taffydb.js" can be found at this link. I suggest you open this link, then copy and paste the code into a file called "taffy.js". Otherwise, you can Just use their CDN.

Now that the dependencies are taken care of, let's focus on the "index.html" file, where we will write the core logic, within the <script> tags, of course. Consider the HTML code shown below. </script>

Example

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TaffyDB</title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/taffydb/2.7.3/taffy-min.js"></script>
    <script>
        let countries = TAFFY([{
            name: "India",
            state: "Uttar Pradesh",
            capital: "New Delhi",
        }, {
            name: "USA",
            state: "California",
            capital: "Washington DC",
        }, {
            name: "Germany",
            state: "Berlin",
            capital: "Berlin",
        }]);
        let countriesNames = [];
        countries().each(function(r) {
            countriesNames.push(r.name);
        });
        document.write(countriesNames);
    </script>
</head>
<body>
</body>
</html>

Copy after login

If you run the above code in your browser, you should see the following output.

In the above code, we first imported the "taffy.js" file and then created a