Hyper Cloud hyper, 3 Dec 2021

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Hyper Hello World Workshop (NodeJS)

Description

Tom Wilson presents a virtual workshop for the hyper Data Service, this workshop is 1 of 3 workshops showcasing the features of the hyper Data Service API. You can follow along with Tom using your GitHub account.

Here is the workshop repository:

https://github.com/hyper63/workshops-nodejs

A

Hello welcome to the hyper hello world workshop. My name is tom wilson and we'll go through a quick hello world workshop to get introduced to the hyper cloud service.

A

In this workshop, we'll be using the data service of hyper and we'll create a document into our data service and get a document out. A json document also show you how to set up a hyper app and how to connect your node.js application to that hyper, app, we'll be using gitpod, which is a virtual environment, so that you can just literally click a link and follow along.

A

You need to know about http, json, apis or some call them rest apis and javascript, express js and node.js and get and get you need a github account to follow along for our setup, we'll create a hat, an app on the hyper cloud service.

A

In order to do this, we go to uh https dashboard dot, hyper io I'll just display that there so we're going to go to dashboard.hyper.io.

A

And then you'll log in with your github credentials, and if this is your first time here, it'll walk you through creating an account. The account is free and you get three hyper apps for that. Now I've already got some apps, so I'm going to go ahead and delete one.

A

A

All right, so we click add application and in this application, we're going to use just the data and we'll just select, create hyper app.

A

And there it is so we'll take that application, and what we want to do is copy this connection string that allows us to connect to the hyper app in our application. Now that we have that set up. What we want to do is launch this workshop project.

A

In get pod, so if you go to github hyper 63 workshops dash node.js on that repo, you should see. um You know this uh workshops, repo, and this uh got um the hello world workshop in it, and what we want to do is launch that in get pod. So the way that that we do that, if you install the get pod extension, you get a little button and you can just click on that button and it'll launch it.

A

But if you don't, what you need to do is enter in the url, a string that basically has a gitpod.io and then pound and then github.com hyper63 workshops dash node js, like that, and what that will do is launch you in and I'm already running the workspace.

A

So I can just click on that and it's going to launch me in to that workspot workspace and it's just a visual studio code.

A

And a virtual machine, so you have access to all the things that you would have in your local environment at terminal, git and docker and all of this stuff. But um we've got node installed, so we got node version, 16 installed and mpm version 8 installed.

A

So we are ready to go.

A

We're going to first open up the data hello, world folder and we're going to create a new file called dot emv, and this will have our environment variables in it and in this file we're going to type hyper, and when I told you to copy this connection string, you can click on the icon here. So I just moved back to the hyper dashboard and we're looking at our app and I'm just going to copy this connection string right here and then I'm going to go back to our environment and paste it in.

A

So that's my dot env file, it's going to have hyper equals and then that connection string, which will give us access to that hyper data service.

A

We can close out the dot emv file now and what we're going to do is run an api server. So we have this express server and it's got two endpoints a create character, endpoint and a get character endpoint.

A

So what we want to do first is go ahead and do the create character's endpoint, but we're going to use a a local sdk, our mpm module called hyper connect. So first thing we're going to do is just install all the dependencies that are already set up for us and then we'll say yarn add hyper connect.

A

Now you can use npm install as well. I prefer to do yarn. The version of hyper connect. We're using is 0.1.8.

A

And now that we have that we can go ahead and start our service. So we'll say yarn start and that should start our.

A

Our server, let's see, okay, here's what's wrong, I'm in the wrong folder, so I need to cd to data dot hello world and then I need to say yarn. Add hyper connect.

A

Cool and let's just do yarn, make sure everything's up to date and then we're gonna, say yarn start great. So now we're running our little api web server on localhost 3000, which in getpod will give us a url here and you can see when we query the root we get. Mario wiki api and the nice thing about the server is, we can just add code and save and then refresh, and we should see it there if our server is restarting.

A

A

All right so now, what we want to do is go into this, create character, file and essentially add the code for hyperconnect to send a document. That's going to be posted via that api to the hyper data service.

A

So in our api folder you can open that up and click on create character, and you can see that there's a just a default handler and what we want to do is import.

A

Connect from hyper connect and then we're going to create our hyperinstance, so we're going to say, hyper equals connect and it takes the connection string, which is an environment variable called hyper from our dot emb file.

A

Now that we have our hyper instance, we can add this document, that's coming in as request body to the hyper data service by using await, and then data, dot, add and we'll say, request dot body like that, and then what we'll do is just send the result back: okay and let's test that using our curl command. So I'm going to add a new terminal window down here and I'm just going to type curl host local host 3000, slash api, slash characters and we're going to send it as a content, type application.

A

Json and then we need to send a document, so we'll do dash d for data and we're going to create an id.

A

Character dash one type.

A

Character and a name.

A

Mario right cool, so now, if everything works well, I hit enter. I should get a result of okay, true and then the id is character. One awesome!

A

Now what I want to do is call curl, localhost, 3000, api characters, slash character, dash one, and I want to get that document back. So in order to do that, I need to implement this get characters.js file and actually make a a get call to hyper data service with that id that's coming in as a parameter.

A

So the first thing we'll do is import connect from hyper connect and then we'll create an instance of hyper by calling connect and passing the connection string from the hyper environment variable, and then we will get our character by awaiting hyper dot data, dot get and we'll pass in an id, so we'll say: request rams.id.

A

Sweet now, we'll just send the character back through the api.

A

So now, if I run my get request, I get my character document.

A

A

So that is our first workshop, where we go through and create a character, get a character and set up our hyper desktop. You can uh play around with this with some curl commands. If you want to add luigi or bowser, and then you can verify you know and um use pretty json to print that out, that's kind of nice so that you get a little bit better view of the document right, so we've got character, one character is the type and the name is mario all right. Thank you.