DigitalOcean App Platform Deployment | Building A Travel Guide With Gatsby, Neo4j, & GraphQL: Part 5

– Hey everyone Welcome to the Neo4j stream My name is Will And today we are continuing working on our Gatsby Neo4j and GraphQL Travel Guide So just picking up from where we left off last time Let’s review just where we are at this point real quick I’ll drop the link to the GitHub repo in the chat There we go And where we left off last time, so we’ve been working on this travel guide application If we look at the code, we can see there are basically two pieces to our application We have the Neo4j-GraphQL, GraphQL API And this is using the Neo4j-GraphQL JS package to build a GraphQL API, talking to a Neo4j sandbox instance or using the OpenStreetMap Neo4j sandbox instance Let me drop a link to that in the chat as well So this link will directly open a OpenStreetMap instance Looks like there might be an issue with posting in the chat Let’s restart my chat app Hopefully that helps Let’s try that again Okay, here’s the link to the Neo4j sandbox or OpenStreetMap, hopefully you get that Okay, so we have this inverted GraphQL API, where we’re basically exposing points of interest You can see we have this point of interest type here and this is running locally right now So we query that on Localhost 3003 That is an old query Zoom in a little bit You can see the entry points We have points point of interest So I can search for points of interest by name Look at the first three

I can retrieve any tags for the point of interest in this tag data, this comes from OpenStreetMap We also added pulling in data from Wikipedia So we have a Wikipedia field there that I can pull in data from Wikipedia and then we also have photos that we’ve added from Mapillary Rights and, we need to add latitude and longitude to our selection set if we want to use photos, because we are relying on our custom resolver, which we’ve defined here, to have access to latitude and longitude, to call the Mapillary API Okay, so we have that data for these points of interest Last time, we added the ability to do routing between points of interest So if I also return the node OSM ID, so that’s the ID, referencing the point of interest So let’s copy this one And now if I want to route from the Jacqueline Kennedy Onassis reservoir to the, what was this one? the conservatory water I can add that to the GraphQL selection sets And behind the scenes, we are using the graph Data Science Library Here, the shortest path algorithm, which by default is Dykstra’s algorithm to find the shortest path between these two points of interest in Central Park So we have that data in a GraphQL API that we’ve exposed And what we want to do is pull that into Gatsby So we have a separate project here, which is our Gatsby application, which also should be running, have that running in this tab here So Gatsby uses a GraphQL API to pull in all of its content and so we can see here if we look at the Gatsby GraphQL API that we have stitched in our GraphQL API that we’ve exposed from Neo4j, under this poi field So here, under the poi query field, we have the point of interest field available, which is basically just running queries against this GraphQL API So Gatsby makes it really easy if you have data in a GraphQL API to pull that in, we’re using the, look in the gatsby-config, we’re using the Gatsby source GraphQL, I think it’s called, yeah, here it is the Gatsby source GraphQL plugin to essentially stitch in our own GraphQL API into the Gatsby API, which we can then use to populate our site So we started off with the Gatsby starter blog Which is why this kind of looks like, we expect to see a list of blog posts here and we click on one of these we see details for the point of interest we selected These are the tags that we have from OpenStreetMap And then we have the data that we pulled in from Wikipedia for each of our points of interest Cool, so that’s where we left off The last session was all about efficient routing\ with graph algorithms So we took a look at cipher shortest path, we took a look at the algorithms in the graph Data Science Library for routing, so Dykstra and A-star specifically, and we took a look at the Neo map, graph app

