DEV Community: Mario Hoyos

Tools I wish I had known about when I started coding

Mario Hoyos — Thu, 11 Jun 2020 17:19:21 +0000

In the tech world, there are thousands of tools that people will tell you to use. How are you supposed to know where to start?

As somebody who started coding relatively recently, this downpour of information was too much to sift through. I found myself installing extensions that did not really help me in my development cycle, and often even got in the way of it.

I am by no means an expert, but over time I have compiled a list of tools that have proven extremely useful to me. If you are just starting to learn how to program, this will hopefully offer you some guidance. If you are a seasoned developer, hopefully you will still learn something new.

I am going to break this article up into Chrome Extensions and VS Code extensions. I know there are other browsers and other text editors, but I am willing to bet most of the tools are also available for your platform of choice, so let’s not start a religious argument over our personal preferences.

Feel free to jump around.

Hey all! I had compiled this list about two years ago, shortly after I started programming, and I found that is was helpful to a lot of folks, so I wanted to resurrect it.

While the way I do some things has changed a lot in the last couple of years, these all helped me a lot when I was just getting into web development, and hopefully they might help you too!

Chrome Extensions

Now that I am a self-proclaimed web developer, I practically live in my Chrome console. Below are some tools that allow me to spend less time there:

WhatFont — The name says it all. This is an easy way of finding out the fonts that your favorite website is using, so that you can borrow them for your own projects.
Pesticide — Useful for seeing the outlines of your HTML elements and modifying CSS. This was a lifesaver when I was trying to learn my way around the box-model.
Colorzilla — Useful for copying exact colors off of a website. This copies a color straight to your clipboard so you don’t spend forever trying to get the right RGBA combination.
CSS Peeper — Useful for looking at colors and assets used on a website. A good exercise, especially when starting out, is cloning out websites that you think look cool. This gives you a peek under the hood at their color scheme and allows you to see what other assets exist on their page.
Wappalyzer — Useful for seeing the technologies being used on a website. Ever wonder what kind of framework a website is using or what service it is hosted on? Look no further.
React Dev Tools — Useful for debugging your React applications. It bears mentioning that this is only useful if you are programming a React application.
Redux Dev Tools — Useful for debugging applications using Redux. It bears mentioning that this is only useful if you are implementing Redux in your application.
JSON Formatter — Useful for making JSON look cleaner in the browser. Have you ever stared an ugly JSON blob in the face, trying to figure out how deeply nested the information you want is? Well this makes it so that it only takes 2 hours instead of 3.
Vimeo Repeat and Speed — Useful for speeding up Vimeo videos. If you watch video tutorials like most web developers, you know how handy it is to consume them at 1.25 times the regular playback speed. There are also versions for YouTube.

VS Code Extensions

Visual Studio Code is my editor of choice.

People love their text editors, and I am no exception. However, I’m willing to bet most of these extensions work for whatever editor you are using as well. Check out my favorite extensions:

Auto Rename Tag — Auto rename paired HTML tags. You created a <p> tag. Now you want to change it, as well as its enclosing </p> tag to something else. Simply change one and the other will follow. Theoretically improves your productivity by a factor of 2.
HTML CSS Support — CSS support for HTML documents. This is useful for getting some neat syntax highlighting and code suggestions so that CSS only makes you want to quit coding a couple of times a day.
HTML Snippets — Useful code snippets. Another nice time saver. Pair this with Emmet and you barely ever have to type real HTML again.
Babel ES6/ES7 — Adds JavaScript Babel syntax coloring. If you are using Babel, this will make it much easier to differentiate what is going on in your code. This is neat if you like to play with modern features of JavaScript.
Bracket Pair Colorizer — Adds colors to brackets for easier block visualization. This is handy for those all-too-common bugs where you didn’t close your brackets or parentheses accurately.
ESLint — Integrates ESLint into Visual Studio Code. This is handy for getting hints about bugs as you are writing your code and, depending on your configuration, it can help enforce good coding style.
Guides — Adds extra guide lines to code. This is another visual cue to make sure that you are closing your brackets correctly. If you can’t tell, I’m a very visual person.
JavaScript Console Utils — Makes for easier console logging. If you are like most developers, you will find yourself logging to the console in your debugging flow (I know that we are supposed to use the debugger). This utility makes it easy to create useful console.log() statements.
Code Spell Checker — Spelling checker that accounts for camelCase. Another common source of bugs is fat-thumbing a variable or function name. This spell checker will look for uncommon words and is good about accounting for the way we write things in JavaScript.
Git Lens — Makes it easier to see when, and by whom, changes were made. This is nice for blaming the appropriate person when code gets broken, since it is absolutely never your fault.
Path Intellisense — File path autocompletion. This is super handy for importing things from other files. It makes navigating your file tree a breeze.
Prettier — Automatic code formatter. Forget about the days where you had to manually indent your code and make things human-legible. Prettier will do this for you much faster, and better, than you ever could on your own. I can’t recommend this one enough.
VSCode-Icons — Adds icons to the file tree. If looking at your file structure hurts your eyes, this might help. There is a helpful icon for just about any kind of file you are making which will make it easier to distinguish what you are looking at.

