JSFiddle - React, Tailwind, and code Playground

by Zatcepin

HTML

<!-- Include the library in the page -->
<script src="https://unpkg.com/[email protected]"></script>

<!-- App -->
<div id="app">
  <div>
    <div id="result" class="loading">Loading...     </div>
  </div>
</div>

CSS

body {
  font-family: sans-serif;
  margin: 0;
  background: #f0f0f0;
}

#app {
  padding: 24px;
  max-width: 400px;
  margin: auto;
}

h1 {
  text-align: center;
  font-weight: normal;
  font-size: 18px;
}

article {
  background: white;
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 2px;
}

.loading {
  text-align: center;
  color: #777;
}

.title {
  text-transform: uppercase;
}

.author {
  color: #777;
}

JavaScript

const client = new Apollo.lib.ApolloClient({
  networkInterface: Apollo.lib.createNetworkInterface({
    uri: 'https://api.santiment.net/graphql',
    transportBatching: true,
  }),
  connectToDevTools: true,
})

const QUERY = Apollo.gql`
 query trendingWords(source: ALL, size: 10, hour:8, from: "2019-02-19T07:19:39.467Z", to: "2019-02-26T07:19:39.467Z") 
  {
    topWords {
      word
    }
    
  }
`

const QUERY2 = Apollo.gql`
 query allProjects {
  ticker
}
}
`



const pm1 = client.query({ query: QUERY }).then(res => console.log(res))
//const pm2 = client.query({ query: QUERY2 })

//Promise.all([pm1, pm2]).then(function(values) {
//  console.log(values)
//});