for Neo4j desktop that allows us to visualize spatial data So the recordings are available Here again, I’ll link the GitHub repo in the chat Cool, so what I want to do today is take a look at how we can deploy our application And I thought this would be a good time to look at a brand new product from DigitalOcean that was released just a couple days ago, earlier this week called DigitalOcean App Platform So what we’re going to do today is see how we can use this new DigitalOcean App Platform service to deploy both our Neo4j-GraphQL API, and then also to deploy our Gatsby site So with that, let’s dive right in Cool, so we have our site running locally, both the Neo4j-GraphQL. API, and the Gatsby project And what we want to do is deploy this somewhere so that it’s accessible from some from some domain So we’re going to take a look at this new DigitalOcean App Platform, which if we look at the the announcement, blog post, let me link the announcement blog post in the chat there Basically, what this is, is sort of a managed solution for building and deploying applications that basically gives you platform specific containers So it looks like we can connect GitHub repositories, does some detection of hey, is this a NodeJs app, is this a static site, and then allows us to deploy those as web services, or static sites, which we can then scale up and down as we need And there’s a fixed cost with these So as as kind of a the opposite direction of serverless, where we’re sort of our costs are dependent on usage, where we’re sort of paying per invocation, looks like without platform, we have a fixed, understood cost and I guess, as we scale our application, adding more containers, then I guess the cost goes up, we’re linearly there, perhaps So I should say, I don’t know much about this service yet It just came out a couple days ago but I like DigitalOcean So let’s, let’s give it a try So I’m going to sign into a DigitalOcean account Cool, looks like Maria signed in These are my projects I’m interested in apps So like apps, there we go And it says launch your app Let’s um, let’s bring up the documentation Slash docs So if you’re not familiar with DigitalOcean, DigitalOcean is a cloud provider So you can think of something like what AWS or Google Cloud Platform or Azure, right, so Cloud Platform along those lines And I think DigitalOcean has focused on sort of developer simplicity So they don’t have as many services as AWS, right, AWS has a service for pretty much everything but if you’ve ever used the AWS console or the AWS CLI, there can be a bit bit of a overhead in understanding

how to properly use those services Whereas DigitalOcean’s approach, I think has been, you know, let’s, let’s limit the number of services, number of offerings that we have but let’s focus on just really a dead simple developer experience So a very user friendly to use cloud services This maybe a way to think of DigitalOcean So I think when I first started using DigitalOcean, the only service they had were Droplets, which were, which are sort of VPS So virtual private servers They’ve since added several other services, including, you know, Block Storage, Kubernetes So we can, we can create Kubernetes clusters on DigitalOcean They now have a Managed Database service and then the newest product that they have, as of this week is App Platform Cool from the chats, what a coincidence, actually planning on setting up Neo4j today, great to work with my Flask app on DigitalOcean Flask running just we need setup and connect it’s Neo4j Cool, great Yeah, I think for development, you might want to think about initially just connecting that to Neo4j sandbox Which sandbox instances only live for initially, three days, you can extend them up to a week, I think but it’s an easy way just to get started And then Neo4j Aura is a manager Neo4j service that you might also be interested in, that allows you to basically just click a couple of buttons and then have a Neo4j cluster deployed and managed for you Later on in the stream, I think we’ll take a look at how we can deploy a Neo4j cluster ourselves Maybe maybe using the DigitalOcean Kubernetes Service, that might be something interesting to look at but for today, we’ll focus on deploying our GraphQL application and the Gatsby site since we already have the Neo4j instance that we want to use in Neo4j sandbox Cool So with App Platform, if you look at the Quickstart here, basically what we do is pointed at a GitHub repository, does some inference then to figure out what what type of project we have, we can scale it, deploy it, set up a custom domain, and so on So there’s lots of different languages and frameworks We can even just write our own Docker file, if we want to deploy that Let’s look at concepts So we can come back to this if we need to but I think basically what’s going on here is our application is getting its own container, or maybe multiple containers here And we’re sort of configuring how we want our application to be built Yeah, and and as you’re pointing out in the chat, Abdul, yeah, they only support GitHub currently I saw though the the the plans are to add GitLab and other hosted get services as well So I think that’s, I think that’s on the roadmap I’m sure there are, you know, some initial features they wanted to, to roll out but since this, you know, just launched a couple days ago, there may be some things not quite included yet So we’ll see, see what we can, what we can find today Okay, so there’s the docs if you need to check those out, but let’s go ahead and launch an application And so let’s see, I can choose a repository I’ve already connected my GitHub user, so that’s cool I can dig into that