Operating System Agnostic

Postman — At its most basic, this is an application that allows you to test the different endpoints of an API. You know, that good CRUD stuff. Once you dive deeper into it, you will find it is also incredibly useful for writing up test suites and much more.
Insomnia — This is an open-source alternative to Postman. It appears to have a lot of the same functionality with a slightly lower price tag for their premium packages. Between this and Postman, the choice seems to mostly be personal preference for the UX. Don’t stay up all night making a decision between the two (I had to, forgive me).
Restlet — If you don’t want to download either of the above, this is an API testing client that is available as a Chrome extension. It even allows the importing of Postman tests and several other formats.
Charles — This is a sweet web debugging proxy that allows you to view all of the information you could possibly want to see about the requests being made between your machine and the internet. It basically turns you into a hacker, allowing you to check your website for security vulnerabilities and such.
Fiddler — Basically the same tool as Charles. Personal preference seems to be the main deciding factor between the two, though both can greatly increase your debugging/troubleshooting capabilities.
Flux — If you’re reading this, chances are you probably spend a ton of time on your computer. Flux is a program that turns the blue light down on your screen as the sun sets, with the hopes of mimicking the day/night cycle and helping you sleep better. Not as good as getting time away from the screen, certainly, but it’s better than nothing!

Mac Specific

Paw — A competitor to both Postman and Insomnia above, Paw is a similar piece of software that feels more like a native Mac application than the others. If you love that Mac feel, this might be the API tool for you.
Dash — With over 200 documentation sets to search through, Dash is an offline goldmine of documentation for the developer who loves to read documentation so much that they do it even when the internet is out.
Bear — Not directly coding related, but a neat piece of software for taking notes if that is something you do in your day-to-day. I can’t help but wish that this would be integrated with Paw somehow, for pun-related purposes.
Magnet — Okay. Fair warning: This one costs money. If you can afford to dish up the 99 cents, however, I think it is worth it for those tough times when you don’t have access to a second monitor. This tool allows you to easily snap different windows to separate areas of your screen so you can run multiple terminals at once and tell your mom you are a hacker. (They are not paying me for this recommendation, sadly. However, if you are the creator of Magnet and you wish to pay me, please get in touch).

Windows Specific

ConEmu — If you are on Windows and you would like to have multiple terminal tabs, this is an easy, free solution to your tab-related woes. Never again will you have to flip back and forth through entire windows just to look at your different error messages.
Ditto — You know when you’re trying to copy four separate answers from Stack Overflow and you have to keep switching back and forth from your browser to your IDE? Worry no more. With the Ditto clipboard manager, you can copy-paste your way to victory.
TouchCursor — Programmers of all sorts are notorious for wanting to use the mouse as little as possible. If you find yourself in that camp, then this will be right up your alley.
Cmder — I am going to forego my description of this product, as I feel the description on their website is much better — “Cmder is a software package created out of pure frustration over the absence of nice console emulators on Windows. It is based on amazing software, and spiced up with the Monokai color scheme and a custom prompt layout, looking sexy from the start.” I don’t know about you, but I am a fan of any software that describes itself as “sexy”.
Directory Opus — This is basically what Windows Explorer should have been from the start. Opus allows you to dig through your poorly-organized documents almost as if they were well-organized.
Zeal — With over 200 documentation sets to search through, Zeal is an offline goldmine of documentation for the developer who loves to read documentation so much that they do it even when the internet is out. (Copy-pasted from Dash in the Mac section).

