{"componentChunkName":"component---src-components-page-template-js","path":"/5","result":{"data":{"allMarkdownRemark":{"nodes":[{"html":"

I’ve spent the past week throwing time at disparate topics that had ended up on the back-burner + generally just chasing random curiosities, which has been super fun and energizing in its own right.

\n

But now I’m planning to shift gears and focus on refining what I already know, SO: to kick things off, I’m going back to where it all started for me… React!

\n

To kick things off, I made a simple little web application that uses Google's Translate API to translate input text from English to the selected output language.

\n

Here's what I focused on today:

\n\n

Test out my translator here.

","frontmatter":{"day":"10","title":"Language Translator with React","publishDate":"2021-02-18","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABUklEQVQoz5WTy0sCURTG/e9a1iKRmvHR5CJ6LcKdi9pnVgNFMfc2VjuFNoHRosRlgxNJtNCEKK1FooTzSAr5ujM2psbAzOLwcc7h/vg459yAQcMYDR66pYRHl87gi4ZstWqDYD2rr/97G0ZgvKCTXyjTurSCmpRAQ1pmAI7VuD+QpRbYC9CkHD7IHFZ3q5hK61jaqaElL8CUY9COoq7uXIGfDNiSBCzuvWL9rAtu30T+6h7NxxJebgsMGus79gN8PxSQpM84LXawkdWQkOs4vy5CVVUYx3Ho0qw/YJsICG01wRNgUuwhJLZBc3lUygoDzjMg528pHRJFWrzEWqqExKaCieQbsoUqKg930DNxGF6BzoYt7dEgkJmGeRBEblvGU/kGDeXC/wwdqEYitlONRvB9wtt1g81u+HQ8OHSBS/3cOW7Phz0CHID5kZ9iDOXjb34Aqh+IX1X+Wi8AAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/8e9f69600cc37052fe15c9330e5075d2/3891b/day-10.png","srcSet":"/static/8e9f69600cc37052fe15c9330e5075d2/3ba9f/day-10.png 100w,\n/static/8e9f69600cc37052fe15c9330e5075d2/8ac63/day-10.png 200w,\n/static/8e9f69600cc37052fe15c9330e5075d2/3891b/day-10.png 400w,\n/static/8e9f69600cc37052fe15c9330e5075d2/8c332/day-10.png 600w,\n/static/8e9f69600cc37052fe15c9330e5075d2/bc8e0/day-10.png 800w,\n/static/8e9f69600cc37052fe15c9330e5075d2/54311/day-10.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Code-time today was devoted to making sure every piece of my portfolio is as buttoned-up as it can be!

\n

I wasted over an hour trying to get Google Analytics firing to no avail. Then diverted the rest of my time to refining mobile responsiveness through media queries.

\n

Overall, I'm very happy with the UI and UX of my site — it's clean, crisp, and intuitive while also showcasing my personality. Definitely plenty more that could be added (I'm planning to add lots more detail to my project pages... eventually) but for the immediate, I'm pretty happy with how it's looking.

\n

Check out my current portfolio here — I always welcome any and all feedback!

","frontmatter":{"day":"09","title":"Portfolio Review Prep","publishDate":"2021-02-17","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABX0lEQVQoz5VTiW6CQBT0/7+nSa1Cg0etR63aerSiplorXoAoIizHdFlA12jTlmQyLw/e7MzLkvLdPUJ4xDzyX8F/n+ikkoIXRWAD/oFx4FlRDSfiuA77vNCFIP+y//6K9ksdrUYVy/kEhr5A87kCbT2Dupqx/tZYHUWvOuQjDOUuHh8kFHICmnRYzN6iUi6gSpFJ3yAvCeh1W9Qpgevsrjvk90FzYTToQfn6wHAQiucQPtvNkok/1UqYjGW2kl8dukzQwaDfwWw6QqNeRq1ShGVqWChj1s9LWZSKEoi9Pc3G8yfBkGkzjAB46LSb1OUbzJ2GezEDUUhTp3kGUbijq6id7dC7iBw32Wn2GtbmEwdjCrgqLMqqIsPUJ9ipY6hzGcRUEBCDfh/NXjhMBBnbOgIngntQ6aBOTRuMA7KhhxjwHQ2e84fIkXUaJcaxJvsTx/XZ7fgpsv+PP4W/aonDb9iaR9nqLM8fAAAAAElFTkSuQmCC","aspectRatio":1.7857142857142858,"src":"/static/c57dfd2b558eb9fbf7f70f023689ed25/3891b/day-9.png","srcSet":"/static/c57dfd2b558eb9fbf7f70f023689ed25/3ba9f/day-9.png 100w,\n/static/c57dfd2b558eb9fbf7f70f023689ed25/8ac63/day-9.png 200w,\n/static/c57dfd2b558eb9fbf7f70f023689ed25/3891b/day-9.png 400w,\n/static/c57dfd2b558eb9fbf7f70f023689ed25/8c332/day-9.png 600w,\n/static/c57dfd2b558eb9fbf7f70f023689ed25/bc8e0/day-9.png 800w,\n/static/c57dfd2b558eb9fbf7f70f023689ed25/54311/day-9.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Started exploring VS Code documentation around developing your own extensions! I've had a few ideas popping around my head for a bit now, so I'm stoked to have familiarized myself with the development process!

\n

VS Code's documentation is super thorough and clear — if anyone is interested, this is the documentation that I was reading this morning.

\n

Keep an eye on this space: I may have more than just an example-extension built before long 😏

","frontmatter":{"day":"08","title":"Building my first extension for VS Code","publishDate":"2021-02-16","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAIAAADwazoUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAnklEQVQoz2O48vY/2YgBl8RlIHrz79Kbf5ffkK75KhC9+3/zw//r70jUDLTw3Kt/F1/9ylh1vePk1+vvidYMdOetj/8b97+0mXi6ctuDrP0/Lr7+d5VYzW//X3v/v3f/o7hVd32WPwnf+uXSm/9XiXc20PIb7//f+/S/Ys+rSee/A31+mbTQBgf1/U//b38gPbQh6CLICHI1k5lIiEEAwNtUuVSZGBgAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/06dbd2b16bfe840ee591fcc1aeb1a54b/3891b/day-8.png","srcSet":"/static/06dbd2b16bfe840ee591fcc1aeb1a54b/3ba9f/day-8.png 100w,\n/static/06dbd2b16bfe840ee591fcc1aeb1a54b/8ac63/day-8.png 200w,\n/static/06dbd2b16bfe840ee591fcc1aeb1a54b/3891b/day-8.png 400w,\n/static/06dbd2b16bfe840ee591fcc1aeb1a54b/8c332/day-8.png 600w,\n/static/06dbd2b16bfe840ee591fcc1aeb1a54b/bc8e0/day-8.png 800w,\n/static/06dbd2b16bfe840ee591fcc1aeb1a54b/54311/day-8.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Today was spent refining the mobile-responsiveness of my portfolio site. Few things better/worse than a gracious soul reaching out to let you know that your site looks ~not-great on [XYZ Device]. Shoutout to those gracious souls.

\n

Check out my portfolio site and be sure to let me know if your phone's display looks anything less than clean | clear | crisp.

\n

Also finally sat down and integrated Google Analytics into my site, so now I have a nice flow of #data.

","frontmatter":{"day":"07","title":"Google Analytics & Media Queries","publishDate":"2021-02-15","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABDElEQVQoz2Mw+H/mPzUxA5jx7zQY6yOxYXxsYlj5cAORJAz/nfqv+//cf73/Z/8boGnEh5EtYYC5AmSY2v/L/62+Hfxv8evIf/2/p4GGnwdbALNED8pG8CEY2TdgFxoCsTZQc+jP9f+vrDb4H3ll0X/7u7v+u97c8t/p3o7/3ufX/bd/tOu/893t/x1A9L3t/x0f7vrvcmfbf8u3B1FdCGNo/7/wv+l19//Nh4L+27/Z89/i3eH/ti/2ATXuBBq89b/Fh8P/Ld8d/G8FNMD2+d7/lu8P/bd+c+C/2ecj2L0M4mgCDVX+fx3sNZBXdOFePI/Vy/DwRvcyIlJO/zf6e5LoyMAaKbRJh4PZQAAtsIsKqRSDKgAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/26e63ef9bea47522828f1a852418b982/3891b/day-7.png","srcSet":"/static/26e63ef9bea47522828f1a852418b982/3ba9f/day-7.png 100w,\n/static/26e63ef9bea47522828f1a852418b982/8ac63/day-7.png 200w,\n/static/26e63ef9bea47522828f1a852418b982/3891b/day-7.png 400w,\n/static/26e63ef9bea47522828f1a852418b982/8c332/day-7.png 600w,\n/static/26e63ef9bea47522828f1a852418b982/bc8e0/day-7.png 800w,\n/static/26e63ef9bea47522828f1a852418b982/54311/day-7.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Fine-tuned my Figma skills! I've been playing around with a few different programs for designing mockups + wireframes, and I've really come to enjoy Figma. Planning to be better about using Figma (or an equivalent) on non-client work too to get plenty more chances to practice it.

\n

Figma might just have earned itself a spot as my default prototyping tool at this point.

","frontmatter":{"day":"06","title":"Prototyping with Figma","publishDate":"2021-02-14","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABA0lEQVQoz62SvUoDQRSF81Q+VLpg4RPY+AIpgqCgpBLRwp3ZbFRCGkuJjYUhs5M/AxqCaTS753hnQxYl2chIisu5zM/HOXemRG25yyoVbUDFuUL1pMyvNerYD5hfbIzI5pvoKxgOcuh/HApgxMXFA+bVKj7Prphcd7iCFoGLgUGPvH3nvHYMU97D7Ggfi7qCOM3i0xeYKtGmoT2Z8OZgiEo0RnQ3AQPDRFvAN3LqHISWT5cvPDzt8Px+iudI5ijuUpfAF5hoiRWMGbZbKD/WBNSFi5m611Wxf2RkFy2/tMGH7gLKwjlzIGxziOU81kpgonGmVP0f/ebzq/rTodO1fss//AaUEhCxXSlIhgAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/c56890b2826d30f51e46536ebadff364/3891b/day-6.png","srcSet":"/static/c56890b2826d30f51e46536ebadff364/3ba9f/day-6.png 100w,\n/static/c56890b2826d30f51e46536ebadff364/8ac63/day-6.png 200w,\n/static/c56890b2826d30f51e46536ebadff364/3891b/day-6.png 400w,\n/static/c56890b2826d30f51e46536ebadff364/8c332/day-6.png 600w,\n/static/c56890b2826d30f51e46536ebadff364/bc8e0/day-6.png 800w,\n/static/c56890b2826d30f51e46536ebadff364/54311/day-6.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Dedicated today to familiarizing myself with technologies that I currently only really know the name of… in other words, a pleasant, albeit cold Denver afternoon of hot coffee + Youtube and simple coding examples. “Crash course” highlights include: Docker, Kubernetes, Drupal, GCP, and Regular Expressions.

\n

Also spent some time with Dan Abramov's whatthefuck.is, a nice little (but growing) compendium of explanation-worthy JS terms. (Sidenote: I can never help but recommend Dan's JustJavaScript \"course\" to anyone new to programming, or anyone who enjoys exploring mental models!)

\n

Learned in lots of directions today, which kinda feels a little obtuse, but I personally see a lot of value in having basic understandings of what each of these technologies are at their most simple level (if only to build better mental models of how they interact/pair with other technologies).

","frontmatter":{"day":"05","title":"Learning feat. Dan Abramov","publishDate":"2021-02-13","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAAA+0lEQVQoz62S3WrCQBCFfTuxCmriSwg+gAWh72DtG9mirt5p8EJMdpNYf7JBRMVCzXGSTZUKSS704uMMOzuHGWZy9lDDM8ndPwhWJdWJWgY6/Q1rqrHeGYZGykwD7xfBe/lUxOAlrlOmKR1WsJq24FsfxLvCDLUDSSrNdpT7nryRqTIS6SOX8bM3EAQBjjsHh60gdYklTgdJeDj/HuEJE/MvqhkljHxtnwx3Kwa58LERFsHh2TY2EQ6k62K79iHGBuafGpxMw2EFnNVh9l9hsZjBnzYVFM+6DfBo5JSlXJOsRHGBNBlnVMpeyi1JJ5EF0/83kbSUpx/2o1wACAGmiQRTxM8AAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/3ae70c8b3db3731ae77e71e170cf2a3b/3891b/day-5.png","srcSet":"/static/3ae70c8b3db3731ae77e71e170cf2a3b/3ba9f/day-5.png 100w,\n/static/3ae70c8b3db3731ae77e71e170cf2a3b/8ac63/day-5.png 200w,\n/static/3ae70c8b3db3731ae77e71e170cf2a3b/3891b/day-5.png 400w,\n/static/3ae70c8b3db3731ae77e71e170cf2a3b/8c332/day-5.png 600w,\n/static/3ae70c8b3db3731ae77e71e170cf2a3b/bc8e0/day-5.png 800w,\n/static/3ae70c8b3db3731ae77e71e170cf2a3b/54311/day-5.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Had a busier day today + it was Friday, so I didn't have quite as much time to throw at code today as I would've liked.

\n

However, I tried to at least get a couple hours throughout the day working on Algo challenges in LeetCode. I've used HackerRank and some others for code practice, but had never actually used LeetCode until today. So, I got an account setup and dove into a few 'easy' algorithm challenges. Made it all of the way through 'Plus One' and 'Sqrt(x)' (eventually).

\n

Really enjoy working through algorithms when I can finally force myself to sit down and just work through them. Fun mental exercises. Hoping to integrate daily (or daily-ish) LeetCode challenges into my schedule here soon.

","frontmatter":{"day":"04","title":"LeetCode Kickoff: Algorithms","publishDate":"2021-02-12","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABPUlEQVQoz5WS3ytDYRzGl1sWbWOcH/kTkBvFneJClGRFKcvu3EiKpJVbcoe9x9GwrcWFf2LXXJJcc+vGds5sq4/3nOzE2mzn4ulb37f30/P0fQKqYdNKirB+ZgnF2V2UvV0rBdrCUkVUs4pulFBPPyS4jOq+WZ0D/8Auayjnn3RNJOg7eERLI/fSsejU4a+YLkx+Do3NkFwdZvb6mYiooYk60GoPVDyHMpp01js+TzB2TDxf4NZM0J+yGRRlF9bMZVOHTkQtB+GlQ3rm9pm6h/XsC1v5B+K5JzQPZvkAZiGyckJwepPRPCxk3tnOFVjOvEqg7T+yI82sEJxcQ1vcYe8mw525QTj1xZDfyPVL6xIYOqsQSx5xld5lxHgjalSlQx9HaSy0M6OyKt0CBsT/sM6K7UzZR90oNsCaA78BobdBHex3OFcAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/ca684f119cb0295bde208eb722f364af/3891b/day-4.png","srcSet":"/static/ca684f119cb0295bde208eb722f364af/3ba9f/day-4.png 100w,\n/static/ca684f119cb0295bde208eb722f364af/8ac63/day-4.png 200w,\n/static/ca684f119cb0295bde208eb722f364af/3891b/day-4.png 400w,\n/static/ca684f119cb0295bde208eb722f364af/8c332/day-4.png 600w,\n/static/ca684f119cb0295bde208eb722f364af/bc8e0/day-4.png 800w,\n/static/ca684f119cb0295bde208eb722f364af/54311/day-4.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

Today was all about the CSS. As a designer at heart, one of my absolute favorite things is playing around in CSS and seeing how I can shift the tone / feel / emotions of a site without ever touching the content. There is so much storytelling that happens implicitly in design — trying to harness and focus that storytelling is always a fun exercise.

\n

Bootstrap is likely still my go-to framework, but today was all about Tailwind.

\n

I also threw some time at playing with some more complicated CSS animations / transitions... Read a really great piece by Tobias Ahlin about Meaningful Motion with Action-Driven Animation. Spoke to using action-driven animation rather than state-driven animation... super interesting.

\n

More to come!

","frontmatter":{"day":"03","title":"Tailwind CSS + Other CSS Goodies","publishDate":"2021-02-11","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABS0lEQVQoz4VSXU/CQBDsb/ZFMKgxERMVDQlggkoUbPGpDyjIRw1XAidQKLRA1H8z3h4fuVQufZjcZm9ubmd3jaMPFyqSDbY7D+tdpJo9nHX6EhRTTuVE3xs6MTpv3DFK4wDlyUKCYsrt4/4TjBLygyksf4WX6RIVBZQriDudqBEtmSxdsxGqs5UU2FZX9kI8b2D6S8EZSm6s5WTDldaehEhxFMgKreAH1fAXloA5/5bxo7dY8+MEj0XjS+MQadGrA6ePPJ8gY9dxab/j9q2FTK2JdNVGttnFqTNAIlLlXsEHUVmKcVxxT9rOtcWAai1kGw5ynR5yLYY79oWTdh8J3VBU0eJwJntIvavssfwqznvRlti1WQ+F4eKTy97tBiKwHQjFdEcc4moF1d/IBu0bPTQ3q6PGdKda1a5NVPTc4ShwX/R0LkEx5XRihD9Q3ppIqkPRCAAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/925c75f6285c2ecebc1eaaf913efecbc/3891b/day-3.png","srcSet":"/static/925c75f6285c2ecebc1eaaf913efecbc/3ba9f/day-3.png 100w,\n/static/925c75f6285c2ecebc1eaaf913efecbc/8ac63/day-3.png 200w,\n/static/925c75f6285c2ecebc1eaaf913efecbc/3891b/day-3.png 400w,\n/static/925c75f6285c2ecebc1eaaf913efecbc/8c332/day-3.png 600w,\n/static/925c75f6285c2ecebc1eaaf913efecbc/bc8e0/day-3.png 800w,\n/static/925c75f6285c2ecebc1eaaf913efecbc/54311/day-3.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"

A little less code, but a lot of video content today. Reading articles + watching videos about GitLab and Unit Testing. Trying to fill some knowledge gaps around DevOps lifecycle tools + CI/CD + deployment pipelines.

\n

Also spent a fair amount of time messing around with Material UI and my custom MUI theme for this site.

","frontmatter":{"day":"02","title":"GitLab + CI/CD Learning","publishDate":"2021-02-10","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABG0lEQVQoz2P4vmvDf3T8bed6OA1jo/ORxZExA80NRNGweyMYww1C4uMyFIsLoZr3bvn/ZeXs/x+ndwDZm8H446zu/5+Xzfj/fd8WUlwIxDvW/v9xePf/Nw3F/58l+QHZu/7/OLrn//O0oP+vq3LBciA1ILWEXQjz3j6gq/q8/n9NUP3/Isnr/4tEEFv9//cuV6Brod4mystghZDw+b024P//Zqn/L9wU/z93Ufr/r0Hq/+813kC5df+/wdQS9DLclRvBXvq9Mfv/xzS1/x+TVP//Xp8OjaCNEDW7iPUy3FCgBft2/v+2ouP/t2WtEPZOVDVExTLCdhAb6L09W/9/37MNzAanArhh64lL2N+RXAhJRuvAGMLG7jIYBgBerNcTtAdQygAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/ac87c4d369811dcad4b1f962f4da3c04/3891b/day-2.png","srcSet":"/static/ac87c4d369811dcad4b1f962f4da3c04/3ba9f/day-2.png 100w,\n/static/ac87c4d369811dcad4b1f962f4da3c04/8ac63/day-2.png 200w,\n/static/ac87c4d369811dcad4b1f962f4da3c04/3891b/day-2.png 400w,\n/static/ac87c4d369811dcad4b1f962f4da3c04/8c332/day-2.png 600w,\n/static/ac87c4d369811dcad4b1f962f4da3c04/bc8e0/day-2.png 800w,\n/static/ac87c4d369811dcad4b1f962f4da3c04/54311/day-2.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}}]},"site":{"siteMetadata":{"title":"Tyler's 100 Days of Code"}}},"pageContext":{"limit":9,"skip":36,"numPages":6,"currentPage":5,"pagePath":"/5"}},"staticQueryHashes":["1307492417","63159454"]}