Let’s let’s maybe let’s choose a demo application to launch here initially, before we try to deploy our Gatsby project, just to see how this works So we’ll choose the NodeJs project, give it a name, choose a region As soon as is pointed at some template GitHub project yep, NodeJs, okay, cool That’s the web pack you’ll use, I guess, with a, to build, whats the right terminology there , the BuildPack That’s (indistinct) Right , so the BuildPack defines the language and framework and how it gets built Many of which came from Heroku It make sense Okay, so a web service or static site, this is a web service, you can pass environment variables Build Command, we don’t need to worry about I can got going to connect database Give that a deploy So because this is a web service, it’s not on the free tiers Looks like the free tier is just for static content, okay So it’s gonna be basic We can just do one container, we can choose the size of the container Let’s choose the smallest and give that a deploy So this is just going to deploy whatever the sample application is While this is building, let’s take a look at the logs So notice, BuildPack, installing some packages and building a Docker container, it looks like What else do we have look at here? So on overview So we can look at some metrics once it’s deployed Insights I guess, these are the metrics Yeah, but we don’t have any data for since it hasn’t been deployed yet History of our deployments No runtime logs, because we’re still deploying, yep No Console Okay, the Components So Scaling, so here, I guess we can add more containers, Environment variables, Http routes we want to expose Oh yeah, the Health Checks Yeah, so the health checks This is important, I guess, when we have multiple containers so when we’re scaled horizontally, I guess we have multiple containers, there’s some load balancer here, that’s sending health checks to the different containers to make sure that the container is online and healthy before sending it a request, which makes sense The commands to build and start it and then the HTTP port So this is going to be whatever port our service application is listening on This is going to be routed to 443 or 80 for the public requests Okay, it says it’s deployed Let’s take a look So we get our own subdomain on the on DigitalOcean.app domain Cool So I guess this is going to be specific for each one of our deployments, which is nice So other services have this this sort of preview deploy, where we can trigger a deployment on based on some pull request, or maybe some specific branch, and then share that with our boss or with with someone who doesn’t want to build the whole application just to see how it works The other thing that’s really nice here is we we get the certificates managed for us so you get an HTTPS.end points Yeah as as you’re pointing out in the chat, Abdullah, very similar to Heroku Okay yeah It’s good observation So this app is looks like it’s generating random words

If I if I refreshed, I get different contents no Okay, cool We can now that we have it running, do we see runtime logs? Yes, so there’s the app starting, some ASCII arts and then the logs if you go to the console, and here we can see, yeah, there we go So this is basically giving us a terminal in the container We can take a look at the readme Yeah, so this is how to deploy this as an app Can we look at the code? So app.js, index.js Let’s see what this is So this is an Express app Mounting some logging And index router There’s also a user’s route that’s commented out Okay, so the index router Where does that come from? Routes index Routes Index.js Oh, yeah, here we go Here’s our bunch of functions to randomly generate somewhere words Oh yeah in the schools We have a list of adverbs., adjectives, verbs, okay, cool And so we’re sort of randomly selecting from like, noun, adjective, noun, adverb, verb kind of thing for sentences Okay, that’s clever Cool Okay, so neat Let’s deploy our Gatsby application So let’s create app, choose a repository So I’ve already authorized GitHub So I have it in the central-perk repo And you can call it central-perk Region is fine There’s only one branch Auto Deploy code changes, this is really nice So this allows us to do sort of GitOps where we push up something to GitHub in this case, and then that triggers a deployment Cool, that’s nice Okay, configure your app App detection failed, we’re sorry that weren’t able to detect anything with the app platform concurrently run in the repository you selected Please try a different repository Okay, so I think what’s going on there, if we look at our code, if we look at our code here, we kind of have two separate applications in here, right? So the, the terminology for like what you would call this as I guess, a mono repo, where we have one repository that has our Neo4j-GraphQL API code So this is an NodeJs-Express application Well, NodeJs application at least serving a GraphQL endpoint And then we have kind of a separate project that is our Gatsby project So it looks like we can’t point at a specific folder and say, hey, deploy this separately, but instead, we need a separate repository So let’s break these out into two repositories I guess we could also, if we look here for what languages and frameworks are supported, I guess we could write our own Docker file and use that to deploy both of these maybe but don’t want to do that So let’s create a new repo And we’ll call this central-perk API and upload existing file

