April 2020 Update

I’m frustrated. I’ve been making progress at Lambda, and I’m finally starting to feel like I understand React at a basic level. I’m still behind on blog posts about it though. Right now we’re 7 lessons ahead in the curriculum than I’ve written about (not including individual posts about projects). When I was in WEBPT10, we were *13* lessons ahead of where I am with writing right now, and I was further behind in blogging about it, so… progress.

Fetching data

These last few days though… Friday’s project was to refactor GitHub Followers, an old assignment from Applied JavaScript (Components II). Something in my head’s not right. I got stuck getting the data from GitHub using fetch(), so I switched to axios and found myself in the same predicament. For some reason, my syntax was wrong and I just wasn’t seeing it. It took me 90 mins to finally get it to work. I even referenced older projects and still chewed dirt for a while. It might be on account of when I do most of my coding, which is in the small hours of the night. I should still have had it done faster though.

Once the data was being pulled down, I got to work. I rendered my profile’s data with no issues. Class components are different from function components, but it was workable. I do strongly prefer function components with hooks though. Once I got to the point where I was iterating through my followers and wanted to get their data onscreen, I hit a big issue: I exceeded the amount of hourly API requests I can make of GitHub almost immediately.

react-gh-followers-01

Exceeding data limits

This really hit me. I looked around and found ways to get around it using a prefix in my HTML string that uses a proxy, and it worked to a degree, but then also stopped. I researched for the rest of Friday night and finally gave up around 4:30 AM and went to bed. In the morning, I could make requests again, but I wasn’t happy. My previous JavaScript program delved a level deeper into the GitHub data and let me return data for each of my followers that I couldn’t get at the surface level with this React version.

I tried stuff for a while again on Saturday before finally giving up in the evening and taking the second-best choice: I just used the surface data from the API call to my /followers path on GitHub and iterated over that data. The main issues I have are that I wanted to show real names and location, like I did in the original project. Without getting the more detailed level of data, I could only show username and no locations.

I lived with it and moved on, working from that point and polishing the project. I styled it a bit and made MVP (minimal viable product). Then I started on stretch goals.

GitHub Contribution Calendar

The first one took a while. We were tasked to show our contribution calendar from GitHub in our application. There was a link to a conversation on Stack Overflow that had a way, but I couldn’t get it to work. There were dependency issues with the installation. After more research, I found an equivalent React method, which did work. I was actually pretty happy with it. It shows the data and I can style it. My only issue is that I can’t remove a line of text above the SVG that has a link to my GitHub profile with with my username in it. I wanted to remove it because I have a button that links to the profile directly above it, and because it doesn’t mesh with my design. There’s no way in the library’s API to remove the line, and I tried things with CSS, but they were also to no avail, so I finally acquiesced with that, too, and moved on.

I used the same library to add contribution data to all of my followers’ cards in the application. This was the main reason that I wanted to remove that line. Its redundant with my design, which I just dealt with in my profile section at the top of the application, but it also repeats across all of the followers’ cards when it renders their contribution calendars. This resulted in a performance hit too, which I discovered when working on the last component – and the real source of my frustrations – my search.

react-gh-followers-02

Search

Since yesterday, I’ve been working on the search component stretch for this project. I gave up at 5 AM today and took a nap, and then I worked on it more, earlier. I don’t understand what I’m doing wrong. I’m not great at writing search components yet. I’ve done two of them. One was for the sprint challenge at Lambda for Single Page Applications that’s ahead of where I am with blogging still. The other was for a separate project I did from a YouTube tutorial that I selected specifically to build another search component. I also found one on CodeSandbox from Christina Gorton, one of my previous Lambda instructors. She had shared it in Slack with another cohort.

I’m not sure if its because I’m working with class components and have to use lifecycle methods for certain operations, but my code might not be updating state properly when it comes to taking in user data from an input and then setting it to state and re-rendering the application using a new user’s data instead of my own, which is what’s in initial state.

