Connecting Cellists Globally Fullstack with Python, D3.js and Cloudinary | Cloudinary

Connecting Cellists Globally Fullstack with Python, D3.js and Cloudinary

In classical music, knowing the people you have trained with has a lot of value! This is why Cori Lint, software engineer at Ovia Health, developed Cello Tree – a directory of cellists to show their relationships to each other.

Becky and Jen on Cloudinary’s Customer Education team sit down with Cori to learn more about the project and its underlying technologies, which include Python, D3.js and Cloudinary. If you are looking to develop a side project about your passions, this is definitely a DevJams episode you won’t want to miss!

Becky Peltz: [00:00:00] Hey, welcome to Cloudinary DevJams. I’m Becky Peltz, my usual partner in this endeavor, Sam Brace, isn’t here today. Instead, I’m joined by Jen Brissman, our developer education instructional designer and more. Fun fact about Jen is that she was a guest on this show last year, and now she’s co-hosting. So I’m going to let Jen introduce our guest, Cori Lint, because they attended bootcamp together. So Jen?

Jen Brissman: Yes. Hi, thanks for the intro Becky. Welcome to Cori Lint. We went to Hackbright Academy Boot Camp together and now we have her today on the show, now as a software engineer at Ovia Health and she’s going to be talking about a project she built called Cello Tree. We’re so excited to have you, Cori.

Thank you so much for being here.

Cori Lint: Yeah, hi. I’m so excited to be here and it’s really fun to be here with Jen and also Becky, I met you more recently, but thanks so much for having me on. [00:01:00]

Becky Peltz: Oh, you have a wonderful project and I know you guys are in Artist Who Code. Maybe you can say a little about that.

There’s probably other artists out there that might be interested.

Jen Brissman: Yeah, definitely. Artists Who Code is a community that Cori and I are in, and Cori is actually, her role is Director of Artist Who Code. And I’m the Director of Mentorship at Artist Who Code. And this is a cool segue into the project we’ll be talking about today, because Cori’s app is called Cello Tree, and this is probably because she’s a cellist and also a software engineer.

So Cori, if you want to introduce yourself a bit and also talk about your history as an artist and also what prompted you to get into software engineering. And then we’ll get into your project.

Cori Lint: Sure. Yeah. I guess starting way back when I was a child, I started playing piano and cello and my whole family are either professional or amateur musicians.

So it was just kind of something we did. And as I grew up, I guess I was good at it. I was [00:02:00] successful in it. I also had a lot of other interests, but it just happened to be the thing that I pursued. I loved it. It was fun. I went to University of Michigan, got my cello degree there.

And then after a few years of freelancing, I got to play with some amazing people. Had a lot of fun doing that. I worked on cruise ships with a string quartet for a while, so it took me literally all over the world, which was amazing. And then after a few years, I was in my mid twenties and I was like, I really want that steady paycheck, slow life down a little bit, have a bit more stability.

So I went into the other side of the business, which was administration. So I got into specifically orchestra administration. Also got to work with some amazing people, some amazing orchestras, including the Cleveland Orchestra and the Florida Orchestra. And all throughout this time, I was still playing cello as well, so it’s definitely stayed a part of my life.

And then as far as how I got into software engineering, it’s funny cause it was right before that pandemic time, where a lot of people [00:03:00] started reevaluating their life plan and what they were doing. Especially people that were in the arts world who suddenly, their work just was gone.

A lot of people are like, I’ve never thought of what else I would do. And I had about a six month start on that. So I was a bit just burned out by the orchestra industry. It’s a lot of work. It’s like every day and the pay is not great. The industry is a bit like slow, in the way that software is very like innovative and moves quickly.

The orchestra world is almost the opposite of that, at least that was my experience. And sometimes it was a bit frustrating and I was just ready for a big change. So I looked at a bunch of different things, but I had a friend who had learned software development and had a really successful career just through free online programming, like freeCodeCamp. Big shout out to freeCodeCamp.

So that’s actually where started, yeah. Yeah. An amazing resource and actually has been developed so much more even since I used it. But that’s where I started and I was like, hey, this is actually kind of [00:04:00] fun. And I feel like this actually really suits, like how my brain works . And it’s also strangely enough, even more creative in some ways than doing music.

That was a circuitous route to where I am now too. So I, I started just learning on my own. I got a web development job, so just spinning up websites, mostly WordPress based websites where we would do a lot of customization. This was for a marketing agency.

And after doing that, I was like, I’m really interested in like what’s happening behind the scenes, what’s happening with this data when I submit this form, what’s going on back there that I just sort of take for granted that happens auto magically, as people at my company like to say.

So I decided to go to Hackbright Academy, as Jen mentioned earlier. It’s a coding boot camp that’s focused on gender diversity, which is really cool thing about it. And it’s based in San Francisco, but I attended the virtual option and yeah, finished that. Did a lot of algorithm drilling and studying and job applications and after a few months, [00:05:00] I ended up at the job where I am now and I’m coming up on my one year anniversary there.

So, congratulations. Yeah, long journey .

Becky Peltz: Thank you. Yeah. Now that’s wonderful though, how you took an interest and then you pursued it online and then now you’re actually, it is your profession, so yeah.

Jen Brissman: Absolutely. Well, Cori, tell us a little bit about yourself as a developer and the languages you work with now versus maybe the first ones you learned.

Cori Lint: Sure, Yeah. The very first ones I learned were at this first job I had. And you know, WordPress is based on PHP, so that was actually my first exposure to PHP, which I now use in my job. But I was really more focused on front end. So just enough JavaScript to make things work.