Ooh, can we just be lazy and do this from the web? Let’s see JS files Central-perk Gatsby site Just is I guess I don’t have a read me That’s fine So I’m just pulling out our Neo4j-GraphQL project from inside our mono repo Which knows up Commit failed, oh no What happened there? GitHub central-perk We can’t just do it from the web UI Not sure I’ve never I’ve never actually uploaded files, ever uploaded files like this and GitHub before Okay, cool That worked Let’s add a readme Add some content to that later That’s fine Yeah, I see some discussion in the chat about Heroku Yeah, definitely use Heroku before for lots of projects, pluses and minuses there yeah Okay, so do we need to do anything else here to try to deploy the API part of our application? I don’t think so I think we can go back to DigitalOcean and try a different repository Let’s see Does it find? Let’s, let’s start this again So maybe it needs to refresh, my GitHub repos Since I just created a new one Actually, what did I call it? Central-perk API Give it access to all repos, yes Central-perk API So just fiddling with the GitHub permissions there Okay, there it is This is the one I want to deploy Region, actually what regions are available? Okay, so New York or a couple in Europe Okay Main branch, Auto Deploy Yes, we want to do that Okay, so now it says, this is a NodeJs app Web Service Yes, since this is going to be a GraphQL API And now we do need to add some environment variables So if we look, here, we have some environment variables to connect to need are Neo4j sandbox instance So we want, Neo4j URI is this And then for Neo4j user, let’s create a read only user, so I’m going to switch to our sandbox instance and jump into Neo4j browser So the user that we get here in the sandbox UI and our connection details This is an admin user but let’s create a read only user so that when we deploy this,

someone can’t mess around with our data So colon server user add What should we call this? Let’s just username OSM for OpenStreetMap And we’ll give it just the role of reader So the only thing this user will be able to do is, is reading data from the database So if we go to Neo4j user is OSM, Neo4j password is OSM and then the Mapillary key is this So Mapillary key we’re using to fetch photos from the Mapillary API Build Command, there’s no build command since we’re not using any transpolation or anything NPM start I think, if we look at package JSON, NPM start, now this really be start dev or something So we’re doing nodemon Nodemon is good for watching So if we’re, if we make some changes to a file, it will restart but we don’t need to do that Here, it can actually kind of slow things down for a deployed app So we can just do node index.js, and then the HTTP port So this is the port that our GraphQL server is listening on that then gets routed to the requests coming in 443 or Port 80, that the load balancers is taking care of I think we hard coded this in our application Yeah, so we hard coded this, to listen on port 3003 So we will listen on port 3003 Okay, I think that is all the configuration we need to do So what’s the difference between basic and pro here? So per minute application metrics, okay So if we do pro we get more metrics, horizontal scaling, so I’m guessing, adding containers, high availability So if we can have multiple instances of our container, and then it’s highly available, because if one goes down, the load balancer will route to the other one, okay Oh, yeah, let’s go ahead We’ll, we’ll take this down in a second Let’s go ahead and select Pro and, sure, let’s go., let’s go all out and we’ll set up three containers that are going to serve our API, why not? Okay, so take a look at the logs We got the environment variables, installing some packages and uploading our Docker image Okay, it’s built our image While we’re waiting, is there anything in the docs about the architecture that this runs on? I’m curious I imagine there’s some sort of Kubernetes architecture under under the hood here that’s supporting all of this Oh, there’s also a command line tool

