Skip to content

Instantly share code, notes, and snippets.

@AntoinePlu
Last active January 21, 2019 10:28
Show Gist options
  • Save AntoinePlu/1afa6a446559f6a262bc6c03c3ed919d to your computer and use it in GitHub Desktop.
Save AntoinePlu/1afa6a446559f6a262bc6c03c3ed919d to your computer and use it in GitHub Desktop.
import React, { Component } from 'react';
import styled from 'styled-components'
import Tabletop from 'tabletop';
class Explore extends Component {
constructor() {
super()
this.state = {
data: []
}
}
componentDidMount() {
Tabletop.init({
key: '1x-hA3Bd5yXZ2ciSImRUZBd28Uxn7-9cZrFfsdVLpB64',
callback: googleData => {
this.setState({
data: googleData
})
},
simpleSheet: true,
orderby: 'Category'
})
}
render() {
const { data } = this.state
return (
<SectionContent>
{
data.map(obj => {
return (
<Article key={obj.title}>
<img alt={obj.imgAlt} src={obj.imgUrl} />
<Tag>{obj.category}</Tag>
<Title>{obj.title}</Title>
<Link href={obj.linkUrl}>Read</Link>
</Article>
)
})
}
</SectionContent>
);
}
}
export default Explore
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment