Don’t your dare inline style!!!

That is what I used to tell myself while I coded. Honestly, even though I knew it was frowned upon, I would also just inline style. It was my dirty little secret as a web developer. It just felt more natural for me and efficient. Sure it looks like a garbage can was dumped on some of my HTML elements, but … I … Code … So … Much … Quicker!

And then, my buddy introduced me to Tailwind CSS, a framework that is designed for 100% inline styling of elements. Not only did this completely vibe with my styling preference, it also allowed me to create intricate designs with ease. Here is my portfolio site, styled with Tailwind CSS.

How it benefited me

As I progressed with my web development skills I noticed all of my websites started to look the same. The reason was in part due to my lack of design skills but also, I would just use CSS frameworks that everyone would use like Bootstrap. Customization of a site for me would be… changing the color of a navbar.  By not having to operate within the parameters of components from other CSS frameworks, I was free to change the size, color, placement, etc. of any and everything on a web page. Rounding edges, changing background colors, adding shadows could be applied directly to any HTML element, instantly. I no longer had to fight against the other CSS frameworks guidelines for custom styling.

Summary

I had such a tremendous experience with this framework. I encourage you to give it a try. It’s a blast!

– The Coding Hotdog

 

Wasted Time And Effort – A Story

Let me tell you a story. It starts sometime last year and ends last night at 1 am. I built a wellness blog for a class project using the MERN (MongoDB, Express, React, Node) tech stack. The noteworthy thing about the project is that I wrote all the backend logic for an administrative dashboard. Unfortunately, I wasn’t happy with the look and feel of the site, so I didn’t deploy it to the web.

So, last night I am designing my portfolio site and I realize my portfolio could use more examples of backend experience. Queue that site! I take it off the shelf, dust it off, add a couple frog pictures and deploy it to the web. Perfect right? Nope. Not even a little.

Unfortunately, the file storage system I built doesn’t play well with Heroku, which means, if you login and add a post, a picture won’t show up. I spent some time trying to make it work and then I spent some time trying to resurrect a previous implementation of storing images in MongoDB.

I finally realize how much time I had wasted at 1 am. Not only is there no progress on the file storage issue, but now I am going to be a zombie the next day. Complete failure right? Nope. Not even a little.

I Got More Out of Failing…

Not gonna lie, I was feeling frustrated that I had wasted valuable time. I took time away from my wife and kid. I traded time for nothing tangible. But then I realized, I was just facing the Sunken Cost Fallacy. What is this you ask? According to The Decision Lab,

The Sunk Cost Fallacy describes our tendency to 
follow through on an endeavor if we have already 
invested time, effort, or money into it, whether 
or not the current costs outweigh the benefits.

If you check out the linked article, you’ll basically learn that people have a hard time calling it quits when they should because of their emotions. This is exactly what I experienced. My frustration and guilt for wasting time kept me coding late into the night.

Okay You Figured Out Why You Wasted Your Time, Why Does That Matter?

The thing is, I ultimately didn’t waste my time. I realized, my experience was just practice with overcoming the Sunken Cost Fallacy. I’m sure I will face this issue in the tech field. Acknowledging its existence and reflecting on ways of avoiding it now, will save me time later. For instance, the next time I’m coding just to justify all the time I have wasted, I am gonna take a step back and consider my feelings.

Conclusion

I could have chalked last night up as a failure. I didn’t and I ultimately feel better for overcoming it. I used the power of reflection and changing my point of view to grow as a person and developer. I analyzed a bothersome situation and distilled the positives from it. I encourage you to do the same!

– The Coding Hotdog

Personalize Your Integrated Developer Environment

Okay agreed, you shouldn’t care about my favorite color, or the fact that I used a Visual Studio Code extension called Peacock to change the color of my editor border.

But you should care about your developer experience. If you are anything like me, you spend an incredible amount of time coding. With so much time spent doing this, you should consider enhancing your experience. In this post I am going to share with you several personalizations I made to my developer experience that I still don’t regret. All of the ones I will share are for Visual Studio Code.

GitHub Theme

Don’t like the default color scheme of your IDE? Change it. I am currently using GitHub’s Dark version and it is fantastic. The shades of grey are very satisfying. Great color and contrast as well. Changing your theme will change border, tab, background and syntax colors. It is outstanding.

Indent-Rainbow

I just like seeing pretty colors and this extension helps me do that. At every indention level, there is a column of a highlighted aesthetically pleasing color. In addition to prettiness, it helps keep your code organized.

Bracket Pair Colorizor

Where does this bracket line up with? For the love of all things good, where?!!! Oh wait, I just need to match the yellow brackets and… here we go. Yep it’s that easy. If you don’t have this extension. Get it.

Prettier – Code Formatter

Lastly, VSC has functionality to autoformat your code upon saving. That means every time you hit save, an auto formatter like the one shown above will make sure all your spaces, indents, brackets, line-length, etc., are perfect. I have no idea why it took me so long to find this and can’t imagine life without it.

That’s Not All, But I’m Done Writing

In conclusion, make your life better by enriching your development experience. Enjoy the time you spend coding.

– The Coding Hotdog