That’s interesting Doctl Cool So we can create our apps from the command line as well It’s nice, It’s handy But what did I say? I want to know how this runs under the hood I guess this is a good point So when should I not use that platform? App Platform is optimized for ease of deployment That makes sense, rather than deep customization of the underlying infrastructure If you require more control over your production environments, think about using DigitalOcean Kubernetes, which we talked about, or your own droplets, your own VPS Yeah, okay Makes sense Just a minute, so okay, cool See if that’s deployed Deploy successful Okay, cool So here’s the URL for our graph. qL API Take a look at GraphQL playground we have interests, name, type, location Great Cool So that works Excellent The next thing we want to do is deploy our Gatsby site and point it at this API I guess we need to create a new app to do that And we need a new GitHub repository So I don’t think our I don’t think our mono repo approach is going to work with App platform, at least for now That’s fine We can create central-perk-gatsby And can we upload our files again? Let’s let’s try this because because I’m lazy I don’t want Some of these are I don’t want to check in node modules Some of this is built as well Yeah, let’s not be lazy Let’s let’s do this on the command line So let’s copy Gatsby site to a new directory We call this central-perk-gatsby Copy that out of our mana repo and then we’ll create a new Git repo locally, make a commit and then push that up to our new GitHub repo And then we should be able to deploy that on App Platform So it’s interesting if looking at app platform, if you look at some of the other similar services, you know, folks are comparing this to Heroku, which I think is a good one, if you look at some of the newer services like Netlify, or Percell, which are very much focused on certainly static content, for sure, we can deploy static sites on Netlify and there’s a Netlify CDN but we can also do serverless things as well So With Netlify functions,

we can deploy serverless functions In one of our previous projects on the stream, if you remember, we deployed this on Netlify This was Willow which was our real estate search app And we deployed this on Netlify using a lambda function for our GraphQL API, which is in here Source functions Right So here, we use Apollo server lambda, to do this on Netlify, which doesn’t allow us to deploy arbitrary containers but does give us the ability to deploy functions So in this case, we’re deploying a container on App Platform, which is serving express app So I wonder, I wonder how we could do sort of the equivalent sort of Functions as a Service on DigitalOcean, I guess I guess, that doesn’t fit into their current product offering Maybe maybe I haven’t looked at that enough Anyway, okay. we’ve copied those files So let’s CD to GitHub at Montana, central-perk-gatsby, create a new Git repo Add everything, git commit Initial commit And connect that to GitHub And push it up And there it is on GitHub So it still has the readme for the blog starter It’s fine Okay, cool So now let’s jump back to App platform Create app And oh, yeah, I need to change GitHub permissions because I only gave it access to one repository Let’s add central-perk-gatsby And let’s deploy a central-perk-gatsby Regions fine name is fine Auto Deploy, there’s only one branch Great And cool So Gatsby detected So if we look at the docs, languages and frameworks, I guess Gatsby is one of these BuildPacks that it has Yep So it knows how to build Gatsby sites out of the box That’s nice Okay, environment variables Do we need to set any environment variables? Well, if we look at our Gatsby site and in Gatsby-config Here, as I mentioned earlier that we’re using Gatsby source GraphQL plug in, to stitch in the Neo4j-GraphQL API And we just have that hard coded here So we want to change this to an environment variable that we can specify via an environment variable what API to pull in Let’s, let’s just change this on GitHub Let’s make this easy And gatsby-config Edit And here we want this to be process.env Let’s call it

Neo4j-GraphQL API So then variables will specify Neo4j-GraphQL API, and that is going to be this URL It’s important to note, I guess that this URL is is specific for this deployment I’m assuming if I do a new deployment, I get a different URL with maybe where this hash changes So we should think about setting up a custom domain for our API So that this will live through multiple deployments I know I’m just assuming that’s that’s specific to this deployment, you want to check that but anyway, I think that’s the only environment variable we need So let’s go ahead and deploy this static content is free That’s nice Up to one gig, outbound, and oh, and 100 build minutes Okay Cool Launch that Okay, so that’s running, we can look at the logs and watch it, build up these That’s the runtime logs, here’s the build logs It’s gonna install a bunch of packages and build our project While this is building, let’s take a look in the console at our API application And let’s see what we can see here So we look at the insights see what kind of metrics we get Let’s narrow this down a bit So the last hour, you can see, so remember, we deployed three containers So we have three instances, central-perk, central-perk API, zero, one and two So three containers, hosting our applications So there’s a load balancer somewhere that is routing requests, assuming some sort of round robin So that’s, that’s a nice way to scale our GraphQL application Ingress Bandwidth Average latency I guess, there’re not many requests coming in But that’s neat Okay, let’s see if our Gatsby app is built yet Central-perk-gatsby still building Okey doke Back to our API Okay, so we looked at the insights, deployments, or history of deployments, the logs So, it looks like it’s taking the logs from each instance and just dumping those all in here I guess we what we should have done is started this in dev mode So we can see the generated cipher queries Let’s see We can set that up to work So the way that we enabled dev mode is by setting an environment variable Where do we set our environment variables? Deploy settings is that in deploy settings? No Domains, oh this is how we change them APP spec