It was a lot of learning on the job, so JavaScript and a lot of CSS as well. And when I went to my coding bootcamp, I learned a bit of SQL with this job too. But coding bootcamp, we really got more into SQL, our main focus was Python, and then we used Postgres and we used the [00:06:00] Flask, framework for Python.

So all of these things like interact together really nicely, especially with SQLAlchemy, which we can talk about later too. But that was my stack there was basically Python, Flask, SQLAlchemy, and now, yeah, back to PHP. So full circle, I guess.

Becky Peltz: That’s awesome. Yeah. That’s a good language to learn.

I mean, given that, you know, WordPress is like, I don’t know, is it 40% of all of, that’s what they say? Definitely a good thing to know.

Jen Brissman: One other question I was interested in is how you learn and just if you wanted to share the way you learn best.

Cori Lint: Sure. I would say at work, so I came in as sort of a traditionally what would be a software engineer one or a junior or even apprentice type employee. So it was expected that I would learn a lot on the job, which is amazing and I have the perfect environment at Ovia Health to do that.

But I would say I probably learn [00:07:00] most from direct feedback like we require two code reviews on all of our PRs. We’re supposed to review two PRs to every one PR that we put up, that kind of thing. So I would say it’s a combo of direct feedback on my work, which I try to apply and just build on every time.

If I get feedback about one specific thing in this PR the next time I try to remember that, and then maybe I’ll get more feedback, just continually building on that, the 1% better thing. And then also seeing feedback on other people’s code, I mean, sometimes the code of senior engineers feels a bit over my head or it’s just I have to like, learn a whole system to like even figure out what’s going on in their PR and that can be a bit daunting. But the strategy that I’ve taken more recently is just to get in there and start asking questions, like what would I ask if I were working on this?

Like, why is this happening? Why did you use this instead of this? And those kinds of things. And that’s been a huge help in my learning [00:08:00] too.

Becky Peltz: I think on the job learning for coding is really the way to go. It’s because you’re going to get exposed to so many different ways from your different coworkers, and it’s stuff that works and it’s in production and it’s just a really good way to learn.

Cori Lint: Yeah. Yeah, exactly.

Jen Brissman: Absolutely. Well, I think that’s a great transition into talking about your project because your project is something you built solo. You weren’t working on a team. This was Cori’s project. Cello Tree is your baby that came from your brain, and we’re really interested in hearing about it today.

So let’s talk about it. Tell us a bit about it.

Cori Lint: Yeah, it’s funny that you mentioned that this is my project, it was all me, because it’s so different from the enterprise code base that I work on now, and I’m sure every coding boot camper experiences this. The move from this like tiny little thing that you think is, is everything like this full stack project to this code base that’s just like absolutely monstrous.

It’s just such a different experience. But, so yeah, just to introduce [00:09:00] Cello Tree, which I often describe as like the nerdiest project ever, but I say it in an enduring way, like I love this stuff. So I am a cellist, I play cello and I had the idea to create a family tree of cellists and spoiler alert for later, I wasn’t the first person to think of this.

But I hadn’t heard of it before. When you’re going through the classical music education, who your teacher is, is probably the most important credential there is. Maybe even more than where you went to school, because really you go to school for the teacher. I went to University of Michigan for my teacher, Professor Elliot.

So, sometimes, it’s as specific as like a certain way that a person is holding their instrument can identify like which teacher they worked with that has huge influence on how they play and even their career and things like that. So, my teacher, Tony Elliott, would always talk about how my cello grandfather was Janos Starker.

[00:10:00] And most people in the classical world would know that name. He’s like an iconic cellist. Lots of stories about him smoking cigars during his lessons and things like this, like just absolutely iconic. So my teacher would always refer to him as my cello grandfather, and that sort of stayed on my mind.

And I, I always thought that was kind of funny. And then I also worked for this cello festival in Dallas called the Lev Aronson Cello Festival. Just this amazing story of this cellist who, basically was forced to immigrate from Europe. He lost his family, he lost his cellos in the Holocaust.

Terrible story. But he came to Dallas of all places and quickly became the principal cello there. And his students went on to be some of the most like successful cellists of the 20th century. And he just had great influence on generations of cellists afterward. So this really just stayed in my mind of his legacy idea, like who we learned from, and I’ve even heard that in other professions.

[00:11:00] The medical profession there, there’s a similar like lineage type of thing. I just thought, how fun would it be to see if like Yo-yo Ma is like my cello cousin or something like that. So that was the origin of the project. I visualized having this giant like family tree that you could like click around and stuff and yeah, I still have this idea in my mind where it started and then of course, what it looks like is never what you imagined.

But I think I did a pretty good job executing in the end.

Becky Peltz: Oh, you have some really interesting things in there so.

Cori Lint: Oh, thanks.

Jen Brissman: Yeah. Yeah. So this idea that was in your brain, you visualized it and then now you built it. So can you give this a preview? Show us the functionality?

Cori Lint: Yeah. Yes. I’ll take you on a little tour.

I have to just, I have to just give the disclaimer that this was a student project, I built it all myself. A lot of these things I was just learning. So no judgment on [00:12:00] those kinds of things. But like I would love some rounded corners in here, but it’s fine. So I guess this is the mission statement.

Discover your cello family, honor their stories, connect with the community. That was like the whole idea behind it. Like I mentioned, the family tree was like the core idea here. It turned into something else, as well. So these are all of the cellists that I have in my sort of fake local database, when I built the project. Oh, there’s me.

In here, if you want to go in and search my professor that I mentioned, Tony Elliott. You can just search him and he comes up there. We can go look at his profile. So yeah, whereas the tree was the initial idea, it also became like directory of cellists almost.