In Conclusion

You likely have your own set of tools that are indispensable to your development cycle. Hopefully some of the tools I mentioned above can make your workflow more efficient.

Do not fall into the trap, however, of installing every tool you run across before learning to use the ones you already have, as this can be a huge time-sink.

If you have any questions or want to chat hit me up on Twitter - I'm an open book.

CS Degree VS Coding Bootcamp VS Self-Taught

Mario Hoyos — Tue, 09 Jun 2020 22:23:55 +0000

When it comes to becoming a professional programmer, there are three paths that people usually take.

Go to school and get a bachelor’s (at least) degree in computer science.
Attend a coding bootcamp.
Teach themselves how to program using online resources.

All three options are tried and true, but here we’ll see which is best for you.

Things to consider 🤔

Like most important decisions in life, we will have to consider the following:

How much money you have.
What obligations, or how much free time, you have.
How self-disciplined you are.

There are other factors you might have to account for in your decision, but most of our constraints are related to the above in one way or another.

Pros and Cons

Yes, it’s cliche. Yes, we’re going to do it anyway.

Computer Science Degree 📚

Graduating from a university with a CS degree is historically the “default” way to get a programming job. For the sake of argument, let’s consider a 4-year CS degree.

Pros 👍

Easiest way to get in the door - Employers see a CS degree as proof that you’ve done some amount of programming and understand the underlying theory. It wasn’t until recently that major tech firms like Google removed it as a requirement. When you are competing against self-taught devs or bootcamp grads, having a CS degree is a surefire way to set yourself apart.
The college experience is about much more than just the classes - I think this is the biggest upside, particularly if you are young and still trying to make sense of the world. You will learn about time management, work with people from diverse backgrounds, pick up some soft-skills, and learn about topics outside of your major. Plus, you can have a lot of fun along the way! Though I don’t practice as a pharmacist anymore, I wouldn’t trade away the memories and friendships I made (it’s where I met my fiancé after all). Some of the soft skills I learned in that time have been crucial for leveling up quickly as an engineer.
Deep dive into computer fundamentals - These days, we have amazing abstractions that allow you to write meaningful software without really understanding the underlying technology, which is amazing. However, I’m often in awe of the way some of my CS-degree-wielding coworkers understand the technology we build our systems on. I do think there’s an advantage there even if it’s hard to quantify.
Easiest way to build a network - Somebody once said “Your network is your net worth”. So far in my career this has proved to be true. Since I was a Sandwich-Artist at Subway, I have never gotten a job by randomly submitting applications. Strong relationships are the number one way to find out about new opportunities and to get your foot in the door. Sure, you still need the skills, but having an old roommate put in a reference for you is going tome your resume to the top of the pile.
Structured learning and accountability - This is huge for a lot of us. Though the curriculum can also be considered a con (see in next section), having guidance on what to learn and what order to learn it in is important. On day one, you learn about ones and zeroes, by year four you’re learning about distributed systems. The curriculum will vary depending on the institution, but you will undoubtedly graduate understanding how computers and their related technologies work. The grading/exam/project systems will keep you accountable in the process, which is great if you aren’t disciplined enough to work through one of these curriculums by yourself (like me 🙂 ).

Cons 👎