Yeah, so here’s our, with some YAML oh, this is the actual configuration Okay, how do we edit that though? Use to edit Advanced Settings How do we edit that? Manage components? There we go Okay So for environment variables so we gonna we say dev equals Noe4j-GraphQL.jsjs And that will enable debug mode for Neo4j-GraphQL.js And that will then log the generated cipher queries for us, at least This is something we can see in the logs and changing that looks like triggered a new deployments Cool That’s while that’s deploying so my question is, is this still running? Oh, yes, tags needs key and value So, yeah, so it’s deploying a new a new instance of our application but our old one still lives on while that’s being deployed Good That’s what we want Okay, let’s check in on Gatsby We look at deployments Got an error okay What is the error? Cannot query fields on type markdown remark Well, markdown remark This is the markdown processor that we aren’t using anymore So we started with the Gatsby Blog Starter, which was pulling content from markdown files We took that out So we shouldn’t be querying anything related to MarkdownRemark I thought we had taken all that out Oh, Gatsby, plug in feed Oh, okay So Gatsby plug in feed, I think is what is generating our RSS feed? Yeah, so Gatsby plug in feed is going to generate an RSS feed for our application And the reason we weren’t getting this error when we were running Gatsby develop locally, I guess is this probably only is touched when we do Gatsby build Yeah, plug in, only generates the XML file when run in production mode And we haven’t run this in production mode yet So that explains why we didn’t get that error Let’s just remove this because we don’t don’t need an RSS feed, since we’re building a travel guide So let’s go ahead and remove this, we’ll just edit this in GitHub directly since we can do that Gatsby plugin feed If we just delete this from gatsby-config, I think that will address our issue We also test if that triggers a new deployment Yep, cool It triggered a new deployment Cool let’s check on that new deploy of our API So we updated app-spec Yep So we enabled debug mode Oh, interesting We don’t get a different URL doing this This stays the same central-perk API 7ndn8, 7ndn8 Yeah, interesting Okay, so I was wrong I was thinking we would get a new URL for each deployment But looks like we don’t Okay, that’s fine So if we take a look at the logs we should see a couple messages here saying that graphical API is ready listening on port 3003

but then as we run GraphQL queries, the Neo4j-GraphQL.js library that that’s sort of the core library that is running our GraphQL server, which is doing two things, really One, I guess is it, it augments the GraphQL schema So when we go from the GraphQL type definitions, we take a look at the code here, or our object GraphQL API We go from these type definitions, which can include some fields where we’ve attached a cipher query to add custom logic with the cipher schema directive So here for Wikipedia, this is kind of fun We’re using a cipher procedure, apoc.load JSON to go out to the Wikipedia API to grab some data for that point of interest so some custom logic but basically, we don’t have to write any resolvers for data that we’re fetching from the database So when we’re searching for points of interest, by location, type, and so on, you know, the only resolver we wrote is the one to call it to the Mapillary API So that make augmented schema function from Neo4j-GraphQL.js is taking care of all of the logic for fetching data from the database So the the main backbone of our graphical API is this Neo4j-GraphQL.js library Anyway, what we want to see here, let’s maybe refresh this log view, what we want to see here, now that we enable debug mode, is the generated cipher queries for each request each GraphQL request that we make So that library is translating these GraphQL requests into data fetching code, and cipher that then hits Neo4j It’s like, we can’t see the logs right now We’ll come back to that in a sec It’s fine So is Gatsby still deploying? Or did we did we encounter an error? So the first one errored out That was the RSS feed plug in that was trying to access some fields that we had removed since we switched to all the content being populated from our Neo4j graphical API instead of from markdown files And we’re still building the new deployment Let’s see where we are in that process Cool, looks like we’re done with that and we’ve generated our static content Now it’s like this is , our static files are being uploaded to the CDN, which I’m assuming is CloudFlare Cool so that should be online soon Let’s jump back to our API application Take a look at those logs Okay, so we might not be able to see the logs there Let’s check in on the Gatsby deploy Core still uploading our static content There we go So we generated 481 files Most of those are the HTML for our individual point of interest pages Okay, so we are online Deployed successfully We have our own subdomain Here’s all of our list of points of interests We select one, we see cooler photo for Mapillary, our tags that come from Neo4j, which come from the OpenStreetMap data set, and then pulling in data from Wikipedia Cool So that’s, that is our application That’s what we want to see

