2016-11-08 16:41:38 +03:00
<!DOCTYPE html>
<!-- [if IE 8]><html class="no - js lt - ie9" lang="en" > <![endif] -->
<!-- [if gt IE 8]><! --> < html class = "no-js" lang = "en" > <!-- <![endif] -->
< head >
< meta charset = "utf-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< link rel = "shortcut icon" href = "../img/favicon.ico" >
2017-04-25 14:15:40 +03:00
< title > Getting Started - graphql-php< / title >
2016-11-08 16:41:38 +03:00
< link href = 'https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel = 'stylesheet' type = 'text/css' >
< link rel = "stylesheet" href = "../css/theme.css" type = "text/css" / >
< link rel = "stylesheet" href = "../css/theme_extra.css" type = "text/css" / >
2018-11-27 16:06:49 +03:00
< link rel = "stylesheet" href = "//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css" >
2016-11-08 16:41:38 +03:00
< script >
// Current page data
var mkdocs_page_name = "Getting Started";
var mkdocs_page_input_path = "getting-started.md";
2018-11-27 16:06:49 +03:00
var mkdocs_page_url = null;
2016-11-08 16:41:38 +03:00
< / script >
2018-11-27 16:06:49 +03:00
< script src = "../js/jquery-2.1.1.min.js" defer > < / script >
< script src = "../js/modernizr-2.8.3.min.js" defer > < / script >
< script src = "//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js" > < / script >
< script > hljs . initHighlightingOnLoad ( ) ; < / script >
2016-11-08 16:41:38 +03:00
< / head >
< body class = "wy-body-for-nav" role = "document" >
< div class = "wy-grid-for-nav" >
< nav data-toggle = "wy-nav-shift" class = "wy-nav-side stickynav" >
< div class = "wy-side-nav-search" >
< a href = ".." class = "icon icon-home" > graphql-php< / a >
< div role = "search" >
< form id = "rtd-search-form" class = "wy-form" action = "../search.html" method = "get" >
2018-11-27 16:06:49 +03:00
< input type = "text" name = "q" placeholder = "Search docs" title = "Type search term here" / >
2016-11-08 16:41:38 +03:00
< / form >
< / div >
< / div >
< div class = "wy-menu wy-menu-vertical" data-spy = "affix" role = "navigation" aria-label = "main navigation" >
2017-04-25 14:15:40 +03:00
< ul class = "current" >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1" >
< a class = "" href = ".." > About< / a >
< / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1 current" >
< a class = "current" href = "./" > Getting Started< / a >
2016-11-08 16:41:38 +03:00
< ul class = "subnav" >
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#prerequisites" > Prerequisites< / a > < / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#installation" > Installation< / a > < / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#upgrading" > Upgrading< / a > < / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#install-tools-optional" > Install Tools (optional)< / a > < / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#hello-world" > Hello World< / a > < / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l2" > < a href = "#blog-example" > Blog example< / a > < / li >
2016-11-08 16:41:38 +03:00
< / ul >
2017-04-25 14:15:40 +03:00
< / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1" >
2017-08-20 19:28:59 +03:00
< a class = "" href = "../complementary-tools/" > Complementary Tools< / a >
< / li >
< li class = "toctree-l1" >
< span class = "caption-text" > Type Definitions< / span >
2017-04-25 14:15:40 +03:00
< ul class = "subnav" >
< li class = "" >
< a class = "" href = "../type-system/" > Introduction< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/object-types/" > Object Types< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/scalar-types/" > Scalar Types< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/enum-types/" > Enumeration Types< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/lists-and-nonnulls/" > Lists and Non-Null< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/interfaces/" > Interfaces< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/unions/" > Unions< / a >
< / li >
< li class = "" >
2017-08-20 19:28:59 +03:00
< a class = "" href = "../type-system/input-types/" > Mutations and Input Types< / a >
2017-04-25 14:15:40 +03:00
< / li >
< li class = "" >
< a class = "" href = "../type-system/directives/" > Directives< / a >
< / li >
< li class = "" >
< a class = "" href = "../type-system/schema/" > Schema< / a >
< / li >
2017-08-20 19:28:59 +03:00
< li class = "" >
< a class = "" href = "../type-system/type-language/" > Using Type Language< / a >
< / li >
2017-04-25 14:15:40 +03:00
< / ul >
< / li >
2016-12-14 16:23:08 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1" >
< a class = "" href = "../executing-queries/" > Executing Queries< / a >
< / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1" >
< a class = "" href = "../data-fetching/" > Fetching Data< / a >
< / li >
2016-11-08 16:41:38 +03:00
2017-04-25 14:15:40 +03:00
< li class = "toctree-l1" >
< a class = "" href = "../error-handling/" > Handling Errors< / a >
< / li >
< li class = "toctree-l1" >
2017-08-20 19:28:59 +03:00
< a class = "" href = "../security/" > Security< / a >
< / li >
< li class = "toctree-l1" >
< a class = "" href = "../how-it-works/" > How it works< / a >
< / li >
< li class = "toctree-l1" >
< a class = "" href = "../reference/" > Class Reference< / a >
2017-04-25 14:15:40 +03:00
< / li >
2016-11-08 16:41:38 +03:00
< / ul >
< / div >
< / nav >
< section data-toggle = "wy-nav-shift" class = "wy-nav-content-wrap" >
< nav class = "wy-nav-top" role = "navigation" aria-label = "top navigation" >
< i data-toggle = "wy-nav-top" class = "fa fa-bars" > < / i >
< a href = ".." > graphql-php< / a >
< / nav >
< div class = "wy-nav-content" >
< div class = "rst-content" >
< div role = "navigation" aria-label = "breadcrumbs navigation" >
< ul class = "wy-breadcrumbs" >
< li > < a href = ".." > Docs< / a > » < / li >
< li > Getting Started< / li >
< li class = "wy-breadcrumbs-aside" >
< / li >
< / ul >
< hr / >
< / div >
< div role = "main" >
< div class = "section" >
< h1 id = "prerequisites" > Prerequisites< / h1 >
< p > This documentation assumes your familiarity with GraphQL concepts. If it is not the case -
2017-08-20 19:28:59 +03:00
first learn about GraphQL on < a href = "http://graphql.org/learn/" > the official website< / a > .< / p >
2016-11-08 16:41:38 +03:00
< h1 id = "installation" > Installation< / h1 >
2017-04-25 14:15:40 +03:00
< p > Using < a href = "https://getcomposer.org/doc/00-intro.md" > composer< / a > , simply run:< / p >
< pre > < code class = "sh" > composer require webonyx/graphql-php
2016-11-08 16:41:38 +03:00
< / code > < / pre >
2016-11-25 14:10:10 +03:00
< h1 id = "upgrading" > Upgrading< / h1 >
< p > We try to keep library releases backwards compatible. But when breaking changes are inevitable
they are explained in < a href = "https://github.com/webonyx/graphql-php/blob/master/UPGRADE.md" > upgrade instructions< / a > .< / p >
2016-11-08 16:41:38 +03:00
< h1 id = "install-tools-optional" > Install Tools (optional)< / h1 >
< p > While it is possible to communicate with GraphQL API using regular HTTP tools it is way
more convenient for humans to use < a href = "https://github.com/graphql/graphiql" > GraphiQL< / a > - an in-browser
2017-08-20 19:28:59 +03:00
IDE for exploring GraphQL APIs.< / p >
2016-11-08 16:41:38 +03:00
< p > It provides syntax-highlighting, auto-completion and auto-generated documentation for
GraphQL API.< / p >
< p > The easiest way to use it is to install one of the existing Google Chrome extensions:< / p >
< ul >
< li > < a href = "https://chrome.google.com/webstore/detail/chromeiql/fkkiamalmpiidkljmicmjfbieiclmeij" > ChromeiQL< / a > < / li >
< li > < a href = "https://chrome.google.com/webstore/detail/graphiql-feen/mcbfdonlkfpbfdpimkjilhdneikhfklp" > GraphiQL Feen< / a > < / li >
< / ul >
2017-08-20 19:28:59 +03:00
< p > Alternatively, you can follow instructions on < a href = "https://github.com/graphql/graphiql" > the GraphiQL< / a >
2016-11-08 16:41:38 +03:00
page and install it locally.< / p >
< h1 id = "hello-world" > Hello World< / h1 >
2017-08-20 19:28:59 +03:00
< p > Let's create a type system that will be capable to process following simple query:< / p >
2016-11-25 14:10:10 +03:00
< pre > < code > query {
2016-11-08 16:41:38 +03:00
echo(message: " Hello World" )
}
< / code > < / pre >
< p > To do so we need an object type with field < code > echo< / code > :< / p >
< pre > < code class = "php" > < ?php
use GraphQL\Type\Definition\ObjectType;
use GraphQL\Type\Definition\Type;
$queryType = new ObjectType([
'name' => 'Query',
'fields' => [
'echo' => [
'type' => Type::string(),
'args' => [
'message' => Type::nonNull(Type::string()),
],
'resolve' => function ($root, $args) {
return $root['prefix'] . $args['message'];
}
],
],
]);
2017-08-20 19:28:59 +03:00
2016-11-08 16:41:38 +03:00
< / code > < / pre >
< p > (Note: type definition can be expressed in < a href = "../type-system/#type-definition-styles" > different styles< / a > ,
2016-11-25 14:10:10 +03:00
but this example uses < strong > inline< / strong > style for simplicity)< / p >
2017-08-20 19:28:59 +03:00
< p > The interesting piece here is < strong > resolve< / strong > option of field definition. It is responsible for returning
a value of our field. Values of < strong > scalar< / strong > fields will be directly included in response while values of
< strong > composite< / strong > fields (objects, interfaces, unions) will be passed down to nested field resolvers
2016-11-08 16:41:38 +03:00
(not in this example though).< / p >
2017-08-20 19:28:59 +03:00
< p > Now when our type is ready, let's create GraphQL endpoint file for it < strong > graphql.php< / strong > :< / p >
2016-11-08 16:41:38 +03:00
< pre > < code class = "php" > < ?php
use GraphQL\GraphQL;
2017-08-20 19:28:59 +03:00
use GraphQL\Type\Schema;
2016-11-08 16:41:38 +03:00
$schema = new Schema([
'query' => $queryType
]);
$rawInput = file_get_contents('php://input');
2017-04-25 14:15:40 +03:00
$input = json_decode($rawInput, true);
$query = $input['query'];
$variableValues = isset($input['variables']) ? $input['variables'] : null;
2016-11-08 16:41:38 +03:00
try {
$rootValue = ['prefix' => 'You said: '];
2017-08-20 19:28:59 +03:00
$result = GraphQL::executeQuery($schema, $query, $rootValue, null, $variableValues);
$output = $result-> toArray();
2016-11-08 16:41:38 +03:00
} catch (\Exception $e) {
2017-08-20 19:28:59 +03:00
$output = [
'errors' => [
[
'message' => $e-> getMessage()
]
2016-11-08 16:41:38 +03:00
]
];
}
2017-08-20 19:28:59 +03:00
header('Content-Type: application/json');
echo json_encode($output);
2016-11-08 16:41:38 +03:00
< / code > < / pre >
2017-08-20 19:28:59 +03:00
< p > Our example is finished. Try it by running:< / p >
2018-07-07 20:31:16 +03:00
< pre > < code class = "sh" > php -S localhost:8080 graphql.php
2017-08-20 19:28:59 +03:00
curl http://localhost:8080 -d '{" query" : " query { echo(message: \" Hello World\" ) }" }'
2016-11-08 16:41:38 +03:00
< / code > < / pre >
2017-08-20 19:28:59 +03:00
< p > Check out the full < a href = "https://github.com/webonyx/graphql-php/blob/master/examples/00-hello-world" > source code< / a > of this example
which also includes simple mutation.< / p >
2016-11-08 16:41:38 +03:00
< p > Obviously hello world only scratches the surface of what is possible.
So check out next example, which is closer to real-world apps.
Or keep reading about < a href = "../type-system/" > schema definition< / a > .< / p >
< h1 id = "blog-example" > Blog example< / h1 >
2017-08-20 19:28:59 +03:00
< p > It is often easier to start with a full-featured example and then get back to documentation
2016-11-08 16:41:38 +03:00
for your own work. < / p >
< p > Check out < a href = "https://github.com/webonyx/graphql-php/tree/master/examples/01-blog" > Blog example of GraphQL API< / a > .
It is quite close to real-world GraphQL hierarchies. Follow instructions and try it yourself in ~10 minutes.< / p >
< / div >
< / div >
< footer >
< div class = "rst-footer-buttons" role = "navigation" aria-label = "footer navigation" >
2017-08-20 19:28:59 +03:00
< a href = "../complementary-tools/" class = "btn btn-neutral float-right" title = "Complementary Tools" > Next < span class = "icon icon-circle-arrow-right" > < / span > < / a >
2016-11-08 16:41:38 +03:00
< a href = ".." class = "btn btn-neutral" title = "About" > < span class = "icon icon-circle-arrow-left" > < / span > Previous< / a >
< / div >
< hr / >
< div role = "contentinfo" >
<!-- Copyright etc -->
< / div >
Built with < a href = "http://www.mkdocs.org" > MkDocs< / a > using a < a href = "https://github.com/snide/sphinx_rtd_theme" > theme< / a > provided by < a href = "https://readthedocs.org" > Read the Docs< / a > .
< / footer >
2018-04-20 12:39:52 +03:00
2016-11-08 16:41:38 +03:00
< / div >
< / div >
< / section >
2018-04-20 12:39:52 +03:00
2016-11-08 16:41:38 +03:00
< / div >
2017-04-25 14:15:40 +03:00
< div class = "rst-versions" role = "note" style = "cursor: pointer" >
2016-11-08 16:41:38 +03:00
< span class = "rst-current-version" data-toggle = "rst-current-version" >
< span > < a href = ".." style = "color: #fcfcfc;" > « Previous< / a > < / span >
2017-08-20 19:28:59 +03:00
< span style = "margin-left: 15px" > < a href = "../complementary-tools/" style = "color: #fcfcfc" > Next » < / a > < / span >
2016-11-08 16:41:38 +03:00
< / span >
< / div >
2018-04-20 12:39:52 +03:00
< script > var base _url = '..' ; < / script >
2018-11-27 16:06:49 +03:00
< script src = "../js/theme.js" defer > < / script >
< script src = "../search/main.js" defer > < / script >
2016-11-08 16:41:38 +03:00
< / body >
< / html >