So, obviously we have some info about Mr. Elliot here, including about his cello because cellist instruments are like a really important part of their sort of identity as a musician. We have the tree, which I’ll maybe come back to in a little bit because I think that’s the most interesting, [00:13:00] little bio section.

This forum, which is really just like comments. So I can add like, this is my teacher, and add that comment and it dynamically renders, and then I can go in and upvote some other comments.

Becky Peltz: That’s a great insight into the world of cello, in addition to, with a lot of interesting components here.

It’s just neat to see what are the details that are of interest to cellists.

Cori Lint: So, exactly, exactly.

Becky Peltz: You’ve got a lot here and so you’ve got some multimedia, you’ve got images, and I see a listen now. Mm-hmm, are you using Cloudinary here?

Cori Lint: Yes, I am indeed. So all of my image storage is through Cloudinary, and I can walk you through how that works too in a bit.

When we look at the code, but yeah, that was a great asset to the project. And then this was my MVP version, where it’s just a link, a hyperlink. Okay. But someday I would love to [00:14:00] have this be like a Spotify widget or something like, that would be really cool.

Oh, yeah.

Becky Peltz: Yeah, yeah. Well that tree is really neat and I know you’ve got a lot going into that. Are you going to talk more about that?

Cori Lint: That’s really, yeah. Let’s talk about that. So I guess I’ll show you from a user perspective before I get into like the technical aspects, but so this is obviously the profile that we’re on. To the left is teachers, to the right is students.

And I would like to represent that better someday. Actually this is my cello grandfather that I was talking about. You can just see from his face.

Becky Peltz: He looks a little bit mischievous. Exactly.

Cori Lint: So now that we’re on his profile, it shows his teacher, I just have one in here.

I’m sure he had many, but it shows his teacher here. We can navigate there. It goes to his profile. Back to Mr. Starker, that has his students here. What if I show you, let’s add a student that already exists. Let’s say we’re looking for someone to add and we think they already [00:15:00] exist in this database, so let’s put Sujari Britt, and the tree just regenerates and it adds for, as one of the children or the students.

We can do the same thing with the teacher. So bam, there it is. And then if we don’t see someone in this tree that we’re looking for, I guess this is the other feature of this whole thing is we can add someone to the database. Oh yeah, and I have a note here to check that they’re not already here.

So this just goes back to this all cellist page. So let’s say I want to add like Yoyo Ma. Okay. So looks like he’s not in there. So then we can click, add cellist. Everybody knows this guy, right? Probably the household name of all cellists. Yep, so we’ll drop in his instrument information.

One of the cool things about these instruments is like, these things cost gazillions of dollars.

Becky Peltz: I’m amazed at the age too. I mean, 1733, I noticed the last one [00:16:00] was from the seventeen hundreds.

Cori Lint: Just, yep. So this is where Cloudinary comes into play. When I add this, obviously not when I add the image, although I would love to add like a widget here, that’s really nice, kind of like it’s on the Cloudinary Media Library.

But for now it’s just this HTML element. But I won’t put in a link. But when I hit submit, all of these things are going to fire off between the front end, the back end, back to the front end, including a call to Cloudinary to upload this photo and store it and return a link to me, so it will display.

Yeah, so he’s been added and there’s this photo, which is stored now up in Cloudinary.

Jen Brissman: That’s really fantastic. And also, Cori, what happens if you don’t have a photo for the cellist?

Cori Lint: Great question. Let’s add somebody, Jen, you’re a cellist now. We’re not going to give you any info. We’re just going to put your name and no photo.

[00:17:00] So this is actually something I learned more recently when I was updating the project was that, you can have like a default or let’s see, I added a default photo to my media library, so I’m actually just pulling this. The logic is such that instead of saving a photo up there, it’s actually retrieving information about a photo that’s already in my media library.

So I added Jen and it’s just this default cello photo that I decided.

Becky Peltz: Well it’s a very easy to use interface, like the flow that you’re showing, you’re not going to get stuck and go, how do I get back to that thing I was doing before? You know, which is always.

Jen Brissman: Yeah. And Cori, I wanted to ask you too about your data model and how you visualize the relationships between the teachers and the students, that seems complicated.

Becky Peltz: If anybody is familiar with family trees, you’ve got a lot of very complex relationships that you’re trying to.

Cori Lint: Oh, this was like, the most interesting, the most infuriating, like the most tears, but ultimately [00:18:00] I think like the most interesting thing about the project. Let me go back to, this is actually one of my other teachers, Martha.

So again, just from the user perspective, before I get too into like the code, the way this is organized in the back is actually. This is one tree over here, with Martha as the root node. And then this is another tree with Martha also as the root node. So what I did is create a proxy root node, and I added the children of one and the children of the other to the same fake root node essentially.

So this is actually two trees, one to the right and one to the left. So the way that’s organized in my data model, this was crazy to figure out because I was thinking in terms of students, teachers. Teachers, students. Okay. A teacher can have many students. We can also have many teachers. A student can have, you know, and just back and [00:19:00] forth.

Yeah, yeah, yeah. It got a bit tangled, and then one day it just clicked and I was like, wait, okay. They’re all just cellists. They’re teachers and students, but really they’re all just people. And I can just say a cellist can have students and it can have teachers, and so rather than creating like a teacher and student table, I just created a cellist table.

And then this one links here, it’s called a junction table or bridge.

Becky Peltz: Many to many relationships, right?

Cori Lint: Yes, exactly. So all it does, it doesn’t really hold like meaningful information. It just links the two tables, which in this case is one table.

