Open comments for this post
Done With FRCdle (technically)
Devlog #6
I’m finally finished with FRCdle (it took me way too long). Statbotics broke again so I’ve only been able to test with hardcoded data. I will go back and retest FRCdle once Statbotics is back up.
Issues
I really only faced one problem and that was my use effect refusing to fire again when I clicked on a button in the parent element. This use effect was supposed to reset FRCdle to its starting state and I fixed it by adding another use effect (fighting fire with fire here).
Accomplishments
The obvious one is that I finished FRCdle! The background colors for each cell in the table update based on how close the guess was to the randomly selected team. The text in each cell also indicates whether the guess was too high or too low where applicable.
Next Steps
I will be working on the robotics trivia portion of the app now. I’ll eventually come back and retest FRCdle when the Statbotics API is fixed (I hope it happens soon).
edit:
I just realized that if I wanted to circumvent the issue of Statbotics (or maybe even the Blue Alliance) API down, I could have new, changed data be pushed to a database, that way if either API goes down, the user will still be able to play albeit with potentially outdated data. My only issue with this is how annoying it was to host one of my past projects that used Firestore/Firebase (it took me around two weeks of constant debugging to get my backend properly hosted). This might be too big of an improvement to ignore though, so I might add a database. Should I stick with Firebase/Firestore or should I switch to another database like MongoDB or Supabase?
Open comments for this post
Mostly Done With FRCdle
Devlog #5
I am nearly done with FRCdle (finally). While Statbotics was down (it’s finally back up!), I essentially had to create “pseudodata” in order to properly test adding teams to the table.
Issues
I had a lot of trouble with async function timings. The async function I had fetching the data for a random team tried running at the same time as the async function that fetched the data for teams in an area. This caused an error in the former function since it was trying to fetch a team before it even knew what area to fetch it from. The fix was really simple: I added another useEffect that ran whenever the area data was fully pushed to its useState or whenever the difficulty changed.
Accomplishments
The difficulty calculation works. It takes the EPA rank and area (points) rank for each team in an area, scales them in reverse order (in an area with 75 teams, 1st place gets 75 points all the way down to 75th place which gets 1 point), and averages the two new point values with a higher score making a team easier to guess. For example, if the user selects California in easy difficulty, the randomly selected team might be 4414 or 254 since their scores are much higher than most of the teams in their district.
Next Steps
I can finally get the actual guessing portion of FRCdle done (I know I’ve been saying this for several devlogs, but I will actually do it now).
Open comments for this post
Major Roadblock
Devlog #4
Development was going pretty smoothly with my request for every single FRC team being implemented.
The Roadblock
As I was about to start getting the guessing part of FRCdle actually implemented, I got hit with a 500 from Statbotics. I tried again and again and again but I just couldn’t get the API data no matter how hard I tried. I tried clearing my cache and restarting my development environment to no avail. I eventually went to the REST API documentation on Statbotics and tried fetching data directly from there, but I was hit with an error where Statbotics asked me for an API key. I don’t have an API key. I asked a few other people about this issue and they were facing it as well. So now, I think that Statbotics itself is down which means I’ll have to stop backend development for who knows how long.
Next Steps
There isn’t much I can do. I can work more on the frontend but as long as Statbotics is down, I won’t be getting much progress.
Open comments for this post
FRC Wordle Clone Almost Complete
Devlog #3
I am (finally) almost done with the data fetching portion of “FRCdle.” I’ve been fetching data from both the Blue Alliance API and Statbotics API.
Annoying Issues (and Odd Solution)
I had to figure out how to fetch data for teams in the regional system from the Statbotics API. This API, unlike the Blue Alliance API, doesn’t have a designated method for fetching teams in this system (as compared to the district system which it does let you directly fetch data for). To circumvent this, I used the same endpoint the API uses to send district data. However, I kept the district parameter empty, thereby (mostly) forcing the API to return regional teams. Since this particular API request can only return 1000 teams at once, I had to fetch several times, increasing the offset by 1000 each time until the length of the returned data was less than 1000. This may not be the best development practice, but it is one of, if not the only way to get regional data from Statbotics (luckily it is much easier to get regional data from the Blue Alliance API).
Next Steps
I have to finish the API request for fetching all FRC teams. Next, I have to finish my difficulty calculations by taking in a team’s EPA rank within the user-chosen area and their area rank (points rank), scaling them from 1-10 (the higher the rank, the higher the number from 1-10), and then taking the average of the two new values. Lastly, I have to implement the wordle part of this game (guessing teams along with color indicators for how close a player is to the correct team).
Open comments for this post
Beginnings of a Wordle Clone
Devlog #2
I started making lots of progress on the wordle page (specifically FRC wordle). It took me way longer than I’d admit to (even though I can’t hide how much time I’ve logged on this one devlog).
Big Accomplishment
I finally got my backend up and running! It took me way too long mostly in part due to nodemon and express acting up. I spent way too long trying to figure out why my fetch statement on the frontend wasn’t actually fetching anything from the backend (it was basically a one line fix too).
Next Steps
I need to add a user input that lets the user dictate where their game of wordle goes. Right now, the only way to change the data on the table is to change the hardcoded team number (users can’t do that). Then I need to add the colors (green, yellow, and grey) for guesses and actually have new rows add onto the table (styling the table is also a priority).
Open comments for this post
Landing Page
Devlog #1
I’m still kind of new to all of this so please bear with me! (How does one format a devlog? Is it like a READme?)
This project (as the project title somewhat suggests) houses several robotics (specifically FIRST Robotics) themed games. I guess you can think of it as a neal.fun knockoff for robotics (but maybe not as fun).
I did start this project before Stardance, but I didn’t get too much done with it before. The majority of the time I have spent thus far (after the start of Stardance) was spent familiarizing myself with Next JS and Tailwind as I have really only used React JS and Native along with straight CSS files before.
I tried going for the effect that large companies (mainly Google from what I’ve seen) have done with their buttons and other parts of their UI with a gradient effect with their border. I think it’s coming along pretty nicely but Tailwind has a lot of constraints that make replicating it nicely very annoying (either that or I’m just not good at Tailwind).
I’ve also created four buttons so far with the same border gradient effect with each button leading the user to a different game page (none of them are set up yet and each one might take a bit). You do have to scroll down to see the buttons so they aren’t included in the screenshot of the landing page.
(Please name suggestions please. Flux is just an arbitrary name I chose.)