Great So we deployed this using DigitalOcean app platform We had to deploy two applications here since it didn’t look like we could use a mono repo If anyone knows how how to use mono repos with App Platform, let me know and we can update our deployments to use that But we deployed one application that was our GraphQL API And then the other is our Gatsby project with our static content, pulling in content from that GraphQL API Neat Let’s see What else do we want to do? Oh, I guess it would be nice to have a custom domain How do we set that? So instead of central-perk-gatsbyondigitalocean.app, maybe we want I don’t know, like central-perk.grantstack.io or something like that How do we set that up? We go to Settings Components Some settings, I’m sorry Oh, yeah. domains and certificates, cool Add domain So domain and subdomain, we want this let’s say centralperk.granstack.io And it tells me to create a CNAME record on my DNS provider I think, I think grand stack We have set up on Netlify for the DNS provider So let’s add that domains Yeah, grand stack, DNS record In order to say it said add a CNAME alias So central-perk is the sub domain and then the value Where was that? That was us here C, CNAME alias we want So create that and then add the domain So now let’s try that centralperk.granstack.io on 1001 It’ll take a few minutes for the website’s information to be distributed Yeah, fair enough We’ve just created this DNS entry So we need to wait a second to populate? Cool Well, that I guess is a quick look at DigitalOcean’s new App Platform Anyone has any suggestions for something else to look at here with the the App Platform? Feel free to send any ideas but I think we got I think we accomplished what we wanted to So we deployed our GraphQL API application and we deployed our Gatsby application pulling in data from the GraphQL API, which I think is that’s what we wanted to do for today So yeah, let’s let’s wrap it up there We deployed our application, we set up a custom domain and now we can share that with the world Next time, I do want to get to adding some maps to our application, both here on the Index page and then for each individual page, just to show where it is in Central Park and then take advantage of the routing functionality that we added last time So now that we know how to deploy our application, I think that is the big missing feature,

missing functionality that we want to add, which we’ll take care of next time, looking at map components If anyone has an opinion on what map components for React to use or for specific to Gatsby, if there’s some map plugin for Gatsby, specifically, I’m not sure We’ve used previously a couple of different wrappers I guess, React component wrappers around the matte boxes, Web GL, Matte box GL.js but if anyone has any opinions for looking at a different React based map component library or mapping specific to Gatsby, let me know Ping the ping me on Twitter which my Twitter handle exists on the screen there, @lynwj I’ll drop a link to that in the chat So definitely let me know what map component you’d like to explore And, and we’ll pick that up next time Cool So thanks for joining today and we’ll see you again next week So we do these streams live every Thursday at 2:00 pm Pacific I should point out, it’s not just that time there That’s my time slot specifically but there’s some other folks that stream on the Neo4j Twitch stream, you’ll find our schedule there Yeah, here’s the schedule So if you go to our Twitch stream, if you’re watching on YouTube, and on Twitch stream right now, you can see the schedule We usually have Adam looking at building applications with Neo4j, Lu who tends to look at digging into specific datasets and covering some of the, this weekend you have J articles and then Michael, on Wednesdays digging into all kinds of various topics I think the the last thing Michael looked at was the finCEN files in the Neo4j applying some graph data science algorithms to them Certainly check out some of those other time slots on the stream You can find all the recordings on the YouTube channel Neo4j as well which I will also link Cool, that’s all from me today We’ll see you next time Bye bye