So it’s a little bit weird.

Does that make sense?

Jen Brissman: Yeah a really complicated relationship. And many relationships going different directions, but this does make sense and I feel like this has to be the most interesting part of the tree and how you made it all work.

Cori Lint: Yeah, yeah, definitely, pretty fun.

Becky Peltz: It’s a nice looking diagram too. What did you use for that?

Cori Lint: Oh my god. You know what? I’m going to have to get back to you and we can put a link or [00:20:00] something, because I cannot remember and I was trying to find it, but I’ll find it. Yeah, I love how this looks. It’s very pleasing to me.

Jen Brissman: Yeah, I love it too. I’m looking up the name of it. We should share it in the resources for this episode, because I’ve used this same data modeling resource and I’m forgetting the name too. And it’s fantastic and easy to use.

Okay, cool. Well, Cori, let’s take a look at your code and see how you made everything.

Cori Lint: Yeah. What would you like to talk about first?

Becky Peltz: Well, I’m interested in how you worked on your front end here. Because you’ve got a really nice flow. You must have been thinking in terms of pages and components and things.

Cori Lint: Yeah. We put a lot of work into the planning stage, like a week out of a six week project or something like that. And I thought it was overkill, but then when I actually got to the development of it, I was like, oh, this was like not even enough. And I use that in my current work too, the planning is everything.

So anyway, I had that going for me when I got into the code. Let’s see. Let me [00:21:00] show you how we basically walk through getting that image from the form that we submit. Okay, I’ll do that. That’s an interesting one.

Becky Peltz: I can see your model there, that you have an image URL. So I’m guessing that you’re storing there.

Cori Lint: Yes, exactly. Yep. Right there. Okay, so here we have just our html form, as you can see, called add cellist. Here’s our photo upload section, and then here is our JavaScript. And I did use some like jQuery syntax just for shorthand, but other than that, yeah, exactly. So this is referencing that add cellist form that we just saw, and it’s saying when we submit it, perform this asynchronous function.

So we’re naming our files property that we’re getting from that form, which I actually just learned this. I’d always thought of the files property from a form as an array, but it’s actually just an element. So it’s an object [00:22:00] essentially. So we’re calling those files that we grab are media files and then we’re sending those to our function upload media.

And we’re going to wait for the response of this upload media function before we move on. So I’ll show you that. Just right up here. So this right, upload media. We’re passing in a parameter of files. So we’re going to have a default endpoint here called use default image. So that’s exactly what I was showing you when I added Jen to our database.

We didn’t add a photo, so this is our default endpoint. Grabbing the form data or creating new form data to send to that endpoint. So here this is my MVP version, we have the option to add one image, zero or one. So in this case, if we have one image, I’ll take that out.

Our endpoint is going to be upload media instead of the default endpoint. We’re going to reference the first of that one file. And then we’re going to append the information from [00:23:00] that file to the data that we’re sending to this endpoint. So we’ve got our endpoint, which is either default image or upload media.

And then we’ve got a post request and we’ve got our upload data, which has that file attached, if there is one. So I’ll show you these end points.

Becky Peltz: So now you’re going to your back end, your Flask, and Python.

Cori Lint: Exactly, yep. And I love how clean the Flask backend is, it makes it so easy to look at.

Yeah. This view function is going to handle a post request to this route, essentially. So if there’s no image attached, again, super simple. Use the Cloudinary API to grab a resource that has a public ID of cello tree default. And I set that, I uploaded that into my media library from the dashboard.

And I just called it cello tree default. So this is going to return this JSON object of all the [00:24:00] attributes. Yeah, all the attributes of this image. So I can do so much more with this, but all I’m doing in this case is just grabbing the URL when that comes back. So that’s the default version.

Becky Peltz: Well, that’s the unknown image that you don’t have to upload. Yes. You’re just going to use for default. Yeah.

Cori Lint: Exactly. And if I did upload an image, I’m going to hit this end point. And with that, I’m going to use this uploader upload method, also from the Cloudinary API or I guess, Python SDK, which I was happy to find out there was.

And again, that’s just going to upload it to the cloud and then it’s going to return the attributes of the image. I put this to do here because I thought this was so interesting that there’s actually

like a quality set to true when you do the upload, and then it, it gives you like a quality score. So you could even show, I think this is my understanding from just reading the docs.

Becky Peltz: Yeah, there is a way that [00:25:00] you can have it return information about the quality, like if it’s fuzzy or something, you know?

Cori Lint: Right. I thought that would be great because then on the form, you could even just display a little error validation thing that says, please upload a better quality photo so the website doesn’t look like crap.

Becky Peltz: I mean, and like you could, if you were expecting a face for example, you could have it checked to make sure there was a face.

Like if you upload a chair, you could say, only take it if it’s a face. So yeah. That is nice to have a little bit of built in AI there.

Cori Lint: Yeah, that would be super helpful. So yeah, those basically return the same just attributes about the file and then that’s what we’re going to reference.

We’re awaiting that response from one of those backend functions and returning it back to here. So this is our response. And yeah, this is basically an end. This is the form data that we’re going to take and we’re going to throw it again to the back end and say, here, store this stuff as a new cellist and the part that we’re using [00:26:00] from the responses is that URL.

So then when the profile page is displayed, it’s just displaying it from that URL, which is now storing Cloudinary. So, pretty cool.

Becky Peltz: Very nice, yeah.

Jen Brissman: So how did you figure out the call to the Cloudinary API for upload? Were you always doing it this way, or, how did you kind of start out?

Cori Lint: Good question. At the time I was actually doing the Cloudinary call on the front end.

