Setting Up Working with Data

[00:00:00]
>> Burke Holland: I wanna talk to you about data inside of VS Code. Let's talk about working with data, and I'll open this.
>> Burke Holland: And I think, let's see I think what we wanna do here is I'm gonna open the Start folder directly. And yeah, all right, so I made the point earlier this morning that you really do need to know about data and be able to work with data at some point from your editor.

[00:00:33]
Now, there are a lot of different databases out there. There is SQL Server, there's MySQL, there's Post Scripts, there's Oracle, there are document based databases like Mongo dB, Cosmos dB, Firebase, there's a lot of them out there. Usually databases are a black box. In other words, your code talks to it, but you can't really see inside of it unless you're using some sort of a command line tool or something to query it, but you can't see it.

[00:01:04]
There are sometimes third-party tools that you can install, like Robo 3T for MongoDB. But then you're going in and out of your editor. And depending on which third-party tool you're using, it may be to your standards or it may not. And so databases have historically been outside of the editor.

[00:01:20]
One of the things that Visual Studio developers have enjoyed for a long time is an integrated SQL Server experience. So if you've used Visual Studio before you know that you can connect to your SQL Server and you can just inspect it, look at it query it. You can even drag out and create an object relational mapping directly from Visual Studio.

[00:01:41]
Everybody else has not had this luxury. So today what I wanna show you is how you can bring in data into your development environment. So at this point we've got the dial cranked way over to the left hand side, like we are way towards 11 to the point now where we ring and bring the database inside.

[00:01:59]
So not only are we inside of a container developing in an environment that's not on our machine but we're gonna bring databases into the mix to. Now remember we just got done doing remote containers. We're gonna use them now. So in order for you to complete this project you have to have SQLite, MySQL and MongodB installed, but you don't because I've created a remote container that has all of those things for you.

[00:02:29]
So all you have to do here is, remote containers, reopen folder in container. So what I would like to do at least is, I've made some changes to this application so that when you run it and you refresh it, it saves colors to a MongoDB database that you don't have installed, but I've included it in the container so it will be there.

[00:02:54]
In order to connect to the database instance and work with it, you need to have the proper extension. So I've included for you the Cosmos DB extension. Now Cosmos DB is an Azure database, but the unique thing about it is that it exposes the MongoDB API. So you can use MongoDB API to talk to Azure, which means that you can also use it to attach to any MongoDB database.

[00:03:17]
So I'm just gonna go ahead and detach this one. And we wanna attach to MongoDB. So to do that, we're gonna say attach, and it's gonna say what kind say Mongo. And then it's want to know, the the path, the address at MongoDB. Now our MongoDB is running in a container and it's called Mongo, it's right there.

[00:03:40]
So in order to attach to it, this is how we do it. We say mongodb://mongo because that's the name of a container. Because that container is linked to the container we're in, we could say Enter. And now we are attached to MongoDB. And actually I've got a database here.

[00:04:00]
So let's delete this database and create it again. So what I'm gonna do here now is I need a database inside of MongoDB to store these values. So I'm gonna create a database and you just call it lamp. And then it wants to know the name of the collection.

[00:04:15]
I'm gonna call that colors. Now inside of our MongoDB we have a database and we have a colors here. Let's do localhost 3000 and there we are. And you can see our logs down here. Let's go ahead and remove this color picker. So I'm gonna change this color a few times.

[00:04:39]
Go Brown. Let's go cyan, green, magenta, all right. So now, what I've done is I've run the app a few times, and I've changed the colors. And because I changed the code to write to the MongoDB database, we should now have some records in said database. Let's take a look here.

[00:05:03]
>> Burke Holland: Here's our mongo, there's our lamp, here's our colors. And here are the records that have been inserted. So we can see them now. If I click on one, there's the color that I did, okay? Now, if I change this value, let's say I change it to the only, remember cyan.

[00:05:25]
And I click Save, it's gonna say, do you wanna upload this and change the database? So I can say yeah, done. Now if I go back, let's look at this one and look at this one, it's persisted.