I rewrote my code 3 times so far, and modified it through all of those 3 rewrites dozens of times. I was actually going to admit defeat and speak with a TL at Lambda during TL hours today, which is something I’ve never done before because I tend to just put my back into it and push through, but its Easter Sunday during coronavirus and I didn’t see an announcement for TL hours today. I could probably reach out to one of them, but I don’t want to interrupt their weekends for this.

I’m most likely going to bang my head against this for the rest of the night.

COVID-19

Finally, I mentioned in a previous post that our friend Danny had passed due to complications related to coronavirus. His funeral was yesterday. We attended it online. The only people who were physically present were his wife (now, widow) and her brother and sister. His mother passed in January. His father is too old to be allowed to go. His brother has kids and lives in Texas, and the rest of us are basically not allowed to go in the flesh because of this pandemic.

It was a strange experience for me. We wanted to support his wife, but we couldn’t do it physically. She and her siblings were the only people present, so only they could speak about Danny. Their eulogies were simultaneously touching and heart-breaking, especially his wife’s, who is a fantastic writer and speaker in general.

The funeral home streamed the service. It took about 40 mins. After it was over, the camera remained on and we got to hear his wife completely break down, off-screen but on-air. This went on for several minutes and was stark and saddening. Eventually, she and her siblings started reminiscing about Danny, telling stories about him that cheered them up, talking about when he first met each of them, how their family reacted to him and how he broke their preconceptions about him.

Like my wife and I, they’re a mixed-race couple. Danny is Chinese and his wife is black. He’s probably northern, because he’s at least six feet tall, like my Chinese co-workers who are all northern. They told a story about how, when he first met a group of their cousins, they asked him what he liked to eat and apologized for not having noodles. He replied by detailing how he loved oxtail and mac-and-cheese. His wife talked about how he never asked for it, but also never turned down a plate of fried chicken. They talked about cosplay and gaming and piano and how he acted when they all first met. They talked about how the undiagnosed diabetes took its toll on him, and how in his final years, he had lost the ability to ambulate, and how his computer gaming turned to tablet gaming. As a couple, they played a lot of tabletop RPGs together, and other card and board games. Their gaming group was expansive. It was them that introduced me and a group of my friends to Munchkin and some other games, during one of our backyard barbecues.

My wife and I were talking about how Danny’s wife is holding together; about how she’s been putting on a strong front but has been dealing with so much, both before Danny’s passing and now after. Due to COVID-19, people can’t even be physically present to comfort her. Her mother lives near to her, in an apartment, but isn’t allowed to be out in this clime due to her age and health. New York has been hit especially hard. Morgues are acting as secondary storage for hospitals here. In some of the boroughs, there are mass graves being dug because facilities weren’t equipped to deal with the fallout of the virus, and its not even as bad as it could be due to social distancing and self-quarantining.

Anyway, I’m taking a break. The baby just woke from a late nap, so she’s going to be up. I’m not getting anywhere with my search feature, so I’ll probably reach out to a TL tomorrow if I don’t figure something out tonight. Keep safe everyone, and for those of you struggling through learning how to think like a programmer and build web applications, hang in there. Take time to clear your heads, and try to find someone more experienced to guide you. I’m going to do that. I actually began writing this post as a part of that, to help get some of this out of my head.

3 thoughts on “April 2020 Update

  1. I got the search feature working earlier tonight, before class. I’ll write about it when I get to that project’s writeup.

    Like

    1. Sorry for the late reply, The move from NY to CA, and resuming the coding bootcamp have completely overtaken my energies.

      Definitely start a blog. I’d love to read about your experiences learning to code – and with music as well, if you’re inclined to write about it. When I started my bass blog, years ago, I found that even though I’m a beginner, there are people who are interested in that vantage, and my posts helped them and spoke on a level that they understood. I carried that forward to this blog and found it helpful to myself as well as others. Its helped me to learn topics because I explain them in words and quickly find where my knowledge is incomplete, and its also helped me to find new resources and build a small network.

      Like

Leave a comment