I ended up more recently moving it to the back end. But yeah, at the time, I really just went to the docs. I think one of my boot camp cohort mates pointed me to the right place in the Cloudinary docs. I hardly knew what I was looking at the time, right. But I knew that I could grab that chunk of JavaScript code, bring it into my project, and try to make it fit into what I already had with the form and everything.

More recently, I mean, it was just so much easier because I have so much more [00:27:00] experience, but also I decided to move it to the back end and it was just that much easier. So you saw back here, it’s just these really simple, built-in methods. I can go to the docs and say, okay, I’m using Python.

There’s a Python SDK, I can find the code in Python, which is awesome. Just grab it and look at what the documentation tells me that it’s going to return. And that’s actually what showed me like all these options about quality and the one Becky mentioned about faces and things like that. So yeah, really just referencing documentation, maybe looking at other projects on GitHub that use it, that kind of thing.

Becky Peltz: I think you’re wise to move all of that thing, all of that to the backend because you will get a signed upload, because it will be using your security credentials when you’re on the back end. Like you wouldn’t be able to really do that on the front end. Exactly. In general, this is the way to go. You could start with something on the front end, get it going, but then get it more secure by [00:28:00] moving it to the back end.

Cori Lint: Right.

Jen Brissman: How does your crud file work to update your database, and what do you save about the image in your database that you can then pull from?

Cori Lint: Sure. This is a funny file because the way I would have organized all of this now, knowing what I know about object-oriented programming and everything, this would be very different.

Like these methods would belong with the class for post, that kind of thing. But what I did is just throw all of my helper functions into this crud file. Anything that does a crud function goes here. So I guess we’re looking for create cellist.

There you go. So, what’s happening here is I have a class, actually I should show you that class is probably where to start. So this is model, look for my cellist.

Becky Peltz: This is where you get into SQLAlchemy ORM, is that what you’re using? Object relation mapper? Exactly.

Cori Lint: Yeah. And I love this cause [00:29:00] again, I just feel like it’s so clean to look at and it’s also just really straightforward both for learning and just like if you want to whip something up really quickly, it’s simple.

We’re saying this is a class cellist and that translates directly to a table called cellist. So this functions is both as my data model and I can just code all of the tables out right there, instead of actually using SQL which is really nice. SQLAlchemy does all of the sort of translation in the background for me, which is nice. So these are my columns. Each of these is a column. Each of these is a column.

So what I’m doing in my crud file when I create a cellist is I’m just instantiating an object from that cellist class. So whenever I pass all of that data that I put in the form or the user put in the form to the back end, I’m calling this function and I’m saying, okay, I’ve already grabbed all these things from the form.

That’s what I’m passing in. So then I’m just [00:30:00] creating a new object based on all of that information. And then, adding and committing it, just bam, like that. And then I’m returning the cello object, so then I can reference all of the information that I added.

Becky Peltz: Well, it makes for some really clean code.

Like it’s nice, like you probably worked on this a while ago, but you can come back and read it and know where you were. Exactly. Yeah. I also noticed when you’re calling these from the front end, you’re using async await, so yes, want to talk about that a little?

Cori Lint: Sure. That was actually brand new to me when I think this was the first or this was the first async function that I ever wrote,

so I don’t know how well I can talk about it cause I also don’t use JavaScript anymore.

Becky Peltz: But you’re taking advantage of promises, which Cloudinary can return for you so that you don’t for your error handling and stuff.

Cori Lint: Yeah, exactly. And I didn’t deal with error handling at all here, which I realized when I was working on more development recently.

Oh, what? Nothing happens if I, I have a server [00:31:00] error, so it doesn’t work very well. But yeah, this async function is, there are several different levels that I’m waiting on, essentially waiting for a response from the backend, waiting for a response from Cloudinary, waiting for a response from this function.

So yeah, there’s actually like three levels of await going on here.

Becky Peltz: It would get very messy if you were using callbacks. You’d have a lot of these callbacks. So this keeps it really clean.

Cori Lint: Yeah, Yeah, yeah, definitely really useful.

Jen Brissman: So is Cloudinary the only cloud service you’re using, and also, what did you think of using Cloudinary?

Cori Lint: So Cloudinary it’s the only one I’m using in this project. At work, we do use like AWS. But yeah, in this project and really in my development up to this point, this was the only cloud service I had used. I found Cloudinary pretty simple, especially the second time around.

Now that I have more development experience. For me, I’m like really big on documentation, both writing it and consulting it. And [00:32:00] so I think how good an API is really for me depends on its documentation. Can I find what I need to find easily? Does it make sense? Is it easy to read? Are there code examples?

That’s a big one for me too cause sometimes I have to be able to actually walk through it. And actually the Python code in the Cloudinary docs I thought was set up really nicely because it’s not just like, oh, you can use this piece or you can use this piece. It actually had you go ahead and create the environment variable that you needed for your account.

Lay out like three or four different functions and then run the whole file. So you’re actually seeing like the entire sort of life cycle of what you need to be doing. And you’re like, oh okay, this makes sense. Now I know how to apply it to my project, versus just pulling out like one or two functions.

So I did end up just using two methods, but now I feel like I have a much better sense of how the whole thing works in a big picture way.

Becky Peltz: You used the upload API for your upload and you used the [00:33:00] admin API to get their default image and basically those are our two main APIs.

Those are the two big crud APIs anyway. Yeah. So you’ve tackled both of them. Yeah.

Jen Brissman: Is there anything else that you would want to add to your project media wise and anything you could see changing in the future?

Cori Lint: Yeah, I feel like there’s so much potential here. If I look at, for example, I mentioned before like this listen now button would be nice to have Spotify widget or something like that.