The curriculum might feel dated - Large academic institutions are slow to adapt to the quickly-changing technology world. A CS degree is designed to provide you with an understanding of fundamentals and theory, rather than, say, the latest JavaScript framework. If you understand the fundamentals, you can learn the rest. So while you may never use C in your day-to-day, having learned it you can probably pick up whatever language you’ll need rather quickly.
Usually the most expensive of the options - This shouldn’t be a surprise. The average cost of college over 4 years is 122k, while the average coding bootcamp is 13.5k, and self-teaching can be done mostly for free.
Might take the longest to complete - Coding bootcamps are 3-12months in length, while obtaining a CS degree usually takes 4 years. The amount of time you would have to spend self-teaching will vary widely and could be shorter or longer than the other two options.
Having to take unrelated classes - This could be seen as a pro, since being a well-rounded individual is likely to make you a better engineer in the long-term.

Coding Bootcamp 💻

A coding bootcamp is a short, accelerated, program designed to get you job-ready as a programmer in an average time of 14 weeks.

Full disclosure: This is the path that I ultimately took so I might have some bias towards this option. I’m trying to be as objective as I can but I wanted to be up-front about this.

Pros 👍

Less time investment than a CS degree and potentially less than self-teaching - Again, with most CS degrees requiring at least 4 years, and self-teaching time varying widely, a bootcamp is likely to be the fastest method for becoming a job-ready developer.
Nimble curriculum - Unlike universities, bootcamps are smaller institutions that are able to pivot with market trends. Because of this, you will usually see bootcamps teaching modern frameworks and languages that will match job posting demand in the area where the bootcamp is located and beyond.
Potentially bigger ROI than CS degree, but less than self-taught - Though there are different ways to pay for a bootcamp, almost all of them will run you less than 4 years of college tuition.
Tight-knit alumni network — Though smaller than university networks, bootcamp grads love to help each other out. Because the cohorts are generally pretty small, you are likely to build strong bonds with your peers which can lead to job opportunities in the future.
Accountability is built in, but what you give is what you get - Bootcamps differ in their curriculums and how they measure performance. Usually you will have to do individual projects, team projects, or both, which can give you some experiences mimicking what you might do on the job, which is great! Don’t believe that you can cruise through the program and have a job waiting for you at the end, though. You will have to put in serious effort if you want to see good results in such a short time.
Ultimate goal is to get you a job - Bootcamps are judged harshly on their job-placement rates. Because of that, they want ensure people get jobs. If they don’t do a good job of helping graduates find employment, their business ceases to exist. Because the incentive to get you employed is so strong, any decent bootcamp will spend a lot of resources to help graduates find positions.

Cons 👎

The competition is fierce - There’s lots of bootcamps and a limited amount of jobs in any given area. There’s also people with CS degrees hunting for the same jobs. There’s also self-taught programmers throwing their hats in the ring. You will not have jobs falling in your lap just because you completed a bootcamp. You will be competing with your classmates for the same jobs. It will require significant effort to stand out. The time it takes for bootcamp grads to land their first job, if ever, is all over the place. Know this up-front if you decide to take this path.
Lack of accreditation - Most states/countries don’t have the same regulations for bootcamps that they do for other academic institutions. This lack of quality control means you really need to do your research before choosing one. I recommend CourseReport.
Less depth in knowledge - By the end of a program you will be able to build a usable website. You will know how to write software in a high-level language. These are valuable skills. It’s likely, though, that you won’t understand much about how the technologies you’re using work under-the-hood. For most cases, that’s totally fine, but if your plan is to go work at FAANG, it might not be enough.
Less flexible than self-teaching — There are bootcamps that do part-time programs or night classes. Because they’re not as immersive as full-time programs, it can be harder to learn the material as efficiently. Not everybody can quit their full-time job in order to attend a full-time program, and even part-time programs might be more of a time commitment than some can muster.
More expensive than self teaching and payment plans can be considered exploitative - Again, make sure to read about what you’re getting into with the different payment plans, one plan, the Income Share Agreement has come under particular scrutiny lately.

Self-Teaching 🤓

One of the great parts about the tech industry is most companies care more about your skills than your credentials. If you can prove you are able to do the job, companies will be happy to pay you.

With an endless amount of online resources, it is possible to teach yourself the skills needed to be a professional, and many people have done so!

Pros 👍

