Fullstack GraphQL Book Club - Chapter 1

01:50 - Hi everyone. 01:51 Welcome to first edition of the Fullstack GraphQL Book Club. 02:00 Today, we are doing something a little bit different 02:04 on the Neo4j stream. 02:06 Instead of building an application 02:10 We're going to be reviewing the first chapter 02:15 of the Fullstack GraphQL Applications with GRANDstack book. 02:22 Hopefully everyone did their homework, 02:25 if not, no worries. 02:27 So the plan for today is to take a look at chapter one 02:32 of this book and then sort of work through the exercises 02:38 at the end. 02:39 And we'll continue that and go through 02:43 each chapter in the book. 02:46 If you have any questions or thoughts as we're going along, 02:49 feel free to drop those in the chat. 02:55 Let's try to make this as interactive as we can. 03:00 So first off, what is this book that we're talking about, 03:05 and how do we get it? 03:07 Well I've been working on writing this book, 03:11 "Fullstack GraphQL Applications with GRANDstack" 03:15 for a while now. 03:16 It is in early release 03:22 from the publishers, so grandstack.io/book. 03:28 So it's an early release from Manning. 03:31 There's currently five out of nine chapters out 03:34 two, more will becoming very, very soon I think. 03:40 But, Neo4j has sponsored 03:48 a three chapter excerpt of this book. 03:50 So, if you go to this URL, which I'll drop in the chat. 03:56 So bit.ly/fullstack-graphql-ebook. 04:04 This will take you to a page where you can download 04:08 three chapter excerpt e-book 04:11 sponsored by Neo4j for free. 04:16 And this is the version of the book 04:19 that we'll be working through. 04:20 So this excerpt, this includes chapters one, three and four. 04:25 So, that's what we'll be doing on the book club. 04:27 So, the idea is download this three chapter excerpt, 04:32 and then we can work through these together. 04:36 So, that's what I have on the left here. 04:38 This is the PDF of this three chapter excerpt 04:43 that anyone can download for free. 04:48 So again, if you have any questions or thoughts, 04:53 drop those in the chat, otherwise we will just jump into it. 04:59 So, a little high level sort of overview I guess, 05:05 of what this book is about and who's the target audience. 05:10 So, I've spent the last little while working 05:15 with integrations with Neo4j. 05:19 So, how can we use Neo4j with other technologies? 05:23 And one of those technologies that we've been using 05:28 with Neo4j is GraphQL. 05:31 If you've followed any of the streams 05:34 that I've done previously, we've built a couple 05:36 of applications using GraphQL. 05:39 The previous one was a travel guide using Gatsby 05:44 and some of the routing functionality in Neo4j 05:50 that is here. 05:55 I'll drop a link to in the chat. 05:59 It's called Central Perk, 'cause this is using 06:01 a open street map data set in Neo4j 06:04 to show points of interest and routing in Central Perk. 06:10 So, we built this using Neo4j, GraphQL and Gatsby. 06:14 And then previously we built a real estate 06:18 search application that we call Willow. 06:23 So searching for houses 06:27 and looking at some statistics and analytics 06:32 of the housing market. 06:35 That one is it's available on GitHub as well I'll link that. 06:40 And all of the recordings of the sessions are here. 06:45 So anyway, so that's one of the tools 06:49 that we've been looking at that we can use 06:52 with Neo4j that helps us build applications using Neo4j. 06:58 So, Neo4j is this very powerful graph database. 07:01 And we want to be able to expose those features, 07:04 in our application. 07:05 There's a really nice GraphQL integration for Neo4j. 07:10 And that makes it easier for us to expose 07:14 the awesome functionality of Neo4j and graph databases 07:17 in our applications using GraphQL. 07:20 So that's really, I think the motivation 07:25 for this book that I've been working on. 07:29 I think the target audience for this book is really myself 07:35 maybe several years ago 07:38 in my career when I was starting out as a web developer 07:45 and I worked at a Startup. 07:46 And essentially 07:48 we had to build a web application around this core product. 07:55 This was 07:57 a FinTech startups. 07:59 This was like some financial trading application 08:03 and the core technology of that that financial algorithm 08:08 was there, but we needed to expose it 08:10 through a web application. 08:11 And, if I had known about GraphQL and GRANDstack 08:19 was if it had existed at that time, 08:22 these are the tools that I would have wanted 08:24 that would have made my life as a Fullstack developer 08:28 a lot easier. 08:29 So I guess that's really who I wrote this book for, 08:32 is looking back. 08:34 Okay, you want to build a Fullstack application that 08:39 is maybe a bit data intensive. 08:41 Maybe the data model of your application is a bit complex. 08:45 Maybe you want to do some data intensive operations 08:49 in your application. 08:50 Maybe you want to add recommendations, personalization 08:54 as part of that. 08:57 What modern tools do you want to use to build that? 09:01 So anyway, so that that's sort of the audience 09:05 and the motivation. 09:11 And if we jump into it here, so these are the three chapters 09:17 that are covered in the book. 09:22 So what's the GRANDstack? 09:24 In chapter one, which is what we're gonna talk about today. 09:26 So just an overview of the components, GraphQL, 09:29 React, Apollo, and Neo4j Database. 09:32 And then chapter three, graphs in the database, 09:36 which is, a deep dive into Neo4j and the different 09:41 Neo4j tooling that we'll use talking a bit 09:44 about data modeling with Neo4j. 09:48 And then, Cypher, query language for Neo4j 09:52 and then also looking at how do we use the Client drivers 09:55 for Neo4j. 09:56 This is important. 09:57 How do we build applications that talk to Neo4j, 10:01 in this case, we'll look at JavaScript. 10:03 And then chapter four how do we build GraphQL API's 10:08 backed by Neo4j. 10:09 So, we'll take a look at the Neo4j, GraphQL integration 10:13 in that chapter. 10:15 And so that is the three chapters included in the excerpts. 10:19 That's what we'll be covering in this order. 10:21 So, we'll skip chapter two. 10:22 Chapter two is a deeper dive on GraphQL. 10:27 So, I think we can kind of supplement some of that. 10:31 I think that that should be okay. 10:33 But anyway, so that's the goal for today, 10:35 is to review chapter one. 10:38 So the different components of GRANDstack, 10:41 talking about how they fit together 10:42 and then work through the exercises. 10:47 I think this forward says exactly what I was saying before 10:50 is sort of who is the target audience? 10:53 Well, it's sort of me as as a web developer, 10:58 building an application. 11:01 Question from the chat was the company using Neo4j 11:04 as the main database? 11:07 Yeah, so this is, so the example that I gave was 11:11 when I worked at a FinTech Startup several years ago 11:17 and I needed to build the initial web application 11:21 and we're looking at evaluating technologies 11:24 and figuring out what that stack look like. 11:27 And so the question is what's that company using Neo4j 11:29 as the main database? 11:31 No, it was not. 11:37 I was trying to introduce Neo4j. 11:39 This was many years before I worked at Neo4j. 11:44 I was, so the startup was a FinTech that was looking 11:48 at options, 11:51 pricing, and options trading strategies. 11:55 And so most of the operations that we did 11:59 were 12:02 in memory sort of 12:05 financial algorithms. 12:08 So looking at volatility curves for financial instruments. 12:13 So most of what we did was sort of in memory. 12:18 It was a large Java application for connecting 12:22 to some of those financial data feeds. 12:26 I did build a options trading proof of concept 12:32 or options pricing, proof of concept using Neo4j 12:36 which we did not end up actually using, 12:39 but it was a fun proof of concept, 12:41 I should take that out somewhere. 12:48 So, starting off here at chapter one, 12:53 what is the GRANDstack? 12:56 Well, the GRANDstack is GraphQL, React, Apollo 13:01 and Neo4j Database. 13:04 You can of course use these technologies independently. 13:09 You can substitute other, front end frameworks, 13:14 other API layers, and so on. 13:17 But I think there's something really special 13:19 about this combination of technology's. 13:24 I think this symbiotic relationship really 13:27 between GraphQL and Graph Databases like Neo4j 13:32 that we'll talk a bit about. 13:36 GraphQL I think is a game changer 13:38 for how we think about interacting with APIs. 13:44 React is a great front end UI framework, 13:50 and combined with Apollo, we have lots of, 13:56 great developer experience tooling for working with GraphQL, 14:00 both on the front end and on the backend as well. 14:04 So I think there's something really special 14:06 about this combination of technologies. 14:12 Question from the chat, curious how to do user auth 14:15 in GRANDstack, would be nice to have an example 14:18 other than using auth0. 14:20 Yeah, that is definitely something that we'll get into 14:25 or say something that, that the book gets into. 14:27 There's a chapter in the book focused specifically 14:30 on authorization. 14:34 So, how do we create users in the database? 14:38 How do we protect resources in the API? 14:42 So, that's definitely something that we need 14:44 in any real world application and definitely 14:48 something the book dives into. 14:50 I think that's in chapter seven I think. 14:57 Let's take a look. 15:01 Yeah, so chapter seven, adding authorization, 15:03 which is not in the early release yet. 15:08 I have written it though. 15:10 It's just currently being edited, so. 15:12 Yeah, it's something we can dive into. 15:19 Another question, 15:20 do you plan to include view as an option 15:23 for the GRANDstack starter? 15:25 Yeah, that's a great question. 15:28 So the GRANDstack starter project, let's just take 15:31 a look at that. 15:36 So the GRANDstack starter, 15:41 basically, 15:42 we just run this command npx create-grandstack-app. 15:48 And this will provision a GRANDstack application for us 15:54 including both the API layer and the front end. 15:59 And then we have our choice 16:01 of front end implementation either. 16:04 Currently we have React, React TypeScript, 16:09 Flutter, and Angular, I think, are the implementations. 16:14 And your question is, are we going to do view? 16:19 And yes. 16:21 Someone has written a view version of this. 16:24 I think we just need to merge the pull request 16:29 and get that updated into the CLI. 16:32 Yeah, so my colleague, Adam has written a view example. 16:38 So if you dig into that, it's in there now and on his fork 16:41 if you wanna play around with it, but we'll definitely 16:42 be including that in the starter soon. 16:51 Another question from the chat is GRANDstack scalable? 16:56 Was it just a starter framework, like a single page app? 17:01 Yeah, so scalable, 17:03 there are different dimensions of scalability, right? 17:12 I guess I would ask it depends on what kind of way 17:16 you're thinking about scalable. 17:20 If you were thinking of GRANDstack as 17:26 scaling in the sense of addressing lots 17:29 of different use cases and, is there say like, 17:36 like a generator for generating components 17:39 and things like that within the framework. 17:45 Fundamentally it's a GRANDstack is a collection 17:50 of technologies and a way of building applications, right? 17:54 There's tooling that makes it easier 17:57 to use these application of these technologies together, 18:01 and things like the create-grandstack-app, 18:04 CLI that helps us bundle these together, 18:10 If we're thinking of scalable in the sense of, 18:14 the amount of data that I can work with and the amounts 18:17 of maybe concurrent users that can 18:21 be carrying my application. 18:24 Neo4j is an extremely scalable database. 18:27 We can deploy clusters of Neo4j. 18:30 So, multiple instances of Neo4j that allow us to scale out 18:35 the throughput of our application. 18:40 For the API layer, is that scalable? 18:43 You know, typically when we're starting out, 18:45 we look at running a Apollo Server 18:48 as an express application. 18:50 We can deploy those as serverless functions 18:53 which can then scale in the cloud. 18:55 So, anyway there's lots of different ways, I guess, 19:02 to think about scalability. 19:04 But I would say, the answer to your question 19:08 is yes, probably. 19:12 I, again think of GRANDstack as a starting point, I guess, 19:17 of how these technologies can work together, 19:19 and then we can often plug and play 19:26 and massage different things depending on our use case. 19:29 And how we want to address the scalable aspect. 19:37 So how do these fit together? 19:40 If we look at this diagram here 19:46 fundamentally what we have is Neo4j which is our database, 19:52 Neo4j is a graph database. 19:54 We query it using the Cypher query language, 19:57 which we'll take a look at in a moments. 20:00 GraphQL is the API layer that sits between the Clients 20:05 and our database. 20:07 So in our GraphQL server implementation, 20:11 we're going to be generating Cypher query is to send 20:15 to the database. 20:16 So we don't send GraphQL queries directly to the database 20:21 instead, that's the responsibility of our GraphQL server, 20:25 our API layer, to figure out how to talk to our database. 20:32 And then on the Client, 20:34 we use React 20:38 and build our user interface that way. 20:43 And you'll notice here we have Apollo both on the Client 20:48 and the server. 20:50 So Apollo is really this suite of tools 20:54 for building a GraphQL servers and GraphQL Clients. 21:01 And then Apollo also has a hosted solution 21:06 that makes it easier to work with GraphQL 21:11 across teams in the enterprise, that includes 21:13 things like schema registry, performance monitoring 21:17 and things like that. 21:18 But we'll be focusing at looking at using Apollo Clients 21:21 and Apollo Server. 21:22 So Apollo Clients integrates with our front end framework 21:26 in this case React, but there are lots of different flavors 21:30 of Apollo Client for different front end frameworks. 21:34 And the nice thing there is that it's idiomatic 21:37 to the framework that we're using. 21:39 So, in React world, this means that we have Apollo hooks 21:45 that allow us to basically bind state variables 21:49 in our components to GraphQL queries and mutations 21:54 at different GraphQL operations. 21:56 So we can work with that data in our React components. 22:01 And we don't really have to think much about how to connect 22:04 to and serialize and send queries. 22:08 Apollo Client handles that as well as caching for us. 22:12 And then on the server side, Apollo Server 22:16 is a great tool that allows us to take 22:19 our GraphQL type definitions, which is the schema 22:22 that defines our GraphQL API and the resolvers, 22:26 which is the logic that says how to go out 22:29 to the data layer to fetch data, 22:31 to resolve our GraphQL operations. 22:34 Apollo Server allows us to combine these together 22:39 and create a executable GraphQL schemas 22:44 that we can then serve using different frameworks. 22:49 In this case, we'll look at Express, but like I said, 22:50 we can also push that out as serverless functions. 22:59 So, that's the basic 23:02 the basic way that these pieces interact. 23:07 Let's take a look maybe at some 23:09 of the individual components now. 23:13 So by the way grandstack.io, 23:15 this is a good site that has 23:22 links to documentation 23:24 for using GRANDstack, including the Create GRANDstack CLI, 23:29 that we saw for the Neo4j, GraphQL integration 23:33 that we'll talk about in a moment. 23:36 Also there's some low code tooling specific 23:41 to Neo4j desktop, that allows us to build a GraphQL APIs. 23:46 So, you can think about, think about those resources. 23:50 There's also a GRANDstack blog, 23:52 that has cool posts from different folks in the community 23:56 about the different ways that they're using GRANDstack 24:00 and what they're building. 24:01 So that's another good resource to check out as well. 24:13 So some discussion in the chat about different scalability. 24:18 I think fundamentally it comes down to, 24:21 like I was saying that there are different considerations, 24:25 different aspects of scalability in any application 24:30 that we want to reason about. 24:39 So, let's take a look at some 24:42 of the individual components here 24:46 starting with GraphQL. 24:55 So, fundamentally GraphQL is a query language 25:00 for our API and really in a runtime, I guess 25:05 for implementing that API. 25:11 And with GraphQL, we start with type definitions. 25:17 So we start with a schema that defines the types 25:23 that are available. 25:24 What are the entities? 25:26 What are the fields on those entities? 25:28 What are the types of those fields? 25:30 How are these types connected? 25:32 And that's where the graph in GraphQL comes in, right? 25:37 Is that this 25:39 the schema, these type definitions are defining 25:44 a data graph, how these entities are connected. 25:49 And while we like that there's a nice mapping between 25:56 this data model that we think of in GraphQL, 26:01 thinking in terms of a data graph 26:03 and the property graph model that we use in Neo4j, 26:07 while there's a nice mapping there. 26:09 We can use GraphQL with really any data layer. 26:13 It it doesn't have to be a graph database. 26:16 We can work with relational databases, document databases, 26:21 combining different data layers. 26:23 It's often a common approach to wrap existing APIs, 26:28 wrap rest API is with GraphQL. 26:30 So GraphQL is really data layer agnostic, 26:34 I guess is the way that, that I think of it. 26:38 So with every GraphQL schema, 26:41 we define our type definitions, 26:43 we define the entry points for the API. 26:47 And then when the Client issues a query, 26:49 the Client asks exactly what they're interested in 26:55 and no more. 26:57 So the Client specifies what's called a selection set, 27:00 and the selection sets is this nested structure. 27:04 Let's see if we have an example. 27:07 Yeah, here's sort of constructing a selection set here. 27:11 So, you can think of a selection set as 27:13 one a traversal through this data graph. 27:16 So this can be a nested structure. 27:19 In this case we're describing individual fields, 27:22 but we could also say you know, show me the name 27:27 of the hero. 27:28 And this is "Star Wars" data. 27:31 So, maybe show me the, the planets that this individual 27:35 has been to. 27:37 And then show me the species that live on those planets, 27:40 that sort of thing, where we end up with 27:42 this nested structure, that's defining one, 27:45 a traversal through this data graph. 27:46 And then also, which fields 27:49 of those various types to return. 27:54 And the benefit of the Client being able 27:59 to construct this selection set, means that there's only 28:05 one round trip request to the API, to render say 28:11 a particular view in a application. 28:18 So rather than with the rest API, where we might need 28:21 to make multiple round trips, maybe if we're rendering 28:24 a list of blog posts and their authors, 28:28 first we need to go to the rest API and say, 28:30 give me all of the blog posts. 28:32 And then for each one, we need to go back to the API 28:35 and say give me the information on the author 28:37 for this blog post. 28:40 And with GraphQL, we could do that all in one request. 28:44 We talked about the benefit of the type system. 28:48 And then, there's lots of great developer tooling 28:53 that exists in the GraphQL ecosystem. 28:56 A lot of it is powered by this concept of introspection. 29:02 So once we have a GraphQL API, we can introspect the API 29:09 and say what types are available? 29:13 What is the schema of this API? 29:16 And we can build tooling that allows us to view essentially 29:22 as documentation, the type definitions, and the schema. 29:28 So there's this tool called GraphQL, that we'll take 29:31 a look at, that allows us to, view and search 29:36 this introspection, and of course we can also build 29:39 things like, suggestive autocomplete type ahead, 29:44 these sorts of features, powered by this concept 29:48 of introspection. 29:55 That I think 29:58 is a good overview of at the high level of the benefits. 30:05 The point here really is that, GraphQL 30:08 is really programming language agnostic. 30:12 So, there are GraphQL implementations 30:14 in lots of different languages and framework. 30:27 So, maybe a look at 30:33 some of the specific features of GraphQL. 30:45 So here we have a GraphQL query. 30:48 So this is the "Star Wars" data from the previous page. 30:54 And you can see it's sort of starting with this entry point. 30:58 So hero in this case, this is mapping to 31:02 what's called a query field. 31:04 So there's a query type that has fields. 31:07 And so fields you can think of as like a property 31:12 on an object. 31:16 And here, we're saying start at the hero query field 31:22 and then find the name and return that. 31:26 So, fields are kind of like the building block, 31:33 but we can create this more, 31:42 this more nested structure. 31:44 So, if we add the friends field to the query, 31:50 this is bringing back a list 31:55 of person, objects. 31:59 And then I can construct a selection set 32:01 for that person object as well. 32:05 And so then I can continue on and say, okay, 32:08 for each character, show me the episode, 32:13 episodes that they appear in? 32:15 Which isn't, you know. 32:19 Cool, so that's how we can, can build up 32:22 that nested selection set structure. 32:27 We can also pass arguments. 32:30 So here we're looking up human by a specific ID, 32:35 passing that in as an argument, at the root. 32:40 We can also have field arguments that are passed in as well. 32:48 Aliases, we can alias at the various fields 32:51 in our selection set, if you want to rename those. 32:55 This is often useful in the context 32:58 of our Client application, if we maybe want 33:01 to reason about certain pieces of our selection sets 33:05 differently in our Client application, 33:09 find aliasing useful. 33:13 Similarly fragments, fragments allow us to group 33:17 a bunch of fields together and then reuse those. 33:20 And again, I find this most useful 33:22 in the Client's application where we have different views 33:26 that may want to reuse different fragments. 33:28 So, rather than maintaining the individual selection set 33:33 across different views, we can just define a fragment 33:36 that groups a bunch of those fields and selection sets. 33:43 Variables are important. 33:49 Here's talking about variables and fragments. 33:50 I think there's a separate, 33:51 separate section on variables. 33:53 Let's skip to this one. 33:53 So oftentimes, in our Client application, 33:58 will have a static query, but then depending 34:02 on some user input, the actual value for an argument 34:08 is defined based on that user input. 34:11 And so in that case, we define variables 34:14 that will be passed along with our GraphQL query. 34:18 So in this case, the Client is going to pass the query 34:22 and then an object of variables that has values 34:26 for the variables defined in the query. 34:29 And it's important also that because 34:31 of the strict type system in GraphQL, 34:34 we have to define the type of those variables as well. 34:39 So first we declare it. 34:40 So here, this is the variable episode 34:43 that is of type episode. 34:45 And then where do we actually use it? 34:47 Here we use it as an argument past to the hero field. 35:00 And when we define variables, we need to add 35:03 the operation name. 35:05 So by default, the operation type is query. 35:10 There are also mutations and subscriptions 35:14 which we'll talk about as well. 35:22 So, that I think is a good overview 35:24 of how we can use GraphQL. 35:30 There is a example, 35:35 GraphQL API, which I will drop the link in the chat 35:39 to movies.grandstack.io. 35:43 So this is 35:46 the example that I think we'll use for the exercises. 35:49 So maybe we'll just take a brief look at this 35:53 and then come back to this when we start working 35:55 through the exercises. 35:58 So yeah, from the chat Constantine, 36:01 is looking ahead and ask if you can sort by director name. 36:05 Yeah, so we'll take a look at that when we start working 36:08 through the exercises. 36:10 But this is a good, this is a good example API 36:14 to look at for a couple of reasons. 36:17 One, it uses what's called GraphQL Playground. 36:21 So, if we just connect to this, 36:25 then if we just connect to this in our browser 36:29 we'll see this interactive GraphQL Playground tool, 36:35 which is kind of like GraphQL. 36:37 We saw an example of GraphQL in previously 36:42 on that GraphQL.org website. 36:45 So we can look at the docs. 36:48 So, this is powered by that introspection 36:51 feature of GraphQL. 36:52 So we can see, okay, what are all of the entry points? 36:56 What are the types that are available? 36:57 So looks like we have movies, genres, actors, and users. 37:01 We can see how they're connected, 37:03 the fields that we have available on each type and so on. 37:09 So, I just wanted to point out that this API 37:14 is out there. 37:15 Play around with that, we'll come back to that in a minute 37:20 when we start going through our exercises. 37:24 So, I'm gonna skip through this section of the book there, 37:29 there's more in there that sort of compares GraphQL 37:32 to how we might do things in the rest world, 37:36 a bit about some data modeling and so on. 37:40 So, you can read through that in the book, 37:42 I'm gonna skip down to the React section, 37:46 and let's talk about React for a little bit. 37:55 So, React is a JavaScript library 37:58 for building user interfaces. 38:03 React like GraphQL, was open sourced by Facebook. 38:13 React is often used for building web applications 38:18 but there are different rendering engines 38:23 for React for say, for example, for native. 38:28 So for mobile applications, React Native, 38:30 there's also React VR, for building 38:34 virtual reality application. 38:36 So not specific to talking about the web 38:40 and the Dom, although that is a common way to use React. 38:48 So in React, we typically use what's called JSX. 38:55 So, JSX is kind of this XML like syntax 39:00 that is sort of mixing JavaScript and HTML. 39:06 It's not required but we often find that JSX is a useful way 39:14 to be able to construct our components. 39:19 And so when we're talking about components, 39:23 a component, I guess is sort of a way 39:27 of combining React elements and data. 39:32 So there's two kinds of data in our components, 39:35 there's props or our properties. 39:38 And these are values that are typically passed in 39:41 to our component, typically from some other components. 39:47 So components are often nested. 39:49 You end up with this hierarchy of components 39:51 to compose a more complex UI. 39:56 And then we have state. 39:57 And state is variables that are specific 40:02 to a component that then can trigger re renders 40:06 of that component as the state changes. 40:09 So, one thing that is nice about React 40:11 is it's very smart about trying to rerender, 40:16 pieces of our components, pieces of our application 40:20 only as a state is changing. 40:24 Only re-rendering the piece of the application 40:27 that needs to be re-rendered. 40:29 So rather than re-rendering the entire Dom 40:32 for a web application, if only a small piece, 40:35 has changed based on that state, 40:38 React to knows to only update that piece of the application, 40:42 because it maintains its own, what's called a virtual Dom, 40:46 so virtual model of the Dom. 40:52 Let's take a look, really quickly at 40:55 a simple React application. 40:58 So there's a command line tool called Create React App. 41:12 And Create React App is a convenient way to get started 41:17 with React because it bundles together, lots of things 41:20 we need for building a React application, 41:24 so we don't have to think about things like Webpack. 41:29 We can just have scripts that are opinionated 41:33 and take care of that. 41:34 So, let's do NPX, it's a bit bigger, 41:37 NPX Create React App and call it 41:43 my new React app. 41:46 So NPX is a command line tool that comes with NPM. 41:54 So from the node ecosystem. 41:58 And NPX basically combines the ability to download a package 42:04 from NPM and then execute it. 42:07 So, we don't have to install this Create React App package. 42:12 Create React App, this is a package that we can find on NPM. 42:18 So if we go to create-react-app, 42:24 we'll see you on NPM. 42:26 Both NPX, we don't need to install it, 42:28 we can just say download the latest version of it 42:32 and then execute it as a command line tool. 42:36 And so what does it do? 42:37 Well, it builds a new React application for us 42:42 in this case called my new React app. 42:50 Let's open this up in VSCode. 42:56 Question in the chat, 42:59 as a developer and transitioning from Windows 43:04 from VS environment to VSCode Open Source Developer, 43:08 set up and deployment is harder in the GRANDstack worlds. 43:11 Would you call it any irrelevant differences 43:12 between windows forms deployments 43:15 and GRANDstack deployments? 43:21 Yeah, that's a good question. 43:23 Unfortunately, I probably 43:26 am not the best one to answer that. 43:31 The windows form world is not something I know much about. 43:36 But if anyone in the chats has any thoughts 43:41 or opinions on that, maybe they could 43:44 help Dennis out. 43:46 But yeah, not something I'm too familiar with. 43:54 That might be also maybe a good question for 43:56 the Neo4j community sites, 44:01 community.neo4j.com, which is a discourse forum. 44:06 So lots of folks asking questions there, 44:10 and lots of folks from the community giving their, 44:14 giving their input. 44:16 So that might be a good resource to ask that question 44:19 and we can give you a bit more info than that, 44:22 than what I can. 44:28 Okay, cool. 44:29 So we have created our React app. 44:34 We've opened it in VSCode. 44:36 And let's get a terminal. 44:42 And let's run this. 44:43 So, yarn start. 44:46 If we take a look in package JSON, 44:49 we'll see that there are only a few dependencies here. 44:57 So, this Reacts scripts depends. 45:00 So first of all, React and ReactDom. 45:03 So React is the core library. 45:07 Version 17, I think is a very is very new. 45:11 So that's great, we've got the latest version of React 45:14 and ReactDom. 45:16 So we said that there are different rendering engines 45:21 for React that we can build our user interface 45:24 and then use a different rendering engine 45:27 for that in different platforms. 45:28 So ReactDom, this is the rendering engine for the web. 45:33 So the Dom, the document object model, 45:36 there's also React Native, React VR, 45:40 but this is specifically for building web applications. 45:43 And then React Scripts is where we have all of 45:46 our sort of build tooling, that we get 45:50 through Create React app. 45:52 So when I ran yarn start, it did a React Scripts Start. 45:58 Let me zoom in a little bit. 46:00 There we go. 46:02 Similarly for build. 46:03 So when we're ready to build this and deploy this somewhere 46:08 as static content, we can leverage React Scripts build 46:12 to do that. 46:16 So when I ran yarn start, it did React Script start. 46:19 And as it says here, it built a dev version 46:26 of the application. 46:27 So that means that I'm gonna have hot reloading 46:30 as I make changes to the application. 46:33 And then it's serving that on local host 3000. 46:39 So let's take a look at what we got there. 46:43 And cool, we've got this application with a spinning logo 46:49 and some text. 46:53 That says edit. 46:54 Source app JS and save to reload. 46:56 So let's take a look at this application. 47:00 So in source, 47:02 first, let's look at index JS and see what's going on here. 47:06 So here, we're pulling in React, ReactDom, 47:13 some CSS pulling in this app component. 47:16 So app is a React component. 47:19 And then we're calling React on render, which is then going 47:22 to render our entire React application, 47:26 entire React component hierarchy that we defined here. 47:29 It's gonna render that into an element 47:32 in the Dom in this case with ID of route. 47:40 There is 47:45 this index.HTMLfile, 47:49 which here has this div with ID route. 47:54 So when we say 47:58 in index JS to render 48:03 our React application 48:04 into that element, that's the one that we're talking about. 48:07 So, that one in index to HTML, 48:09 render our React application into that element, 48:13 where are you gonna render? 48:13 Well, we're gonna render this app component. 48:17 We wrap it in this React strict mode, which gives us, 48:20 some more opinionated linting. 48:32 So, let's switch to app JS and see what this looks like. 48:40 So we're pulling in an SVG logo and some CSS. 48:48 And then here is our component. 48:52 So components are just functions. 49:02 Previous versions of Reacts more heavily relied on 49:05 what are called class components. 49:08 So when we start working with state, so we said earlier that 49:14 there's two kinds of data inside a React component. 49:18 Props or properties and state. 49:21 We said that props get passed into our components, 49:26 typically from some other component in the hierarchy. 49:29 And then we work with that props data to render 49:33 that somehow according to our view logic. 49:38 And then we have state, and state, these are variables 49:43 inside our components that are changing perhaps. 49:48 And when a state variable changes then that can rerender 49:55 part of our component. 49:59 So, previous versions of React required you to use 50:04 what are called class components to work with state. 50:07 However more recent versions of React have introduced 50:10 what's called hooks, which allow us 50:13 to have state variables inside functional components. 50:19 So we can still use state class components 50:22 to work with state that's fine. 50:23 But we can also just keep our React components 50:27 as functions and just work with state using hooks, 50:33 and have functional components. 50:36 Anyway, let's modify this component a bit. 50:40 So what it's doing there's one component app, 50:44 which is this function, and it's returning, a div 50:50 and a header 50:52 and that our image 50:55 and some text, 50:57 and an anchor tag. 50:59 Let's modify this now, 51:01 let's create a new component. 51:04 Let's call this greeting. 51:13 And we said that in React components are just functions, 51:20 and functions that are past props specifically. 51:30 Let's say that our greeting component is going 51:35 to take a name prop, 51:40 and what we want to do is return. 51:48 Just a div, that includes the name 51:53 and a greeting. 51:54 So I'll say hello. 51:58 Name. 52:01 And then here, we can use that 52:06 components inside our app component. 52:10 So components are nice because they allow us 52:15 to encapsulate data and logic, and can then be reused. 52:21 So here I'm including this greeting component, 52:26 and now I have hello blank. 52:28 So let's pass a name prop. 52:38 Misspelled. 52:39 Well, there, with two L's. 52:44 So, now I have this greeting components 52:47 that I can use here in my app components. 52:50 And I can feel free to reuse it in other components as well. 53:00 So, that's a brief look at React and, 53:09 the Create React app CLI, 53:14 a bit of a look at JSX components and props. 53:21 Let's move on to 53:27 the next piece in our, 53:36 in our GRANDstack list of components here which is Apollo. 53:43 So Apollo, 53:49 let's start at apollographql.com. 53:54 So Apollo, 53:56 is really a suite of tools 53:59 for working with GraphQL 54:03 both on the Clients, on the server, 54:07 and then also tooling for things like testing GraphQL APIs, 54:13 working with GraphQL in a large team. 54:18 And if we look at actually, 54:22 I want Apollo 54:32 React. 54:35 Platform, that's what I was looking for. 54:38 So the Apollo platform, let's take a look first 54:41 at Apollo Server. 54:46 So, Apollo Server allows us to take GraphQL type definitions 54:52 and resolvers. 54:57 So here's an example, 55:00 skip ahead to step three here. 55:03 So in this example, we are defining our GraphQL types 55:11 using the schema definition language for GraphQL. 55:18 So we skipped over this a little bit. 55:20 We'll come back to this. 55:22 I think we have an exercise that we need to think 55:25 about how to create a GraphQL type definitions. 55:30 But the idea here is that we are defining our types. 55:36 So here, we're saying there's a book, 55:38 a book has a title of type string 55:40 and an author of type string. 55:43 And then a query type, which defines the entry points 55:49 for our API, for read operations. 55:52 And we're saying you can query for books 55:55 that will give you a list of book objects. 55:59 So we start with the type definitions for our GraphQL, 56:04 API, then we create resolvers. 56:08 So here we have just one field resolver to implement 56:14 on the query type, that's books. 56:17 And in this case, I think above we've defined. 56:20 Yeah, so above we've defined just some hard-coded data 56:24 and here we're just returning that that books array. 56:28 But this could be something more complex, 56:29 like query a database, query another API. 56:35 And then Apollo Server allows us 56:37 to combine those type definitions and resolvers. 56:42 It gives us an Apollo Server instance that we can then 56:46 in this case start an express server 56:51 that is then going to handle the networking layer. 56:55 So taking GraphQL requests and executing those against 57:01 our GraphQL executable schema. 57:05 So, that's at a high level, what Apollo Server 57:09 is doing for us. 57:10 And then on the Client side, 57:13 we go to platform, 57:15 Apollo Clients. 57:19 On the Client side, 57:23 so we can zoom in a bit. 57:24 Yeah, this is a good example. 57:27 So the defaults Apollo Clients integration 57:33 is I think the the React hooks integration at this point. 57:39 So what's nice about this is that it hooks in 57:44 to our state variables in our React components. 57:48 So here we have a username React components. 57:53 We're defining a GraphQL query operation here 57:58 using the use query hook. 58:02 So here we're querying the Mi query field, 58:07 fetching the username and then when our data comes back 58:12 from the GraphQL API, it's populated 58:14 in this data object down here, so which we can reference. 58:19 Data.meet.username. 58:21 And render that in our React component. 58:27 Apollo Client does lots of other nice things for us, 58:29 like maintains a cache. 58:32 So we don't have to go out to the GraphQL server 58:35 with every request. 58:38 And has some other some other hooks as well. 58:43 So we can say only execute a query when 58:48 we are responding to a user operation 58:51 or working with mutations for right operations. 58:56 There are different flavors of Apollo Clients. 58:59 So thiS is the React framework integration, 59:02 but there are integrations with other front end frameworks 59:06 and also native for iOS and Android. 59:12 Okay, cool. 59:13 So that at a high level is some of the benefits of Apollo. 59:19 Let's take a look now at Neo4j. 59:23 So Neo4j, let's jump to neo4j.com. 59:34 The developer getting started, 59:36 that's a good place to start. 59:41 So far let's take a look at our our GRANDstack. 59:49 We have a diagram. 59:50 Yeah, here's the diagram. 59:52 So, so far we've talked about 59:56 React that the front end layer 59:59 for application. 60:00 We've talked about the GraphQL piece, 60:04 both how we query GraphQL on the Clients, 60:06 and how we can build a GraphQL API using Apollo Server. 60:13 What we haven't talked about is our data layer 60:17 in the application. 60:19 And that is where Neo4j comes in. 60:28 Neo4j is a native graph database. 60:33 So what that means 60:35 is that the data model that we work with in Neo4j 60:39 unlike other databases where we may be thinking 60:43 in terms of tables or documents. 60:48 Instead the data model is a graph. 60:51 So nodes, these are the entities 60:53 in the graph and relationships, connect nodes. 60:58 And nodes and relationships can have properties 61:02 or attributes, that's sort of the basic data model. 61:07 And there's, like I said, a nice symbiotic relationship 61:12 when we're using GraphQL and Neo4j together. 61:18 And in one sense, what I mean by that is, 61:23 well, there's a nice mapping from the data model 61:26 that we have with a GraphQL, thinking of 61:30 this data graph and mapping that to the property graph model 61:34 that we have in Neo4j. 61:38 But, there's also benefits that we get for Neo4j 61:43 with using GraphQL. 61:45 And one of those, I think is this idea 61:47 of a strict type system. 61:50 So Neo4j itself is what's called schema optional. 61:55 And what that means is that we don't have to define 62:00 a strict schema to start working with data in Neo4j. 62:04 So we can just start creating and querying data 62:10 in Neo4j without defining any constraints on 62:15 if certain properties should be of certain type 62:17 or if they should even exist at all. 62:21 And this can be, this is can be a good thing, 62:24 or it can also sometimes be a bad thing. 62:28 So for example, it's nice to have this flexibility 62:33 and the ability to evolve our data model 62:36 without having a strict schema. 62:39 But it can be difficult 62:42 to then sort of reason about that schema 62:45 and enforce that say maybe in our application layer. 62:49 But the benefits that we have of working with GraphQL 62:53 and Neo4j is that GraphQL then enforces 62:58 that schema for us through its type system. 63:05 It's one of the benefits, I think. 63:08 So what is Neo4j really? 63:12 Let's talk a little bit more about that. 63:15 We said Neo4j is a database, but Neo4j is really 63:20 more than that. 63:21 That the database is really, I think just the core parts 63:25 of Neo4j, and there's really this platform, 63:28 this ecosystem around Neo4j. 63:32 And I think there's kind of the spectrum 63:36 of two ways to use Neo4j, one is in a transactional manner. 63:44 So thinking of, graph transactions I guess as 63:49 this says in the diagram, but basically where, Neo4j 63:53 is backing an operational workload. 63:56 So, we're building a, I dunno, maybe 63:59 a movie search application, a business reviews application, 64:05 something like that, 64:06 where, we're executing operational workloads 64:12 against Neo4j, create this user in the database, 64:15 find this user in the database, 64:17 find the restaurants that they've reviewed and so on. 64:21 And the benefit that we have in that use case with Neo4j 64:26 over other databases is a few things. 64:30 One, is we have this graph model, which is really nice 64:34 for expressing connections amongst our data. 64:38 So, if we're talking about, business reviews, 64:42 it's very natural for us to be able to model 64:45 and express a query that is touching users, the reviews 64:49 that they've written, the businesses that are mentioned 64:52 in those reviews. 64:54 Their friends that have reviewed, the same businesses, 64:56 what genres those are in and so on. 65:01 And if we're doing queries that are touching a lot of those, 65:06 so maybe traversing from a user to their reviews 65:10 to the business mentioned, to the genres, 65:12 to their friends that are reviewed the same genres, 65:15 that sort of query is a traversal through our data graph, 65:19 which we can being express in GraphQL, 65:23 or we can express in Cypher. 65:24 Which we'll take a look at Cypher in a minute. 65:27 But the benefit that we have with a graph database over say 65:33 a relational database or a document database, 65:35 is it's easier to express that in the query language 65:40 for the database. 65:41 So, Cypher which we'll see in a minute allows us 65:43 to just essentially draw this sort of ASCII art notation 65:49 for this sort of traversal. 65:51 And then the other is the performance implications. 65:55 So graph databases like Neo4j are optimized 65:59 for these traversals. 66:00 So it's databases like Neo4j have this property 66:07 called index free adjacency. 66:09 And what this means is that that traversal from a user 66:13 to the reviews they've written, 66:15 to the businesses mentioned in those reviews to the genres, 66:18 to their friends is never hitting an index 66:22 to do that traversals 66:23 each one of those traversals is a constant time operation. 66:28 It's not dependent on the overall size of the data. 66:32 So that means that as we add more and more data. 66:35 So this is getting back to some questions earlier 66:37 where folks were asking about scalability. 66:39 This is one dimension of scalability 66:42 that I think is really important, 66:43 is that as we add more and more data, more businesses, 66:47 more reviews, more users, 66:49 going from one user to their reviews, to businesses 66:52 and that traversal, is a constant time operation, 66:57 dependent really on the number of businesses 67:01 that are connected to that user, not the overall size 67:05 of the data. 67:06 So, we're going to have 67:08 different performance characteristics in a graph database 67:11 like Neo4j versus trying to do that operation 67:14 in a relational database where each one of those traversals 67:18 is a join against a join table, where we're using an index 67:24 that is going to slow down as we add more and more data, 67:27 to the database. 67:31 So anyway, so that's that's the graph transactions 67:35 side of using Neo4j, 67:37 for more operational workloads. 67:40 And then we have this this right-hand side 67:44 that's talking about graph analytics. 67:48 And these are the more global operations. 67:52 So rather than looking for a specific user 67:58 and finding I don't know the reviews and recommendations 68:02 for that specific user, when we're talking 68:04 about graph analytics, we're talking about operations 68:09 that are touching the entire graph. 68:11 So, can we run a page rank on the graph 68:15 to find the most influential nodes in the network? 68:18 Can we run a community detection on the graph 68:22 to assign nodes to different communities 68:27 and that sort of thing. 68:30 And there's lots of tooling that is available 68:35 for these more analytics and global use cases. 68:40 So things like the graph data science library, 68:44 which has lots of these graph algorithms, 68:48 Bloom, which is a tool for data visualization, 68:52 sort of a low code tool that allows us to visualize 68:56 and work with our data. 68:59 So anyway, so when we talk about Neo4j, 69:01 we're really talking about not just this core database, 69:05 but really this platform of tools 69:09 that sit around the database. 69:13 We didn't really mention things like tools 69:17 for data integration, but of course these, 69:20 these exist as well. 69:21 Neo4j does not just exist in a vacuum. 69:24 We need to be able to say integrates with Spark 69:29 or Kafka, 69:32 ETL tools for importing data into Neo4j. 69:36 So we have those sorts of tools and integrations, 69:40 and then Client drivers are really important as well. 69:44 So we're about to take a look at Cypher, 69:47 which is the query language that we use 69:50 to interact with Neo4j. 69:54 And you often want to build an application 69:58 in lots of different programming languages. 70:00 so JavaScript whatever it may be 70:06 and you want to be able to send Cypher queries to Neo4j, 70:13 but work with the database in the language of your choice. 70:16 And that's where the Client drivers come in, 70:20 which we will dive into in more detail, 70:23 I think in in the next session. 70:28 What I wanna do now is talk a bit about Cypher. 70:34 So, Cypher is the query language that we 70:38 use to work with Neo4j. 70:42 Let's take a look at the getting started example. 70:47 Just wanna find some examples here. 70:51 Yeah, so with Cypher, here's a good example. 70:55 With Cypher, we're very much thinking 71:00 about declarative pattern matching. 71:06 So what does that mean? 71:08 Well, basically what we do is we draw these graph patterns 71:15 and then we have some different commands 71:21 that we can use in Cypher for how we want to operate 71:25 on these patterns. 71:26 But this idea of pattern matching is fundamental to Cypher. 71:31 And what do I mean by pattern? 71:34 Well, here, this example, 71:37 we have defined a pattern that says 71:43 one node with the label person 71:47 will bind that to the variable P, 71:52 an outgoing relationship of type likes, 71:58 that is connected to a node with the label technology, 72:04 and will bInd that to the variable T. 72:08 And this is a create operation. 72:10 So if we ran this line, it would create two nodes 72:15 in the database connected by a likes relationship. 72:20 So, that's what we mean when we talk about pattern matching 72:24 in Cypher, is drawing this sort of ASCII art notation 72:29 that defines patterns in the graph. 72:35 Let's take a look at Neo4j desktop. 72:42 So, Neo4j desktop is if we gotta download Neo4j, 72:49 so neo4j.com/download. 72:53 A desktop is the default download. 72:57 You can think of desktop as kind of the, 73:02 I dunno, mission control for working with Neo4j 73:06 is maybe a good way to think of it. 73:09 So, I can create projects. 73:13 I can create local or remote databases within each project. 73:19 I can install graph apps, which are sort of like plugins 73:25 and extensions for 73:29 for Neo4j desktop. 73:31 Maybe we'll talk about those in more detail again, 73:36 I think in the next session. 73:40 So here I have a database with some data 73:43 from OpenStreetMap. 73:45 So, let's open up Neo4j browser. 73:50 So Neo4j browser allows us to write Cypher queries 73:57 and visualize and work with the results. 74:01 So this dataset comes from the summer of nodes project 74:06 that we did. 74:10 Is anyone on the live stream who participated 74:13 in summer of nodes? 74:16 Let us know in the chat if you did. 74:17 Some of nodes, I think it was a lot of fun, 74:20 it was basically a series of challenges 74:23 for working with different datasets. 74:26 And this was, I think the final one where we took some data 74:30 from Central Perk, from OpenStreetMap of Central Perk 74:35 in New York and imported that into Neo4j, 74:39 and then we extracted points of interest. 74:43 So, here's our point of interest nodes. 74:48 If you're following along on the livestream for the, 74:53 I know I posted a link to this earlier, 74:55 but the the Central Perk project where we built 75:00 a travel guide with Gatsby. 75:03 This is the dataset that we used for that project. 75:07 And I'll drop the link to that. 75:08 In the chat again, in case you missed it. 75:12 Anyway, so I just wanna show us some examples of Cypher 75:17 and Neo4j browser to give you an idea of how we can work 75:23 with data in Neo4j. 75:29 Let's make this a little bigger. 75:31 There we go. 75:32 So here is these red nodes, 75:34 these are our point of interest nodes that we identified 75:38 in OpenStreetMap. 75:40 And we can see the properties that we're storing 75:44 on these nodes. 75:45 So this is the William Shakespeare statue 75:52 and have it's latitude and longitude. 75:55 So OpenStreetMap, it's all crowdsourced data. 75:59 So someone went to Central Perk, 76:01 went to this William Shakespeare statue, 76:04 figured out what the latitude and longitude is, 76:06 uploaded that to OpenStreetMap 76:09 and they also gave us some additional information. 76:12 So the name of the artist, 76:16 the artwork type, 76:19 the date that it was built, 76:21 and this is really handy, has connected it to Wikipedia. 76:26 So we know what is the Wikipedia page 76:29 for this point of interest. 76:33 So, we have that data, but then we have all of the ways 76:41 from OpenStreetMap that exists within Central Perk. 76:44 And ways are basically just the terminology for any 76:51 geographical object that's been uploaded 76:53 to OpenStreetMaps. 76:55 So this could be points of interest. 76:57 This could be the outline of buildings, foot paths, 77:01 sidewalks, streets and so on. 77:05 So we know basically not only the latitude and longitude 77:09 of this William Shakespeare statue, 77:13 we know all of the foot paths and sidewalks 77:18 that we can follow to get from say from one point 77:22 of interest to another, by following in this case, 77:26 these routes relationships. 77:28 So these blue nodes represent intersections 77:33 in the different ways. 77:34 So where do you two foot paths or two sidewalks 77:37 or a sidewalk in a street, where do they intersect. 77:40 That then forms a routing graph that I can traverse 77:44 to go from, say from, I don't know, 77:48 this is William Shakespeare statue to this unnamed fountain. 77:57 So let's see how we can do that in Cypher. 78:02 So, I'm gonna switch over here to some saved queries. 78:04 So, first of all, can we find two points of interest? 78:10 So here, we're going to find a point of interest, 78:14 where the name is the Duke Ellington Memorial. 78:17 And then find another point of interest node 78:20 where the name is the Jacqueline Kennedy Onassis reservoir. 78:25 If we run that, yep here's my two nodes. 78:29 I can double click on these and see what 78:32 they're connected to. 78:33 So this OSM tags node is a node that has, 78:38 additional information from OpenStreetMap. 78:41 And then I see our routing graph, our routing nodes. 78:45 So these are the different intersections 78:47 and the different ways 78:50 that connects to the reservoir. 78:55 So, how do I find a path between 79:00 these two points of interest? 79:02 Well, one feature that's really nice in Cypher 79:05 is this variable length path operator. 79:14 So here I've said, find the Duke Ellington Memorial, 79:18 bind that to the variable A. 79:20 Find the reservoir, bind that to the variable B, 79:26 and then this pattern, this says 79:29 a path from A to B following the route relationships. 79:37 So this is our routing graph connecting intersections. 79:41 And then here's the variable length path. 79:43 So we can say asterisk, dot dot 200. 79:48 So, there can be a lower bound on this in an upper bound. 79:52 But this is saying this pattern is saying, 79:58 the path connecting A and B through a bunch of intersections 80:02 up to 200 intersections. 80:04 And then we're calling the shortest path function 80:08 which in Cypher is going to look at the shortest number 80:13 of relationships, connecting A to B. 80:17 And it's going to give me, if I go out 80:20 of full screen mode here, 80:23 it's going to give me that route. 80:27 So, let's zoom out a bit here. 80:32 So, here is the route that it found 80:38 from Duke Ellington Memorial to the Reservoir. 80:43 And I have latitude and longitude, and I can also see 80:50 for each of these intersections. 80:51 So this is an intersection of two ways, 80:56 and I can see furthermore, if I traverse out, 81:01 like which ways intersect with that one and so on. 81:04 In each of these routes relationships, 81:07 if we inspect the properties has a distance. 81:11 So in this case, the distance from this intersection 81:14 to this intersection is 12.9 meters. 81:20 From this one to this one is 290 meters. 81:23 So these intersections are not evenly spaced 81:28 and the Cypher shortest path function, 81:33 well this was just looking at the number of relationships 81:39 that I'm traversing. 81:41 It's not necessarily giving me the shortest weighted path. 81:47 So in distance terms, it's not necessarily going 81:50 to be the optimal route that I wanna take. 81:54 So in that case, we may want to use, 81:58 and I'll jump to this query. 82:01 We may want to use, what's called Dijkstra's algorithms. 82:06 So Dijkstra's algorithm is a shortest 82:10 weighted path algorithm that we can use in the GDS library. 82:17 So GDS this is graph data science. 82:20 This is a library of procedures for Neo4j 82:25 that sort of extend the functionality of Cypher, 82:28 that allow me to run more complex graph algorithms. 82:34 So when we're talking about this spectrum 82:36 between operational workloads and analytical workloads, 82:41 where we're talking about analytics 82:43 being global graph operations, that's where GDS comes in. 82:48 So we're saying, GDS alpha shortest path. 82:52 This is the Dijkstra shortest way to path algorithm, 82:56 where we're looking at the distance property 83:00 as having the weight. 83:02 And so now if we run this. 83:05 Escape out of full screen mode, 83:08 we get back, this is just pulling out the latitude 83:11 and longitude of each node along the way, 83:14 but it's also now taking into account the cumulative cost 83:18 or the distance that we're traveling in the path. 83:22 And it's saying that, well, the distance is 1500 meters. 83:26 So just under two kilometers from one point of interest 83:30 to the other. 83:32 And so when we're talking about routing, 83:34 this is gonna be a much better algorithm 83:38 than the Cypher shortest path, where we're only looking 83:41 at the number of relationships that we're traversing, 83:46 not the total cost of the path. 83:50 Anyway, so the point I wanted to get across there 83:53 is just looking at some of the tooling 83:56 that we use Neo4j browser, Cypher, 84:00 the various plugins that we have, 84:04 available to us in Neo4j like the graph data science plugin. 84:15 That I think is a good overview of Neo4j. 84:22 If we skip ahead 84:28 in chapter one, 84:34 what are we missing here? 84:35 We talked about Apollo Server, building resolvers. 84:44 What we build, let's see here that. 84:48 So this is chapter one in the book where we're just 84:52 sort of introducing the concepts of the different pieces 84:58 of the technology in GRANDstack. 85:03 So GraphQL, React, Apollo, Neo4j Database. 85:10 What we do in the rest of the book is seeing 85:15 how these technologies fit together to build an application. 85:20 And specifically, 85:23 we look at building 85:29 business reviews application. 85:32 So something where we're keeping track of businesses 85:35 and business details. 85:38 Writing reviews of businesses, searching for businesses, 85:42 and then showing personalized recommendations, 85:44 for the user. 85:48 And so what I wanna do now is work through the exercises 85:56 for chapter one. 85:58 So, let's go ahead and do that. 86:03 So there's three, 86:08 three high level exercises here. 86:10 One is writing some queries against 86:13 the movies.grandstack.io. 86:16 API, which we looked at a little bit. 86:19 And then, 86:23 see if we can write some type definitions 86:25 for the business requirements 86:27 of our business application. 86:32 And then downloading using Neo4j desktop, Neo4j browser. 86:36 We did that a bit and working through a sandbox example. 86:41 That's what we'll do next. 86:45 Let's see if I missed anything in the chat. 86:51 It sounds like a few folks have found 86:53 the book useful already. 86:54 That's great. Good to hear. 86:56 And then a question, 86:58 reason why a search by FID, F type ID non-billable value 87:03 would not work. 87:05 And then an example query for a therapeutic product by ID. 87:13 Yeah, I'm not sure. 87:15 I'm not sure what the 87:17 the context is there. 87:19 Are you maybe looking at the, 87:21 is that specific to the COVID graph API? 87:27 Maybe you can you can give us a bit more info on that one. 87:35 Let's jump over to 87:39 movies.grandstack.io, 87:41 and see if we can answer these questions from the exercise. 87:48 Let's make this a bit bigger. 87:52 So, open the docs tab and the schema tab 87:56 to see the type definitions. 87:57 So we looked in docs and we saw that 88:00 we have both queries and mutations. 88:04 So queries, these are the entry point for the API. 88:09 So we can start searching for movies, genres, 88:12 actors, or users. 88:14 And then for example movie, can take a bunch 88:18 of optional arguments. 88:21 And so, 88:24 what that means is if we wanna search for a specific movie 88:27 by ID or by title, we can include that or we can specify 88:35 a filter arguments. 88:38 You know if we jumped down to movie filter, 88:42 we can see that there are lots of different filter arguments 88:48 that we can use here. 88:49 So basically it looks like we have a filter argument 88:54 for each field on the movie type. 89:00 So we can search by ID. 89:06 We can search not just for an exact title match, 89:10 but we can do contains or a starts with, 89:14 so these string comparison operations for the title. 89:18 And then for numeric fields, we have less than, greater than 89:24 and so on. 89:24 So this filtering functionality is quite powerful. 89:30 We haven't talked about how this API was built, but 89:39 we can assume that it was built using 89:43 the Neo4j GraphQL integration. 89:46 So if we look in the docs here for, 89:49 search for a filtering complex GraphQL filtering, 89:54 we can see here some information about the filter argument. 90:00 So this is I'll drop a link to this in the chat. 90:06 So that filter argument in this documentation page, 90:10 this might be useful as we're working through the exercises 90:13 to see what filters are available. 90:16 One thing I like about the GRANDstack docs 90:19 is that it includes a graphical for some examples, 90:28 so we can run queries using graphical in the documentation, 90:33 which I think is quite nice as a learning experience. 90:36 Anyway, there's a table at the end here that shows all 90:38 of the different, filter functionality that we can use. 90:48 That is the type definitions. 90:51 Let's see if you can write some queries. 90:52 So find the titles of the first 10 movies ordered by title. 91:02 Well, if you look at the docs, 91:05 I think we wanna start with movie. 91:08 And movie takes a first argument 91:16 that allows us to do slicing. 91:18 So I think what we're gonna wanna do is say, 91:21 movie first 10. 91:25 So that's gonna give us the first 10 movies, 91:29 but these are not ordered, or order these is not guaranteed. 91:36 And if we start looking at our arguments, 91:40 and if we do a Control + Space, we can take a look 91:44 at some suggestions. 91:49 And again this is powered 91:50 by that introspection functionality of GraphQL, 91:54 which is really quite nice. 91:56 And I see there's this order by, so let's say, 92:01 order by and then again, I can do a Control + Space 92:05 to see the options for how I want to order. 92:11 And we want to order by title. 92:21 Title, descending or ascending. 92:26 I guess ascending probably makes 92:30 makes sense in most cases. 92:34 And we can see, we have some special characters. 92:39 So here's an escapes double quote, here's a single quote. 92:44 And so we start with those first. 92:50 Lemme return the first hundred. 92:53 We can see, yep then we go alphabetical 92:55 and then start with A and so on. 92:58 So, okay, cool. 93:01 That is giving us the first 10 titles ordered by title. 93:06 Next up is who acted in the movie "Jurassic Park". 93:13 Well, first let's figure out how to query 93:16 for "Jurassic Park". 93:19 So we can say where title 93:23 is "Jurassic Park", and that gives us "Jurassic Park". 93:27 We could also use the filter arguments, 93:32 and say filter. 93:35 And then again, Control + Space where title contains 93:46 "Jurassic Park". 93:47 And now this is gonna give me "Jurassic Park", 93:51 "Jurassic Park Three" and "Lost World Jurassic Park". 93:59 But the question was who acted in it? 94:01 So if we go back to the documentation, 94:09 and if we look at the movie type. 94:15 Movie is connected to actors through the actors field. 94:22 So I think that's what we want is to add 94:24 to our selection set, the actors, field, 94:28 and then we'll need to pull in their names. 94:34 And here we go. 94:35 Now we have the name of the actors for each 94:37 of the "Jurassic Park" movies. 94:45 And the next one, what are the genres of "Jurassic Park"? 94:51 Well, I don't think I need to go to the documentation again. 94:54 I think I can just use auto complete search for genres. 94:59 Genres have a name. 95:05 So, let's 95:09 minimize actors there. 95:10 So we can say for "Jurassic Park", we have thriller Sci-fi, 95:13 action adventure. 95:15 And we get, I think pretty much the same 95:18 for the other "Jurassic Park" movies. 95:21 And then the second part of this question, what other movies 95:25 are in those genres? 95:27 But again, we just keep adding to the traversal 95:32 of the data graph in our selection set. 95:36 Now nested under genres. 95:39 We can add movies to traverse out to the other movies 95:46 in each of those genres, 95:47 we get back a lot of data. 95:50 So we can say, maybe give me the first 10, order 95:56 by year descending. 95:59 So give me, only the most recent 10 movies in each genre 96:04 in this case. 96:09 And I can add, year to verify that what's going. 96:21 And the last question for this section, what movie 96:26 has the highest IMDB rating? 96:31 Well, let's, let's start over with a new query. 96:38 So, I know we're gonna wanna search for movie. 96:42 We'll bring back title. 96:45 It's highest INDB ratings. 96:47 So, I think we're gonna want an order by, 96:49 and IBDB rating as a field. 96:51 So I think if we say IMDB rating, descending. 96:57 Let's give me title and then let's 96:59 also return the IMDB rating. 97:01 And then let's just return the first 10 of those. 97:10 And if we run this, we can see, 97:13 well we get a bunch of nulls. 97:18 So, in whatever ordering system that we're using here, 97:23 it looks like we're ordering nulls before 97:27 we are actual float values. 97:33 And I think this is not super useful. 97:37 In our application, we probably, if the user selects sorts 97:41 by IMDB rating, show me the highest first, 97:46 they probably don't wanna see a bunch of null ratings. 97:50 So let's filter those out. 97:54 And in this case, I'm going to use the filter arguments. 98:02 Let's bring this down on a new line so we can see 98:04 this a bit easier. 98:06 So I said the documentation here would help us. 98:12 So, we could look at the example in the documentation 98:14 to figure this out or you could play around a bit. 98:17 But if we look at the tab completion here at, 98:21 well, I know when I filter out something related 98:24 to the IMDB rating. 98:26 So I have a bunch of options here, 98:28 less than, greater than, if it's in a list of values. 98:34 If it's not in let's say, IMDB rating not, 98:38 what can I say. 98:41 Filter where that value is not null. 98:46 And I can see yep that works. 98:47 So now the says find movies ordered by IMDB rating. 98:53 Give me the first 10, and filter out anywhere, 98:59 any movies where the IMDB rating is null. 99:04 Filter those out, and we get back "Band of Brothers" 99:08 with 9.6 as the highest IMDB rating. 99:15 Okay, cool. 99:16 So that was a little bit of figuring out how 99:19 to write GraphQL queries. 99:23 If we look at the next question 99:29 in the exercises, it says, 99:32 consider the business reviews application 99:35 we described earlier in the chapter. 99:39 See if you can create the GraphQL type definitions 99:42 necessary for this application. 99:49 So this is a good one. 99:49 So, the business requirements, so we said, 99:54 we're going to build this business reviews application, 99:58 where we want to be able to list businesses 100:02 and business details. 100:04 We want to have users, writing, reviews 100:09 that are connected to the business. 100:11 We want users to search for businesses 100:13 and show personalized recommendations to the user. 100:21 So those are our business requirements. 100:23 And the exercise is to 100:29 write GraphQL type definitions 100:32 that address these business requirements. 100:35 So there are a few different ways 100:38 that we could approach this. 100:42 If we take a look, I think we kind of skipped over this. 100:53 Let's take a look at learn 100:57 schemas and types. 101:01 So we skipped over, 101:03 can we see if there's a good page that documents 101:07 the SDL, 101:08 I guess SDL is used throughout here. 101:23 Yeah so maybe, I mean there isn't a great page 101:27 in the docs there that gives an overview of SDL, 101:31 but SDL, this is the schema definition language that we use 101:36 to define our GraphQL schema. 101:40 So the types, how those types are connected 101:44 and then the entry points. 101:46 And there's a couple of ways to approach this, right? 101:49 I think that, it's helpful, 101:53 we're thinking in terms of graphs here. 101:58 As they say in graphql.org here, 102:00 we're modeling our business domain as a graph. 102:04 So we can either start writing these type definitions 102:08 in SDL, but I like to think 102:12 a bit more visually and there is, 102:24 there is a tool that 102:27 I like to use. 102:31 I'm just clearing out 102:37 the previous example that I had in it. 102:40 It's not that bad we can load it with this one. 102:44 That's fine. 102:46 So there's this tool called Arrows. 102:52 I'll drop the link in the chat here. 102:54 So Arrows, Arrows is a fairly simple application 103:00 that allows us to draw graph data models. 103:06 And it's helpful, I think for just sort of 103:09 thinking in terms of graphs which is helpful, 103:14 when we're starting to reason about 103:17 our application data model. 103:18 So, this is typically where I start 103:21 with any data modeling exercise. 103:25 Whether I'm using Neo4j or not. 103:28 And this is structured to help us think in terms 103:34 of the property graph data model, 103:36 but that's not necessarily a strict requirements 103:40 as we'll see. 103:41 So let's start to think about, so I'll delete this node 103:46 and delete this node. 103:48 Arrows uses local storage, so it stores your data model 103:51 in local storage in your browser. 103:55 So if you close the tab and come back to it, 103:58 it'll still be there. 104:02 So, if we look at the requirements of our application 104:08 as well, we need to keep track of businesses 104:11 and business details. 104:12 So, okay, so I think we're gonna need a node 104:15 that is going to represent businesses and business details. 104:21 So, what sort of details are we gonna have? 104:24 Well, we'll probably have like the name, the address, 104:31 the location which might be like a latitude and longitude. 104:39 Maybe the hours, that that the business is open. 104:48 Which we might keep track of as a list of integers, 104:54 maybe something like that. 104:56 And then 105:00 we want to allow users to rate reviews 105:04 of these businesses. 105:05 So when I go through starting out to build a data model, 105:09 the first step is in my mind, I think to identify 105:12 what are the entities in the business requirements. 105:18 And those in the graph become nodes. 105:22 So here, we've identified businesses. 105:26 Now we're talking about users, so, okay, 105:28 I think we're gonna need user node 105:33 and users just have a name. 105:39 And then reviews. 105:40 Reviews are another entity that we're talking about here. 105:44 So a review, a review is gonna have what, like a rating, 105:50 like stars or something. 105:53 Maybe that's an integer, zero to five or something 105:58 and then maybe texts, that's a more description 106:03 of the 106:06 review. 106:08 So, the state of modeling, I think of 106:10 as an iterative process where I'm starting out 106:14 defining the objects, those become the nodes. 106:19 And then I start to think about how are these connected, 106:22 and those become the relationships 106:25 that we wanna think about. 106:27 So a user, user and a review, 106:29 those are definitely connected. 106:31 So, you can say that a user maybe writes 106:38 a review. 106:41 And that a review, a review is connected to a business. 106:47 So, we can say that our review, a review is a business. 106:56 The next step in the data modeling process is to say, okay, 107:02 given this data model that I've defined, 107:04 can I imagine a traversal through this graph 107:09 that answers the questions that I want to ask of it. 107:13 And so what are the questions that I have to ask of it? 107:16 Well, that's depends on my business requirements 107:19 of the application. 107:21 And in this case, listing businesses 107:24 and business details okay, sure. 107:26 I can like search for all business nodes and grab the name, 107:30 address, location, hours as details. 107:33 Okay, sure. 107:36 Is that useful enough to the user? 107:39 Well the user probably wants to know 107:42 maybe what, 107:46 what genre of business this is. 107:49 Some classification system. 107:50 So I should probably think about that. 107:55 So, maybe something like a genre property. 108:06 Now, another question that comes up a lot 108:09 in data modeling is, okay, I have some attribute of a thing, 108:15 an attribute of a node or a relationship. 108:19 And the question is, well, should I model this 108:23 as a property on the node? 108:28 Or should this be model as a node itself 108:31 with a relationship connecting it? 108:33 So, genre I think is a good example of this kind of choice. 108:37 So genre is describing the business, right? 108:42 So or maybe instead of genre that's more specific 108:46 to the movies I guess, let's call it category. 108:51 So category might be like a bookstore or restaurant 108:55 or a brewery, cafe, breakfast restaurant, diner, 109:01 that sort of thing. 109:03 So it's specific to a node, specific to a business node. 109:06 But the question is, well, should I model this 109:08 as a property of the node, or should this be 109:12 a node itself that I then connect 109:16 to the node through relationship? 109:18 And for me, the answer to this question comes down to, 109:22 well, if I traverse through this, 109:26 this new value, can I discover something useful? 109:30 If the answer is yes, that I can discover something useful 109:33 by traversing through this, a new value as a node, 109:37 then it should be modeled it's a node, 109:38 if not, then it probably should just be a property. 109:42 And categories are really good example here. 109:45 So if I store a category as a node itself. 109:51 So let's say if I have business and 109:58 category, and I say something like business 110:02 is in category. 110:06 And category has a name, which is like 110:10 grocery store, restaurants, whatever. 110:12 So now the question is, well, 110:15 can I traverse through this category node? 110:20 And in this case, a traversal through a category node 110:23 would be to other businesses, right? 110:28 So, it would be something like this. 110:36 Can I discover something useful? 110:40 And I think the answer is yes. 110:41 So, if I wanna know to this point 110:46 where we want to not just search for businesses, 110:50 but show personalized recommendations to the user. 110:54 Well, if I know a business that a user likes, 110:57 like let's say this user is 111:00 writing reviews for breweries frequently, 111:07 I can then traverse out from the businesses that this user 111:11 has written a review of 111:14 to the categories of those businesses, 111:17 and then traverse along those incoming 111:20 in category relationship to other businesses. 111:23 And I can then generate personalized recommendations 111:25 for that user, right? 111:26 So I know the businesses you've written reviews of. 111:29 Here are other businesses in those same categories. 111:33 Or I can even go out to hops further. 111:36 So businesses that are in categories that are also 111:42 co-occurrence categories with businesses that you like. 111:46 So, I can start to think of some more complex traversals 111:50 to uncover information that is useful to our application 111:55 that I really couldn't uncover if I was just modeling, 111:59 you know, like categories as a list of strings here 112:06 on the individual, as a property on the individual node. 112:09 I wouldn't be able to do that traversal 112:10 to find something useful. 112:12 So anyway, so when the question comes up is, 112:14 okay, I have some data that I wanna model. 112:16 Should it be a property? 112:17 Should it be a node itself? 112:18 If I can traverse through it to find something useful, 112:21 it should probably then be its own node. 112:33 That's sort of the iterative data modeling process, 112:38 is look at the business requirements, 112:41 identify the entities, those become nodes. 112:46 How are those entities connected? 112:47 Those become relationships. 112:50 Looking at the model, can you think of traversals 112:54 through that graph, that answer the questions 112:57 that arise from the business requirements? 113:01 If you can't, then maybe think about tweaking the data model 113:06 to be able to answer those questions. 113:08 And once you can think of a traversal through the graph 113:11 to answer all of the questions, that you have 113:14 based on the business requirements of application 113:17 then you have, I think, a workable model. 113:20 So it's really this this iterative process. 113:26 From the chat, you should turn arrows 113:28 into an integrated Neo4j product, would not be using 113:33 Neo4j with that arrows. 113:34 Yeah, it's interesting, like arrows itself. 113:38 So, APC Jones, 113:42 he is Alistair Jones. 113:46 He's, the creator of this version of Arrows 113:50 which was written many years ago. 113:53 He's now an engineering manager at Neo4j. 113:57 I think hasn't touched this version of Arrows in many years, 114:02 because it's really a simple application 114:06 but is extremely useful, I think for just being able 114:09 to diagram and reason about these data models. 114:14 And your suggestion of integrating Neo4j as a product 114:19 is a great idea. 114:23 I won't steal any thunder there, but I would be surprised 114:29 if we don't see some sorts of 114:35 diagramming model. 114:38 If you're at nodes, the Neo4j conference, 114:44 Neo4j online conference, 114:46 specifically the Neo4j Online Developer Expo and Summit 114:51 Nodes 2020. 114:54 You may have seen a talk from 114:58 my colleague, Eric. 115:00 So here's the content hub, 115:04 where he showed Cypher Workbench, 115:13 which I'll link to this in the chat. 115:15 And so Cypher Workbench is kind of like Arrows 115:19 on steroids, I guess. 115:22 So Cypher Workbench, let's look at some screenshots. 115:31 So, Cypher Workbench is this data modeling tool for Neo4j 115:36 that allows you to define these data models, 115:39 to share them, to collaborate, 115:43 to collaborate on data models as a team. 115:46 To export them as Cypher. 115:49 And then there's also a visual Cypher builder functionality 115:55 that he's working on, that allows you 116:00 to construct cypher queries visually 116:05 which is quite cool. 116:06 And this is Cyber Workbenches, a GRANDstack application. 116:10 So built on, built on top of the tools 116:12 that we're talking about today. 116:15 Any way. 116:15 So, I'll drop a link to this in 116:20 the chats 116:22 because Cypher Workbench 116:26 was demoed in that talk at node. 116:30 So, if you wanna see some examples 116:32 of more advanced data modeling tools 116:36 that are more tightly integrated with Neo4j 116:41 Cypher Workbench is a great example. 116:47 Another question in the chat, 116:49 we'll be covering Apollo Client Caching, 116:53 and things to watch out for when using Neo4j. 116:58 Yeah, that's something I think in the series 117:02 of Book Club, sections that we're gonna do, 117:06 I think because the chapters in this in this excerpt, 117:11 so the three chapters we're working through initially 117:15 these ones, 117:18 focus, I think a bit more on the backend. 117:23 So today we talked about the individual components. 117:26 Next time we'll dive more into using Neo4j 117:31 and specifically the Client drivers. 117:33 So how do we build applications? 117:37 We'll look at the JavaScript driver for Neo4j 117:41 and then chapter four, which is looking 117:44 at building GraphQL APIs with Neo4j. 117:49 So because that's the focus of these three chapters 117:53 that we're working through as part 117:54 of this Fullstack GraphQL Book Club series. 118:00 I think that we won't dive into some of the specifics 118:05 of things in the Clients like caching. 118:10 We'll definitely talk about things to watch out for 118:12 when using Neo4j. 118:13 We'll go, we'll go deeper into Neo4j, 118:15 I think than we will things like Apollo Client Caching. 118:20 But that's definitely a good topic. 118:23 In some of the other streams that we do. 118:25 So, we're building applications using GraphQL Neo4j 118:32 we'll definitely bring stuff like that up. 118:35 I don't think we've talked much about specifically 118:38 some of the Apollo Client Caching on any of the projects 118:41 we've worked on so far though, 118:42 but that's a good, that's a good one. 118:44 So I'll make a node of that topic 118:49 that's definitely something that we should dive into. 118:53 So how do I get Cypher Workbench? 118:55 Yeah, that's a good question. 118:56 I think 118:58 Eric says specifically at the end of the talk 119:02 how to get early access to it. 119:04 I think right now it's not been released yet. 119:09 I think it's currently in private beta, 119:13 with like a few dozen users or so, 119:16 but I think Eric is planning a public release 119:21 sometime in the next few months or so. 119:22 And if you watch the talk somewhere at the end, 119:26 I think he talks a bit about that. 119:29 So short answer though, I guess is try to get 119:33 on the the private beta. 119:36 Otherwise there'll be a public launch sometime 119:37 in the next couple months or so I think. 119:40 It's a super neat tool. 119:46 So, we have this graph data model that we talked about, 119:54 and we talked about this iterative data modeling process 119:57 that we go through of sort of taking 119:59 the business requirements of our application, 120:02 and identifying the entities, how they're connected. 120:07 Can we reason about a traversal to the graph 120:10 that answers our questions, if not we need to iterate a bit. 120:15 But specifically, the question in the exercise 120:18 was asking about creating the GraphQL type definitions, 120:24 necessary for this. 120:24 So, what is this a pretty picture that we drew 120:29 with arrows have to do with GraphQL type definitions? 120:31 Well, I think because with GraphQL, 120:37 we're modeling our business domain as a graph 120:40 that really, this visual process is the starting point 120:47 for creating our GraphQL type definitions. 120:50 Because now that we have this, we can then open up as, 120:53 open up our editor. 120:57 I'll just create a new file here. 121:01 Sure, it's fine, it's fine. 121:03 It's called this 121:05 schema.graphql. 121:09 And now we can convert this to GraphQL SDL. 121:16 So the SDL, we define our types. 121:20 So in this case, we're basically gonna define a type 121:24 for each of these node types we've identified. 121:29 So user review, 121:35 and business and category. 121:42 Stop and close this and grid done 121:44 with our React application. 121:48 Schema GraphQL, there we go. 121:51 And category. 121:55 And then we've named some of the fields here. 122:00 So user has a name, that's a string. 122:05 Now in GraphQL, we can define 122:11 fields as optional or nullable or non-nullable. 122:16 And we do that with this exclamation, this bang here. 122:20 So this is saying that string is..., 122:26 that name is a non-nullable string. 122:29 So every user must have a name if that makes sense. 122:36 We also define IDs, so maybe we have a user ID 122:41 that is of type required ID. 122:44 And maybe we don't have to have a name. 122:45 So when we first create a user, 122:47 maybe we don't know what the name is 122:49 but we can auto-generate an ID for the user 122:53 and that's always gonna be required. 122:57 I wrote user twice. 122:57 This should be, this should say review. 123:01 And review is gonna have a rating that is integer and text. 123:08 That's a string. 123:10 And we probably always wanna have a rating for the review. 123:16 Like we need to have some numeric value associated with it, 123:19 but maybe it's optional for the user 123:22 to add a text description. 123:27 Then for the business, I think similarly here 123:31 we wanna have a business ID. 123:33 So GraphQL has a ID type built-in, 123:37 so business needs to have an ID. 123:42 And then maybe it should have 123:45 a name, and address, but maybe those aren't required. 123:52 And then location, 123:56 we said point, but what is a point? 123:58 Well, there's no built-in points in GraphQL, 124:02 but we can define our own custom scalers. 124:05 So, let's define a scaler point. 124:10 We'll talk about what that means and how we can work 124:14 with point types later on, but for now, 124:18 think of this as a latitude and longitude pair. 124:23 And then category, categories is gonna have a name 124:28 and that's gonna be a required string. 124:30 That's gonna be something like bookstore, coffee shop, 124:33 that kind of stuff. 124:36 So the thing we're missing though, are these relationships. 124:39 So how are these fields connected? 124:44 How are these objects connected? 124:46 That's where the relationships come in. 124:47 So a user, maybe has a reviews field 124:53 and that's going to be 124:55 a list of review objects. 124:59 An individual review is written by a user, 125:04 and that's gonna be required. 125:08 We can't have review without having an author. 125:11 Similarly a business is gonna have reviews, 125:17 but that's nullable. 125:18 Some businesses won't have reviews written. 125:22 And then businesses are going to be connected 125:28 to category nodes. 125:30 So one or more, zero or more categories. 125:33 So, it's gonna be, an array type. 125:41 And then the category is gonna 125:42 be connected to business. 125:49 I can go from the coffee shop category, 125:52 find me all the businesses that are in the category 125:56 of coffee shop. 125:57 I can do that traversal in the data graph. 126:00 So that defines the data, but what about the entry points? 126:11 Specifically we need to search and list businesses 126:17 and show personalized recommendations to the user. 126:20 So those are gonna be entry points 126:22 in the special type called query. 126:30 So when our application queries, the graphical API, 126:37 we maybe want to search for businesses. 126:42 So, maybe we have an entry point, 126:46 that is something like business search, 126:51 that takes a search, maybe it's a search string. 127:00 And it's going to give me one or more businesses. 127:04 So, I wanna search for businesses by keyword, 127:08 maybe in the application as a simple example. 127:11 So search, that's a search string argument 127:15 for a business search query. 127:19 And it's gonna give me businesses as a result 127:23 of this search let's say. 127:28 And then the next one, the next business requirement 127:32 that we have is to show personalized recommendations. 127:40 So in this case, maybe that belongs on the user type. 127:44 So, a user we're going to show 127:53 recommendations 127:54 and those are going to be businesses. 127:59 So maybe something where we want to show something 128:04 like the current user. 128:09 So current user, this is gonna fetch 128:12 the currently authenticated user, is gonna give me 128:14 a user object. 128:16 And then I wanna generate recommendations, 128:19 personalized recommendations for that user. 128:20 Well, I'm gonna then query the recommendations field 128:24 on the user type, starting from current user. 128:32 Now, we haven't talked about how we would implement this. 128:35 We'll get to that in chapter four. 128:41 But in terms of the type definitions, this is I think 128:44 a pretty good starting point. 128:46 We've identified the basic data that we need 128:50 for our business reviews application. 128:52 We've thought about the entry points 128:55 that address the business requirements 128:59 that we have identified. 129:01 So I think this is a good starting point 129:03 for the type definitions and the GraphQL SDL, 129:07 schema definition language format that we want for our API. 129:12 So, let's move on to the final exercise, 129:17 which says, download Neo4j and familiarize yourself 129:22 with Neo4j desktop and Neo4j browser. 129:26 Well, we did that already. 129:28 We looked at that OpenStreetMap dataset in Neo4j. 129:34 We looked at Neo4j browser, Neo4j desktop. 129:39 Download Neo4j, well, we said that if we can just go 129:41 to neo4j.com/download, 129:46 that's the default download, is Neo4j desktop, 129:53 which we can download for free and start playing 129:55 around with Neo4j. 129:58 Check that off the list. 130:01 And then the next part of that is work through 130:02 a neo4jsandbox.com example dataset guide. 130:06 So what is that? 130:07 Well, let's go to neo4jsandbox.com. 130:13 So Neo4j Sandbox, these are hosted instances 130:19 of Neo4j that come preloaded with a dataset, 130:23 and an interactive guide that embeds queries 130:27 and images to walk us through how to explore 130:30 that dataset using Cypher. 130:33 So, I'm going to launch the free sandbox, 130:40 and I think you, you will need to sign in to sandbox. 130:43 I've I've already signed in. 130:46 The reason that we ask you to sign in is because 130:49 all of these instances that you can create. 130:53 So I have two running here, this OpenStreetMap, 130:55 one that we were looking at previously and then, 130:58 a fraud detection or tests and think fake bank data. 131:02 But all of these different projects that I can create, 131:05 these spin up, hosted Neo4j instances 131:08 that are private to you. 131:11 So it gives you exclusive access to your database 131:15 that you can connect to, 131:16 write and build applications against. 131:20 So anyway, that's why you have to sign in. 131:23 There's lots of different use cases we can spin up. 131:27 We can spin up a blink database, Twitter, 131:29 that allows us to import our own 131:32 personal Twitter data, which is just kind of fun 131:34 to play around with. 131:35 And then there are movies, I think is the simplest example 131:40 that has a smaller dataset of movies and actors. 131:45 But then there's things that show off 131:47 the graph data science library, 131:50 the Panama papers dataset from ICJ. 131:55 ICJ use Neo4j for investigative journalism. 132:00 And this is the datasets that came out of the Panama papers. 132:03 It was also I think the FinCEN. 132:05 Yeah the FinCEN files, which is the data 132:07 that ICJ released through that investigation. 132:11 Anyway, I'm gonna choose the recommendations dataset. 132:15 This is a good one. 132:16 Because we said that we need 132:19 to show personalized recommendations 132:23 in our business reviews, application. 132:27 Recommendations might be a good one to look at. 132:31 So this is spinning up 132:40 in a container somewhere, hosting our Neo4j instance, 132:44 spinning that container up, 132:46 loading the recommendations datasets and now 132:50 making that available to us. 132:53 So, I can see here if I click this down arrow, 132:56 I have the connection details. 132:58 If I wanna build an application using the drivers 133:02 that connect to my recommendations dataset, 133:06 I can see how to do that. 133:07 I just wanna open it in Neo4j browser for now. 133:11 So I'll click that. 133:14 And so this will load Neo4j browser automatically connect 133:18 to that sandbox instance. 133:20 It passes a token behind the scenes that has the credentials 133:24 to Neo4j, that's why I don't have to type in 133:27 my username or password. 133:30 And then it gives me this guide, 133:37 that has some pretty pictures and, 133:43 explanations of what's in the dataset. 133:46 It embeds queries that I can click on, 133:49 to execute those queries. 133:52 So sandbox, Neo4j sandbox 133:55 is really nice for a few reasons. 133:58 One is that it gives me a Neo4j instances in the cloud 134:02 that I can build applications against. 134:04 Comes with preloaded datasets, where I can load my own data. 134:09 But then it also has these guides that show me how 134:11 to use Cypher to query the dataset. 134:16 So in this case, this query that I ran, 134:18 this was searching for movies, 134:25 that contained where the title contains the word "Matrix", 134:28 finding all the users who rated those movies, 134:32 and then counting the number of reviews. 134:34 So there are 259 reviews of the "Matrix", 134:38 82 of "Matrix Reloaded" and 54 of the third "Matrix" movie. 134:45 Just as an example query. 134:49 So this dataset, this recommendations dataset 134:51 that we loaded has data about movies, 134:56 users, actors, and genres. 135:01 And this will show us how 135:03 to generate personalized recommendations, 135:06 using two approaches, content-based filtering. 135:09 So finding items in this case, movies, that are similar 135:15 or collaborative filtering, where we're using 135:18 the preferences of other users to find items to recommend. 135:23 It shows a couple example queries of very simple queries 135:28 that we can run to find, personalized recommendations. 135:34 And it shows us some more advanced options using, 135:39 some algorithms, and even I think some things 135:41 from graph data science. 135:46 Cool, so I won't go through all this. 135:47 I'll leave that for you to explore that. 135:50 I think that is more fun with Neo4j sandbox, 135:54 explore those on your own. 135:58 But okay, I think now we've worked our way through 136:02 all the exercises. 136:04 So that was a look at chapter one 136:09 of the Fullstack GraphQL book. 136:13 The next section, which will be next week, 136:17 so next Thursday. 136:18 So this is the regular will streaming 136:22 on the Neo4j livestream hour every Thursday 136:25 at 2:00 pm Pacific. 136:28 So next week we will pick up with chapter three, 136:31 which is a deeper dive into Neo4j. 136:36 What I wanna look at specifically though, 136:37 is how do we use the Client drivers 136:41 to build applications specifically JavaScript? 136:47 We skipped chapter two, chapter two is 136:50 a bit more about how 136:52 we build GraphQL server implementations. 136:56 So maybe we'll talk a bit more about that next time as well. 137:01 Without looking through the book again, 137:04 if we look at the table of contents, 137:07 the reason we are skipping chapter two, 137:09 is it's not included in this Neo4j sponsored excerpt, 137:14 which is okay, that it allows us to get a bit farther. 137:17 So this was the first iteration 137:21 of the Fullstack GraphQL Book Club. 137:23 I hope this was interesting and useful for folks, 137:27 thanks for sticking around. 137:29 If you miss this at the beginning, 137:33 this is the URL to download this free ebook version. 137:38 So bit.ly.fullstack-graphql-ebook. 137:46 This is a free excerpt of three chapters 137:49 of the Manning book, Fullstack GraphQL. 137:53 And we are working our way through it in the live streams 137:58 as parts of a Fullstack GraphQL Book Club. 138:02 So if you missed it and didn't get the book 138:07 for this session, you can download it there, 138:10 at that link that I shared in the chats, 138:12 and we'll pick up with chapter three next week, 138:17 taking a deeper dive into building applications 138:20 that use the Neo4j Client drivers. 138:26 Maybe what we'll do is next time, set the goal 138:29 of using Apollo Server to build a naive GraphQL application, 138:37 showing how we can manually implement 138:39 those resolver functions that we talked about. 138:43 So that then when we get to chapter four, 138:45 which talks more about the Neo4j GraphQL integration, 138:49 that we get some appreciation for some of the things 138:52 we get, get for free with that integration. 138:55 So maybe that's what we'll focus on next time. 138:58 Anyway, thanks a lot for joining today. 139:01 I think we will we will call it good there. 139:06 Thanks for sticking around and hope to see you next week. 139:11 So have a good end of the week and weekends, 139:15 and see you next time. 139:17 Cheers.