stefanoverna

**Jeff Escalante**

# Dato & Contentful

There are many areas in which I'd consider Dato to be much stronger of a CMS than
contentful, and one in which I'd consider the opposite to be the case. I will try to be as
balanced as possible with this overview, as I am not employed by dato or anything ‐ my
goal is to ensure that my clients and developers get the best possible experience working
with a CMS.

stefanoverna

How to preview your translations in DatoCMS interface

1. Open a DatoCMS administrative area of your own (ie. https://my-site.admin.datocms.com)

2. Open the Browser Inspector and in the console write down the following:

   localStorage.setItem('customMessagesUrl', 'https://raw.githubusercontent.com/datocms/translations/master/it.json')
   

   You obviously need to change the URL to your own JSON file.

3. Refresh the page

stefanoverna

sub vcl_hash {
  #FASTLY hash

  log {"syslog url"} req.url " host " req.http.host " authorization " req.http.Authorization " request " req.request " postbody " req.postbody " hash " req.hash

  return(hash);
}

stefanoverna

sub vcl_hash {
  #FASTLY hash

  set req.hash += req.url;
  set req.hash += req.http.host;
  set req.hash += req.http.Authorization;

  if (req.request == "POST" && req.postbody) {
    set req.hash += req.postbody;
  }

stefanoverna

for ((i=1;i<=100;i++)); do curl 'https://datocms-gql.global.ssl.fastly.net/' -H 'Authorization: faeb9172e232a75339242faafb9e56de8c8f13b735f7090964' -H 'Content-Type: application/json' -H 'Accept:
application/json' --data-binary '{ "query": "{ faq { question } }" }' -D - -s | grep -e X-Cache -e X-Served-By; done

X-Served-By: cache-lcy19247-LCY, cache-fra19145-FRA
X-Cache: MISS, HIT
X-Cache-Hits: 0, 1
X-Served-By: cache-lcy19226-LCY, cache-fra19133-FRA
X-Cache: MISS, MISS
X-Cache-Hits: 0, 0
X-Served-By: cache-lcy19228-LCY, cache-fra19137-FRA

stefanoverna

import React from 'react'

const IndexPage = ({ data }) => (
  <div className="Catalogue">
    {
      data.site.siteMetadata.products.map(product => (
        <div className="Catalogue__item" key={product.slug}>
          <a href="#" className="Product">
            <div className="Product__image">
              <img src={product.image} />

stefanoverna

module.exports = {
  siteMetadata: {
    siteName: 'My Shop',
    products: [
      {
        name: 'Bloom',
        image: 'https://www.pacificandco.com/wp-content/uploads/2014/12/pacificandco-calcetines-socks-original-creative-women-BLOOM-perfil-1.jpg',
        price: 14.95,
      },
      {

stefanoverna

const { SiteClient } = require('datocms-client');
const client = new SiteClient('YOUR-API-TOKEN');
const config = require('./gatsby-config');

config.siteMetadata.products.reduce((chain, product) => (
  chain
    .then(() => client.uploadImage(product.image))
    .then((image) => client.items.create({
      name: product.name,
      image: image,

stefanoverna

module.exports = {
  siteMetadata: {
    siteName: 'My Shop',
  },
  plugins: [
    'gatsby-plugin-sass',
    'gatsby-plugin-react-helmet',
    {
      resolve: `gatsby-source-datocms`,
      options: { apiToken: `YOUR_READONLY_API_TOKEN` },

stefanoverna

import React from 'react'

const IndexPage = ({ data }) => (
  <div className="Catalogue">
    {
      data.products.edges.map(({ node: product }) => (
        <div className="Catalogue__item" key={product.id}>
          <a href="#" className="Product">
            <div className="Product__image">
              <img src={product.image.url} />