Highest potential return on investment - Because there are so many free resources on the internet, even if you only make one dollar as a professional, your return on investment is already better than the other two options. We could probably come up with some complex calculation for how much your time is worth, and multiply it by how long it takes you to land your first job, and figure out a more accurate estimate that way, but that misses the point. Self-teaching can be FREE, or at least extremely cheap.
Most flexibility out of the three options - For the parent that has two jobs, this might be the only way. Even part-time schools/bootcamps maintain some sort of schedule. Maybe you can only focus on programming at 5am or at 10pm. Most online resources are self-paced, meaning you focus on them when you CAN focus on them. The flexibility of teaching yourself is unmatched.
More freedom to focus on a specific domain - When you get a CS degree, you’re going to learn a little about a lot. When you attend a bootcamp, you’re going to learn a lot about a little. Maybe neither of these options will cover the domain you’re interested in, say game development, at all or in enough depth for you to be productive in it. When you’re teaching yourself, you can start by figuring out where you want to end up, and tailor your curriculum towards that goal.
Could get paid to learn - There are people out there who managed to convince clients to pay them to learn. Say you’ve taught yourself some HTML and CSS and feel confident that you could improve your local bakery’s website. They agree to pay you \$1000 to update their online presence, but they’ll only do it if you can add an online ordering mechanism. You tell them, “Sure, no problem!”, knowing full-well you have no idea how to do that. Now all-of-a-sudden you are going to get paid to figure it out.

Cons 👎

Harder to build network - Though there are online communities that exist to help self-teachers succeed, it is more difficult to build a network of strong relationships when your didactic experience happens in isolation. You can attend meetups and network online, but it’s still going to happen less organically than if you’re going through this experience with a bunch of other people in the same room.
Accountability is harder to come by - When you decide you’re going to follow along with a tutorial series on YouTube, you’re the only person in the world who cares about whether you finish or not. Nobody is going to grade you on your performance, you don’t have any skin in the game financially, what’s to stop you from quitting once things get hard? If you are self-disciplined enough, you can overcome this, but for a lot of us this is the downfall.
Without structure, it is hard to know what you don’t know - Most people self-teaching will, at one point or another, find themselves in tutorial purgatory. When you don’t have a clear curriculum that gets you from point A to point B, you’re likely to take a million detours that you might not be relevant. There’s so much to learn, and when you don’t have the full picture, you can get lost learning low-impact material.
Will be more difficult to compete for jobs - Without the network advantage of a Bootcamp or a CS Degree, it is going to be tough to land that first job. You’re going to have to go above and beyond to set yourself apart. Even though graduating from a Bootcamp doesn’t hold the same weight as graduating with a CS degree, it still shows employers some level of dedication and passion for the position. When it’s just you, you have to prove that to them all by yourself, which can be hard.
Might take as long as CS degree or longer - Your mileage will vary depending on how much free time you have, how self-disciplined you are, and how lucky you get. There are no guarantees with any of these methods, but if, for example, you’re only able to dedicate 5 hours a week to learning while a CS student is spending 20 hours a week in lectures and a bootcamper is spending 80 hours a week going at it, the numbers aren’t favorable if time is of the essence.

🤷 So which one is right for me? 🤷‍♂️

Only you can know what’s right for you, but I would recommend something like the following:

CS Degree - This is a great option if you have lots of time, you don’t have many external obligations, and you have enough money to pay for 4 years of tuition or are willing to take out student loans. Out of the three options, this is the easiest one to get a job with, plus, college can be a ton of fun!
Coding Bootcamp - This is a great option if you can’t dedicate 4 years towards a degree, but you want some structure and accountability. Though cheaper than getting a CS degree, you will still have to pay something, and/or take out loans for it. Bootcamps can also be difficult if you have kids and/or can’t take 3-6 months off of your job. Coding bootcamps can help to keep you accountable and provide you with a modern curriculum.
Self Taught - Great if you are self-disciplined, are low on money, and/or don’t have time. If you are naturally curious, are willing to hold yourself accountable, and are okay to play the long-game, self-learning is an awesome option. This is particularly great if you can get clients to pay you to build them websites so you get paid to learn. This is the most flexible of all the options.

