This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const GET_DOG_PHOTO = gql` | |
query Dog($breed: String!) { | |
dog(breed: $breed) { | |
id | |
displayImage | |
} | |
} | |
`; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<style> | |
.circle { | |
background-color: red; | |
border-radius: 999px; | |
height: 50px; | |
width: 50px; | |
} | |
</style> | |
<div class="circle"></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function Books({ onBookSelected }) { | |
const { loading, error, data } = useQuery(GET_BOOKS); | |
if (loading) return 'Loading...'; | |
if (error) return `Error! ${error.message}`; | |
return ( | |
<select name="book" onChange={onBookSelected}> | |
{data.books.map(book => ( | |
<option key={book.id} value={book.title}> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { gql, useQuery } from '@apollo/client'; | |
const GET_BOOKS = gql` | |
query GetBooks { | |
books { | |
id | |
title | |
} | |
} | |
`; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Example1.astro - Static HTML is a valid Astro component! --> | |
<div class="example-1"> | |
<h1>Hello world!</h1> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"errors":[ | |
{ | |
"message":"Cannot query field \"__typenam\" on type \"Query\".", | |
"locations":[ | |
{ | |
"line":1, | |
"column":2 | |
} | |
], |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# prerequisite: check that Node.js is 12.20.0+, 14.13.1+, or 16+ | |
node --version | |
# Make a new project directory, and navigate directly into it | |
mkdir my-astro-project && cd $_ | |
# prepare for liftoff... | |
npm init astro | |
# install dependencies |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"errors": [ | |
{ | |
"message": "Name for character with ID 1002 could not be fetched.", | |
"locations": [ { "line": 6, "column": 7 } ], | |
"path": [ "hero", "heroFriends", 1, "name" ], | |
} | |
] | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"errors": [ | |
{ | |
"extensions": { | |
"path": "$.variableValues", | |
"code": "validation-failed" | |
}, | |
"message": "unexpected variables in variableValues: products" | |
} | |
] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"data": [{ id: 1, name: "Praveen"}], | |
"errors": [] | |
} |