But I was also thinking what if users could upload photos of, this is me with Martha when I was 15 at this competition or something. Maybe this is a profile, but what if there’s a gallery here of like photos from students or something like that. Yeah. I also thought obviously music gets performance, so video and audio is really important.

So I thought having obviously just the capability to upload and store video and retrieve it would be really nice, and then audio as well. I thought it would be cool [00:34:00] maybe eventually in addition to these comments to have like audio stories or something like someone could go in and be like, oh, I have this great story about Janos Sharker smoking a cigar during my audition or something, you know?

Yeah. These are the kind of things that we love to share. Like we all have endearing or funny stories about our teachers, so I thought that would also be just a really nice way to share their legacy and the things that they taught as well.

So yeah, audio, video, multiple photo uploads, that kind of thing would be really nice.

Becky Peltz: Yeah. If I have one thing, then, I don’t know how much time we have left here, but I would really like to see how you did your tree in the front end. I know you used special libraries.

Cori Lint: Yeah. Yes. Oh, it’s kind of a beast, but I’ll give you the tldr. So wait, let find that. There it is. tree class. Okay, let me minimize some things in here. I should first talk about probably the [00:35:00] library that I use, which is d3: data driven documents. And a lot of my bootcamp classmates were using Chart.js, which is actually really cool, really nice looking, easy to use, easy to reference.

And I quickly realized that it was like, it just didn’t have the capabilities of my project. So actually, let me show you something that I was looking at on D3. This is kind of what I pictured in the beginning is like a giant tree that you could, you know, navigate through.

But even this doesn’t cover the many to many. This is still just a one to many. That’s right. Yeah. Yeah. So I should actually show you this other project that I just think is amazing, and this was also on my mind when I was developing. So this is like you search an artist that you like.

But I absolutely love this. So this shows like, the closer in proximity they are to the artists that you searched, the more similar they are.

I don’t know how they figured that out.

Jen Brissman: l love how Betty Davis and Janelle Monae I guess are closer than we all thought.[00:36:00]

Cori Lint: Who knew? So these were just ideas, things that were on my mind. I searched the internet to find like an example of something that made sense.

And what I finally found was this like pedigree or literally family tree option by this user on GitHub. So many thanks to them for contributing this idea, which I really borrowed pretty heavily from the whole idea of the using one root node, but actually having two trees. That idea came from this person’s project.

So this file is really just here are the classes, here are the relevant methods. So here’s a tree class, here’s what children are, here’s what data are, here’s how to draw the lines that connect the different nodes, draw the nodes, and you notice that when we added someone to the tree, the whole thing would sort of regenerate.

So every time you do that, it refreshes, it redraws the entire tree.

Becky Peltz: Like listening [00:37:00] for an event kind of to, to let it know.

Cori Lint: Yes, exactly. Yeah, this was pretty old.

I think when I found this. It was four or five years old or something. It still works great, but it’s using like a, I think D3 is on version seven and this is like version three or something. Oh great. So it definitely could use an update, which I wasn’t quite ready for at the time.

But yeah, it works great. It is super fast. I did a bunch of customization too, like I could have gone forever with the customization. I was just starting to get my head around everything that I could do because it dynamically generates everything, so you can make things, whatever color or size you want and yeah, just so many possibilities there so.

Becky Peltz: Yeah. I’m kind of curious if it would perform well if you were to stick a little image in each one of those. I think you could cause you could optimize the images and that would be kind of cool to just see all the people.

Yeah.

Cori Lint: It would. So many possibilities. I [00:38:00] would love for there to be that like giant tree that I had in mind. I don’t know what that looks like, but it would be really cool.

Jen Brissman: So Cori, do you have any next steps for Cello Tree in mind?

Cori Lint: Actually, I’ve mentioned a few with the different media options and of course there’s so much. But I do have to mention something really cool happened. As I was talking about this project, actually, I think it was someone through in Artists Who Code. I was talking about this project.

I shared my demo video and like I said, like, we’re big nerds, right? So cello nerds. So someone reached out to me and was like, hey, did you know that someone else actually built something like this like many years ago, like early two thousands or something.

They pointed me to it and it actually is not live anymore. But I did a little bit of digging. I found the person who created it, and weirdly enough we even share a birthday, so it is meant to be. Wow. His name’s Carol, and he lives in the Netherlands. He’s a cellist and a self-proclaimed nerd.

So he [00:39:00] had this website, it was essentially very similar to my project without the data visualization, but he has a database of over 1200, I think it’s actually more like 2000 cellists. Oh. And their relationships to each other, like exactly what I was doing. So I would love to migrate all of that data into my project.

Also would be a fun scripting project to figure out how to do that. But he actually said, I reached out to him, we chatted a little bit. He was like, your project looks so cool. Like, I was always sad that I had to take my website down, you know? So yeah, I definitely want to do that in the future, integrate all of that new data and like really flesh out my project with some more data.

Jen Brissman: So he just willingly shared all of his data with you and said, run with it. You can do it.

Cori Lint: Yeah, I was kind of shocked. I was kind of shocked actually. But I think it was just like the connection that we had by being cellists, being little bit of techy nerds, having the same birthday, like I said, it was meant to be.

Jen Brissman: Cori, this is amazing. You built this project in the course of what, a few [00:40:00] weeks?

Cori Lint: Yeah, five or six weeks, I think.

Jen Brissman: Wow, so that’s amazing. And I just wanted to ask you, what was it like bringing together your skills as an artist with your skills as a software engineer and exploring what that looked like together?

