Week 3: Welcome baby Jarvo!
Day — 1
I had used a static config file to inflate the data in my autosuggest for City Search which actually had to be done by hitting API’s on typing words/making any edits in the AutoSuggest EditField. So, I had to correct this one! So, the two tasks assigned were:
I had used a static config file to inflate the data in my autosuggest for City Search which actually had to be done by hitting API’s on typing words/making any edits in the AutoSuggest EditField. So, I had to correct this one! So, the two tasks assigned were:
Task 1: City List in AutoSuggest is to be populated using the API calls.
Task 2: Design a popup containing Checkboxes of the column names and use states in React to hide/show the columns of your dashboard.
This was one of the days when the mentor is really busy but still showers upon you some major help-tips. So, he broke down Task 2 into subtasks so that it stays less messy and difficult for me.
1. Set default as bool in config
2. Populate only those which are default true
3. Store the default col in local storage for new users (if that key is not present in local storage)
4. Make an edit key
5. open popup and populate all keys from the config
6. Let user select/deselect col name
7. On save setState and store in local storage for the next session
I could complete Task 1 completely and up to 4 subtasks of Task 2.
Day — 2
Honestly, I was crawling through this week. And it was only Tuesday!
Yet, I managed to get myself up and was feeding in my mind some lines from a motivational video I had seen some months before-
Mark Zuckerberg will not be Mark Zuckerberg today if he only worked on the days he felt like working. And that, one doesn’t become Gigi Hadid or Kendall if one work-outs only on days one likes to.
On Day-2, I completed the rest of the tasks of the checkbox thingie and it “seemed” to work fine.
Lesson 1: Difference between Javascript Maps and List, and how to use them.
Lesson 2: How to clone a list from another.
Also, some members of the team, me and the other intern decided to go for playing Badminton at 9 pm. Just like me, you must be wondering, who the hell goes for badminton at 9 pm! :P ( but, busy lives guys! )
While returning from badminton at 10.15 p.m - we were hungry for food as well as a U-turn to reach our destinations. And, poor us, we were on our VOGO scooter and it started raining!!
But it was fun I suppose, moving around clueless with just Google Maps (before the rain), staring at such huge offices — Adobe, Oracle!
Day — 3
There were some issues with the checkboxes while finally integrating it within a Dialog and I was clueless. After hours of mind-toiling, Googling and zig-zagging over the note-pad, I could come up with this.
Jarvis being a good boi magically helped me with someone giving eye-opening advice to me, in decent words though!
Lesson 3 — “Don’t run away from the docs. They’re there to help you only!”
Day — 4
Task 1: Work on UI a little. It needs to look presentable enough as the VP is going to have a meeting today with the interns about their projects and what they are working on.
Task 2: Instead of passing states in a messy way from parent to children and otherwise, use some state management API in React.
I finished the UI part once and went on for small talk with the VP. I was nervous, but then, he sincerely listened to everything and explained what the final expected outcome of the project is going to be.
I was confused between using Redux, Context API and React Hooks for state management and still am. So, I started with reading Context API docs as sometimes, slight inclinations might overpower you.
Day — 5
Task — Refactor your code using some state management API
To this day, I was still confused about what had to be used with my project.
I went to the mentor for some help. And, he made me understand how it was all up to me to use any one of the three options. All of them had their own pros and cons. He told me how I was in charge of the project and henceforth also needed to think a name for the same.
Hooks seemed fascinating to me but I realized that I should give it all some time and I started to read React Hooks Docs.
Before refactoring, firstly give some 20–25 minutes to figure out the states used in your project and how they’re all connected. This will help you largely.
-Arihant Verma
My messy state of mind got its calm when I actually figured out the states and their flow and also found out some optimizations to the code.
I read about Hooks a lot and finally decided to give them a shot. If time permits, I will write a blog post containing the motivation to choose React Hooks as the state management library.
And about the naamkaran, I decided to name my project — “Jarvo”, and it was good to know there was no repository with the same name too. And the reason was obvious, me highly-highly fantasizing the coolest Marvel Character ever existed in history.
This is how the week ended with exploring different state management APIs and a Usain-Bolt run to my home on Friday, 7 p.m.!