Lastly, keep in mind that everybody’s journey is going to be different. There’s too many moving parts, so try not to fall into the trap of comparing your results to those of others.

With enough determination and curiosity, you will get where you want to go!

In the meantime, if you have any questions or want to chat hit me up on Twitter - I'm an open book.

So you want to be a programmer - Are you sure?

Mario Hoyos — Wed, 27 May 2020 16:07:17 +0000

There are obvious reasons why somebody might want to become a programmer:

Software Developer was ranked the #1 job in 2020, based on more than pay alone.
There is a high level of autonomy, which we know helps people find meaning in their work.
The hours are generally flexible.
The potential for remote work is high.
The future is promising.

In addition to the more data-driven points above there are other, less measurable, pieces that I (and others I know) find fulfilling:

Solving ambiguous problems is infuriating sometimes, but it’s always worth the feeling of self-accomplishment when you figure it out.
It's usually easy to see the impact your work has on the company’s bottom line. Whether you’re writing code for your freelancing business or cranking out features for BigTechCo, you are building something tangible.
I work with people who are more intelligent than me everyday.
There is always opportunity for professional growth. Though the career-ladder differs by company, there is always a position to grow into, be it technical or management-oriented.
Programming is a skill you can use outside of work, if you want. As a silly example, I once wrote a script that emailed me when the apartment I wanted to move into was made available to lease. I am sitting in that apartment now.
There is never a shortage of new things to learn. Sometimes this can be overwhelming, but I find that it keeps things fresh.

Downsides to being a programmer

Being a programmer isn’t all ping-pong and kombucha like TV would have you believe. As with anything, it's just as important to consider the downsides.

The sheer amount of different things to learn can be overwhelming. There’s a running joke in the JavaScript community that there’s a new framework to learn everyday. Though an exaggeration, it feels that way sometimes.
The reality of building complex software is you spend a lot of time reading documentation, searching Google, and generally feeling like you are out of your depth. It can be maddening to spend an entire day trying to fix a bug, only to find out it was due to a missing semi-colon. The same things that make computers magical also makes them difficult to work with.
Most workplaces aren’t diverse enough. Though many companies are trying to get better (or at least pretend they are), most programming jobs are still held by straight white white males.
Burnout is not uncommon. Particularly in startups, the breakneck pace at which you are expected to work can be exhausting. Clients always change their minds, requirements always shift at the last minute, new bugs abound. Learning to manage this pressure takes time. Burnout sneaks up on the best of us.
Sitting at a computer all day is not good for your mental or physical well-being.
You won’t always be working on exciting features. Often, the project you are working on will get canceled. You’ll feel like you wasted your time. Then, even on exciting projects, you will spend much of your time on mundane tasks like writing documentation. You might go days without writing code.
The flexibility in your work hours can backfire if you're not careful. You'll find yourself working 12 hour days. Your Slack notifications will be going off deep into the night. When your work is as portable as your laptop, it can be difficult to find a work-life balance.

I'm sure there's plenty downside I’m missing. I have an inherent bias towards the benefits since I love what I do, so please keep that in mind.

Do I need to love programming to be worthy?

Gatekeepers be damned! There is nothing wrong with becoming a programmer to make money. There's bills to pay and mouths to feed.

Maybe you just want stable health-insurance. Maybe your dream is to work remotely from all over the world. All of your reasons are equally valid.

Coding does not have to be your undying passion. You don't have to start writing software in kindergarden to be successful. Having an innate interest in writing code makes it easier, sure, but it’s far from necessary.

There's a good chance you're reading this because you aren't passionate about your current job and you still get paid to do it right?

So now what?

I'll ask again, given the ups and downs:

"Are you still sure you want to be a programmer?"

It's OKAY if you don't! There's a million things you can do with your life. Just because this works for some doesn't mean it has to work for you.

If, however, you still want to give it a shot:

🎉 AWESOME! 🎉

I can say without hesitation that learning to code has been one of the best decisions of my life. I am SO excited for you!