Cori Lint: Yeah, we could seriously spend a whole podcast talking about, music or arts skills and how they lend themselves well to software, specifically software development, but a lot of other things too. But more briefly, for one thing, as a musician, you spend a lot of time inside, at least a classical musician, inside the four walls of a tiny six by six practice room.

Very self-driven, very focused time. I think there’s so many parallels between learning a piece of music and either learning a new coding language or building a coding project. Just the sort of exploration phase.

The just getting the mechanics to work, getting from point A to point B, and then more efficiently and more beautifully. There’s so many [00:41:00] parallels there. I think as a musician, I learned, yeah, focus, self-motivation, attention to detail, how to communicate with other people because yeah, you spend a lot of time inside a practice room, but you also spend a lot of time playing with other people.

Like I worked with a string quartet professionally for a couple of years and like working really closely on a team, making decisions together, those sort of soft skills as well. But it’s funny because I’m a cello substitute, so they call me up if, you know somebody can’t play the concert or whatever. And sometimes I go back and play and other cellists are like, oh, what are you up to now? And oh, I’m, you know, a software developer and a lot of them are just absolutely shocked and say things like, oh, you must be so smart, or I could never do that.

And I’m like, I don’t think you realize how, if I can do this, anybody can do this. Maybe not anybody, but somebody with the type of drive and attention and just mastery of a skill like that. I have no doubt in my mind that they’re not only smart enough, but have so many other [00:42:00] skills to contribute that maybe people even from technical backgrounds might not have as much.

So yeah, there’s a lot to cover there for sure. But yeah, it’s been a really interesting experience and I feel like it’s actually given me. Yeah, I’m not a genius. I’m not Steve Jobs. I’m not going to be maybe the best developer at my company. I’m like a year in. But I think I have all of these other things that I can offer that in part, were very much developed by my music career.

Jen Brissman: Yeah. And probably things like empathy and other soft skills that you have make you a better developer, make you a better teammate, and make you able to collaborate in a better way and maybe learn quicker and just be a contributor. So yeah, and so I know, obviously I know personally because I’m in Artists Who Code as well, but I didn’t know if you wanted to chat about Artists Who Code before we sign off or mention how that’s impacted your journey into the tech space.

Cori Lint: Yeah, absolutely. A lot of what I just said, I’ve had the words for it [00:43:00] because I’ve had these amazing conversations with other people in the same space. It’s an interesting group. I would say it’s like maybe half support and half advocacy. So we do need a lot of support when we’re making these career transitions.

People in the arts, it’s our life, it’s our identity. And when we move into something else, there’s this like sense of, of loss, of almost grief, of like identity crisis, like that kind of thing. There’s also just the, how do I make a resume, cause that like maybe we have our arts resume, but what does a technical resume look like?

I have no idea. What’s LinkedIn like? Not everybody, but a lot of us don’t have that really basic knowledge. So there’s the support for folks that are wanting to make the transition. And then also for folks that are in the tech industry who maybe just want to be around people like them.

And then on the other side, there’s this advocacy piece that’s like, recruiters may look at [00:44:00] a resume and be like, okay, you have orchestra experience. That’s totally unrelated, right? But, if they understand like the type of people we’re talking about, they might realize that these people are very high empathy, very creative, very good communicators.

So if we educate the public on these skills that artists already have, it might make that pathway just a little bit easier for them. And I think it will really enrich the tech industry. Just this new wave of like very empathetic and creative people. I think that’s always a good thing.

Jen Brissman: So, Cori, tell us a bit about where you work now and the stack that you work with, the languages that you use primarily.

Cori Lint: Sure. So I work for Ovia Health. It’s a health data company. Basically, we have apps for fertility, pregnancy, and parenting, which is really cool. It’s always nice to work for a company that makes a product that I can actually explain to people.

Yeah, it’s not so esoteric. I love their product [00:45:00] and I get to work on really fun features like logging a child height or birth control logging, or right now we’re actually working on some stuff for inclusivity around the app experience. I’m not sure if I can talk about specifics, but that’s really nice to be working on as well.

Ovia was actually acquired by LabCorp last year, but it’s nice because we maintain the close knit culture still feels like sort of startup, the good parts of startup culture where we’re all very close and very kind and yeah. It’s a great place to work. As far as the tech stack, we mainly use PHP, which has been really interesting moving from Python to PHP, as with all languages, tons of overlapping concepts, but the syntax is just like night and day.

I feel like with Python, even if you’re not familiar with language, it’s pretty straightforward. Like you can look at it and know what’s happening. It almost reads like a sentence. Yeah. But PHP I found not that way. Yeah. And to be fair, I [00:46:00] also moved from like student level Python to an enterprise code base in PHP, so that’s a big difference as well.

PHP is funny. I think it’s sort of a misunderstood language. It gets a lot of hate. And I had heard this out in the tech world before and not really understood why. And now that I’m getting into language, I’m understanding sort of the reasons for the bad reputation, but also finding ways to counteract that because the language has evolved so much over the past few years.

There’s a lot of old kind of bad PHP code out there on the internet. That doesn’t mean it’s a bad language, it just means it’s an old language. But one of the things that I actually love about PHP is that it’s an old language. So sometimes when I’m asking one of the senior engineers, like, why are we doing something this way?

It opens a can of worms and we end up talking about the history of PHP and backwards compatibility and, you know, all these kinds of things. But modern PHP has all of the capabilities of any other modern language, like [00:47:00] object oriented programming, strict typing. It also just the sheer volume of like history and the sheer number of developers out there that work on it is always fun.

There’s a ton of information out there about it.

