The One with the Color Picker in Chrome DevTools

Photo by Markus Spiske on Unsplash | https://unsplash.com/photos/hqCEQTc5gZA

I was today years old when I learned that there is a color picker available within Chrome DevTools.

I was making tweaks to the homepage of my website. I use Bootstrap with some custom styling which was making for some weird spacing on larger screen sizes. I was debugging where the extra height was coming from by adding obtrusive background colors to all div elements.

Usually, I inspect an element and double-click it’s hex value in the styles panel to manually make a change. By mistake, I clicked the small color square next to the hex value and—whoa—a wild color picker has appeared!

Example of using Chrome DevTools to change a hex value
An example of using Chrome DevTools to change the hex value of a CSS property value

Pretty cool right?

In playing around with the tool some more, I see that you can use an eyedropper to pick out new colors, toggle the color values from RGA, hex, and hsla and even pick colors from the material design color palette.

This is great news for someone like me who wants needs to debug in the browser or wants to test new colors without opening up a text editor.

Here’s Google’s documentation on the tool and other CSS Reference features.

Chrome DevTools | CSS Reference

#CNC2018 “Code More” Mission #1: Goals, Assumptions, Risks

Photo by Anas Alshanti on Unsplash

Now, we’re in the first official week of the Code Newbie #CNC2018 “Code More” Challenge! Last week, I wrote about what has worked and not worked when it comes to goal setting. This week, the challenge focuses on what can prevent us from reaching the goals we set. Here are my thoughts.

  • I want to code more because:
    I really like learning about coding for the web. I’ve worked with code in one way or another for the past five years and I always come back to wanting to learn more about building websites. As a self-taught developer, I felt like I was always missing something from being an actual web developer (hello imposter syndrome!), so I tend to focus my energy on building that skill set. The web changes fast and I want to avoid becoming stagnant or falling behind!
  • I know I’ll have reached my “code more” goal when:
    This is a tough one. You’ll never know everything about code, or the web, or coding for the web. However, I consider myself as having met my goal when I can look back and clearly see what skill gaps I have filled or are working on filling. I also consider feeling more confident in my skillset as a sign that I have completed my code more goal.
  • My top three assumptions for reaching my goal are:
    • Working full time. After being in the office, sometimes, I do not want to spend more time staring at a computer screen. Also, my brain hurts sometimes 😐
    • Managing my time. See above. If I am clear about my goals, I can better manage my time and make progress. However, that is easier said than done
    • Personal life. As much as I love to learn to code and wish that was my full-time job, it is not. For me, there is more to life than sitting in front of a computer screen. Health, family, and friends are priorities too.
  • Of these assumptions, my riskiest is managing my time.
  • When I think about my riskiest assumption, three possible root causes are:
    • Prioritizing easy/instant gratification over long-term goals.
    • Saying “yes” to being lazy, instead of “yes” to being productive/working toward my long-term goals.
    • Being too generous with my time. I need to respect my own time in order to be successful.
  • 3 ways I might address these root causes are:
    • Do not overcommit! I’m guilty of taking on “all of the things” and not really having time to do them all. Or letting not-as-important things (I’m looking at you Netflix!) take up the time I do have.
    • Focus on one thing at a time. Humans are terrible at multitasking.
    • Track accomplishments. I did this last year and it made a big difference when I was feeling unaccomplished.
  • Of these, the biggest cause that’s worth tackling first is focusing on one thing at a time.

Photo by Anas Alshanti on Unsplash

#CNC2018 “Code More” Pre-Mission

Photo by Ash Edmonds on Unsplash

As part of the Code Newbie #CNC2018 “Code More” Challenge, here is my pre-mission homework:

GOAL: Understand what has and hasn’t worked in past attempts to code more, and start thinking about long and short-term goals.

What has worked?

  • Having an accountability buddy / going through a challenge with other people in my network
  • Saying my goals aloud (or on Twitter)
  • Setting SMART goals
  • Writing down my goals so that I can refer to there
  • Having a project where other people depend on me – I don’t want to let someone else down. For example, I was really happy with my Halloween countdown timer project that I did for Hacktoberfest. I didn’t talk myself out of participating. I was so excited to practice merge commits / etc that I was easily putting 3-4 hours in daily to keep it up to date. It was a project I was really excited about, it was fun, I learned a lot and was able to help other people practice as well. I really enjoy sharing what I’ve learned with other people. The positive feedback is a confidence booster too!
  • Based on the above, I know that I am someone who learns by doing. More than that, I like having a project that means something in the end. That is probably why most classes with fake projects don’t go well for me. I work full time so I don’t have unlimited time resources like I did in college

