Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://docs.amplify.aws/gen1/react/build-a-backend/more-features/datastore/example-application/ below:

Website Navigation

• Skip to main content

Example application - React - AWS Amplify Gen 1 Documentation

import React, { useEffect } from "react";
import logo from "./logo.svg";
import { Amplify } from 'aws-amplify'
import { DataStore, Predicates } from "aws-amplify/datastore";
import { Post, PostStatus } from "./models";
// Use next two lines only if syncing with the cloud
import amplifyconfig from "./amplifyconfiguration";
Amplify.configure(amplifyconfig);
async function onCreate() {
      title: `New title ${Date.now()}`,
      rating: Math.floor(Math.random() * (8 - 1) + 1),
      status: PostStatus.ACTIVE,
async function onDeleteAll() {
  await DataStore.delete(Post, Predicates.ALL);
async function onQuery() {
  const posts = await DataStore.query(Post, (c) => c.rating.gt(4));
    const subscription = DataStore.observe(Post).subscribe((msg) => {
      console.log(msg.model, msg.opType, msg.element);
    return () => subscription.unsubscribe();
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
          <input type="button" value="NEW" onClick={onCreate} />
          <input type="button" value="DELETE ALL" onClick={onDeleteAll} />
          <input type="button" value="QUERY rating > 4" onClick={onQuery} />
          Edit <code>src/App.js</code> and save to reload.
          href="https://reactjs.org"
          rel="noopener noreferrer"

import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataStore, Predicates } from "aws-amplify/datastore";
import { Post, PostStatus } from "./models";
      <button type="button" (click)="onCreate()">NEW</button>
      <button type="button" (click)="onDeleteAll()">DELETE ALL</button>
      <button type="button" (click)="onQuery()">QUERY rating > 4</button>
export class AppComponent implements OnInit, OnDestroy {
    this.subscription = DataStore.observe<Post>(Post).subscribe((msg) => {
      console.log(msg.model, msg.opType, msg.element);
    if (!this.subscription) return;
    this.subscription.unsubscribe();
  public async loadPosts() {
    let posts = await DataStore.query(Post, (c) => c.rating.gt(4));
        title: `New title ${Date.now()}`,
        rating: Math.floor(Math.random() * (8 - 1) + 1),
        status: PostStatus.ACTIVE,
    DataStore.delete(Post, Predicates.ALL);

      <button type="button" @click="onCreate" >NEW</button>
      <button type="button" @click="onDeleteAll" >DELETE ALL</button>
      <button type="button" @click="onQuery" >QUERY rating > 4</button>
import { DataStore, Predicates } from "aws-amplify/datastore";
import { Post, PostStatus } from "./models";
    this.subscription = DataStore.observe(Post).subscribe(msg => {
      console.log(msg.model, msg.opType, msg.element);
    if (!this.subscription) return;
    this.subscription.unsubscribe();
      let posts = await DataStore.query(Post, (c) => c.rating.gt(4));
          title: `New title ${Date.now()}`,
          rating: Math.floor(Math.random() * (8 - 1) + 1),
          status: PostStatus.ACTIVE,
      DataStore.delete(Post, Predicates.ALL);

For the complete API documentation for DataStore, visit our API Reference

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4