Jen Brissman: I feel like if you’re coming to the defense of PHP and you use it all the time, that must mean you love using it and it’s a great one to work with. So I think that’s telling that you’re strongly coming to its defense for any of the haters on the internet.

Cori Lint: Yeah. I’ve also been like indoctrinated by the senior engineers at my company who really love PHP. So shout out to them as well.

Jen Brissman: I love that. I love that. And it seems like you have some good mentorship at your company too, and have grown a lot in the last year?

Cori Lint: Definitely. Yeah. Absolutely. Yep. Obviously a lot of code review, but also, a senior engineer will just say, hey, I saw this thing in your PR I’d love to chat about. Do you want to just hop on Zoom? And we can pair through it. And sometimes we have an hour long conversation. I learn so much.

And there’s just a culture of that. Like there are no dumb questions. I think that’s [00:48:00] so important for a junior engineer, especially coming from outside the industry. So yeah, it’s been a really great place to grow.

Jen Brissman: Amazing. That’s so great to hear. So, just to wrap up, if anybody wants to get in touch with you, Cori, we’re going to share your LinkedIn and other details with how to get in touch and yeah if there’s anything else we want to add, I just think we want to say thank you so much. Great.

Becky Peltz: Thank you. It’s really been wonderful hearing you talk about it and I love your project, so.

Cori Lint: Thanks so much. It’s been really fun to revisit it and also to see it through other people’s eyes is always fun. So I really appreciate the opportunity.

Becky Peltz: And you used Cloudinary, so nobody told you to do that.

Cori Lint: Exactly. I used it before I even knew.

Jen Brissman: Yeah. Actually, one more follow up question before we wrap up. How did you find out about Cloudinary?

Cori Lint: I think it was just something that our teachers and advisors at Hackbright were familiar with, and they knew it was a good product. So it was recommended.

[00:49:00] I kept hearing the name and I was like, I guess I should check that out. And, yeah.

Jen Brissman: Yeah, I always like to ask people, because it’s something I think more people will know about going forward, but I wish more people knew about Cloudinary. And I think when I was building my project that also used media at the same school, Cori was at and I found out about Cloudinary.

There wasn’t any other competition. There wasn’t any other cloud service that I could have used that would’ve done the same thing Cloudinary did. So I’ve yet to hear of one that does the same thing. So I’m glad you found Cloudinary Cori, and I’m glad that you shared your time with us today.

This was such an interesting conversation and we’re so grateful for you.

Cori Lint: Thank you so much.

Becky Peltz: Thank you. Thank you. This was a great episode. I really enjoyed hearing Cori explain her thought processes, her love of cello and Artists Who Code. But I really liked that data model that she created. It was really easy to understand, and anytime you’re dealing with many to many, it can be challenging.

And she did a really good job showing us the flow of creating the model and then [00:50:00] translating that into a UI with two trees.

Jen Brissman: Yes, exactly. And we’ll share the resource that she used to create her data model, and she really had a difficult task. She had to show the complicated relationships between teachers and students.

And then she realized that everyone was a cellist, but also a student and also probably a teacher to someone else. So D3 was a great resource for her to show that as well.

Becky Peltz: Yeah, the whole student teacher model was really interesting. It definitely fit into this idea of setting up a tree for cello, but I could see other people wanting that model, who taught you how to code or something, or who taught you how to ride a bike and who taught them.

I don’t know. But I think it’s been a good model. I also just coming from Cloudinary customer education, I really want to emphasize that this shows a good example using the Python SDK with Flask to create an API for both upload and admin. So she uses admin to get her default images, and then she uses the upload API to upload any kind of [00:51:00] new work.

So I’m really appreciating that.

Jen Brissman: Yeah, definitely. And then another takeaway is Cori started with someone else’s solution and she built her project from there, and that’s something that’s totally kosher to do. I think maybe we’re conditioned like, oh, don’t copy someone else’s work. But there’s a big difference with starting with someone else’s solution and building from there.

That’s something that happens all the time in the developer community.

Becky Peltz: Yeah. I’ve been a developer for years and years and even going back to looking at the scientists like Newton, it’s always start with somebody else’s stuff. We build on each other’s shoulders. Yeah. And that is the cool thing about technology is it’s an evolution of how people think about things.

So we have some ideas about copyright and don’t copy other people, but that’s not how it works in technology. Open source code really blew away a lot of the secrets about coding anyway. Yeah, she did it in a really good way I think.

Jen Brissman: Yeah. Yeah. And lastly, I think [00:52:00] it was a really important case to look at bringing your passions.

She’s been a cellist her whole life professionally, and she had this idea to build this app and learning about how the developer in the Netherlands shared his data with her, and they made these connections worldwide because of something she created that really started from her passion in another unrelated field.

So it was interesting to hear about that, and it’s just important to remember that bringing other passions in is only going to make for better projects and a more meaningful experience for the developer.

Becky Peltz: Well, in general, I think that’s the whole reason why so many companies are investing in diversity is that the more points of view that you get, the more we realize the problems out there, and then also get a lot of ideas for solutions.

So passion and having a voice in the projects you’re working on. And she does demonstrate that really well in this conversation.

Jen Brissman: Absolutely. Absolutely.

Becky Peltz: Yeah. So all in all, I hope that this [00:53:00] will be not only informative, but fun to watch. I think there’s a lot of good material for any developer that wants to work with Cloudinary, especially if they’re a Python developer or just a web developer. This has a lot of interesting code and ideas.

Jen Brissman: Yeah. Thank you so much to Cori for coming on, and stay tuned for the next awesome DevJams episode.

Becky Peltz: And that’s a wrap.