What has not worked?

  • Most free / cheap Udemy classes. The quality can go either way and I’m not as motivated to move through the material.
  • Setting goals that were to vague or unrealistic. I’ve since learned that I do better when I write things down and break them into smaller pieces. Sometimes learning to code every night isn’t realistic
  • Daily challenges don’t work so well for me. My mood, energy levels, priorities, etc, vary day by day, so the daily stuff doesn’t usually happen. For something that has expected checkpoints / time commitments (1hr a day OR 5 hours a week) I do tend to do better. Some days I feel like coding for several hours or I am in a good headspace to learn, others I am not
  • Rebuilding my portfolio has not been a project I’ve successfully completed since the last major redesign in 2013ish. I keep starting with great intent and not really going anywhere. I’m embarrassed at not having a site (or rather, an online presence that speaks to the work I do, etc) but it keeps not being a priority for me. I need to be ok with using a theme and filling it in with some killer content then waiting to build something from scratch that is perfect. I think I focus on the bigger picture and don’t break it down into small enough chunks. The deadlines I set are arbitrary / etc so I tend to scramble to having something up before a conference, etc.

What are your long-term goals?

  • To be a front-end developer! I can do front-end development work, but I feel like an imposter. I don’t feel comfortable as a front-end developer or that I’d be able to make it in a front-end developer role, and I would like to fill that gap. I’d like to learn or improve my skillset in the following areas (to start)
    • AWS
    • Bootstrap
    • Git
    • SASS
    • Javascript / Jquery
  • I’d like to expand my comfort level with design thinking and leadership. I’m torn between sticking with the developer route (which seems hard to get into) and the designer route (equally challenging since I’ve been out of the design game for a while).

What are your short-term goals?

  • By the end of this challenge, I’d like to have my website hosted on either github pages or AWS.  I would also like to make significant progress in the Udacity course I am taking.

 

 

The One About Self-Care

Rainbow Loom Elastics Macro by onetreehillstudios on Flickr

It’s been almost a month since I last posted on this blog.

And it’s been (somewhat) on purpose. However, a recent tweet and its responses prompted me to write this blog post.

You see, I felt like I was starting to lose my mind. Stress was getting to me. I was overwhelmed, negative, probably not fun to be around and found myself binging on Netflix more often than not (3hrs of NCIS? Yes please!)

It got to the point where I wasn’t excited or interested in learning to code. And that was huge for me. I love learning! I had spent most of my spare time this calendar year learning Javascript, Git, attending conferences and writing about my experiences.

Then, almost out of nowhere, the spark was gone. I’d go days without touching my home computer. Nighttime reading was comprised of clickbait and listicles instead of the literally hundreds of code or tech articles I had saved in the past few months. I just wasn’t interested in reading them. I didn’t feel like learning. I was burnt-out.

So I knew it was time to step back. I needed to take the pressure off. I put my “learning to code” goal on pause and felt ok with that decision.

Committing to not doing something that I was already not doing was easy. I put it into the universe and made peace with it. Saying it was easy, but I also had to avoid the urge to dive back in too soon. I set the loose deadline of “until December” in my head. Really, I wanted to “take a break” and focus on self-care.

via GIPHY

A few weeks into my self-care / no coding break and I’m feeling pretty good. I took some time off work, spent time with the people I care most about, ate so much good food / drank and even attended a cozy Harry-Potter-esque wedding. The stressors are still there, yes, but they don’t feel as overwhelming at the moment. Perhaps taking a break has given me some much-needed perspective.

I’m still exploring what self-care means for me, but I know comfort is a part of it. The weather is getting colder so the physical comfort of soft clothing, hot cider, cozy socks have been relaxing for me. I’ve rediscovered the term hygee and the idea of a minimalist lifestyle which I see as long-term ways to incorporate self-care into my life. I’ve also been reading more about self-care via Girls Night In.

How do you practice self-care?


Photo by John Douglas on Flickr