A Simple Hack to Supercharge Your Skills and Your Portfolio
Tags: webdev, microprojects, skills, learning
Published: 2021-07-15 16:49:19

---
title: A Simple Hack to Supercharge Your Skills and Your Portfolio
published: true
description: 
tags: webdev, microprojects, skills, learning
//cover_image: https://direct_url_to_image.jpg
---

Yes, that title is totally click bait, but it's also totally true. I'm about to drop the absolute most effective way to both **acquire** and **showcase** developer skills. No other method or methodology even comes close. Here's my secret:

##Stop attempting big, personal projects. Do a ton of _micro-projects_.


Not convinced? Here are 3 simple facts:

1. **Big projects waste your time**
It sucks to admit, but you'll probably ***never*** finish that big personal software project. While it's certainly possible and some devs certainly do it, statistically that probably ain't you. Life is rather distracting, and we devs always seem to run out of _steam_ on such things. I have about 30 or so private Github repos of big ideas that only made it 5-50% of the way. Many of them from years ago, and some over a decade old. Let's be realistic and honest with ourselves. Smaller projects—those that take a few hours to a few weeks—are easy to follow through on, and as a bonus can more often give you that gratification of having created (and finished) something.

1. **Big projects are worse for your portfolio** 
You don't need a portfolio of big projects in order to show off your skills. In fact, they are really terrible for that. Other people (like prospective employers) might have to really dig into the code of big projects to reverse engineer what skills are demonstrated, and they'll never discover all of the ones you really want to showcase. Smaller projects are easier for others to consume and comprehend, and allow you to demonstrate specific skills very clearly.

1. **Big projects make you learn slower**
Big projects bog you down in boiler plate and stuff you already know. That stuff is time consuming and tedious, and trying to plug-in new tech that you don't quite understand can result in too many moving pieces to really grok those new concepts. Smaller projects let you focus on specific technologies and techniques that you want to acquire or better understand.

## Micro-projects
Micro-projects allow you to acquire skills and build a showcase of those skills very quickly. The key here—and maybe, yeah, the *secret*—is to pick tiny, manageable projects that focus on a discrete feature scope. A video carousel in React. A page scraping service in Go. A CSS demo of box shadows. Choose projects that you can easily complete in a week, a few days, or even a few hours.

In fact, I'd recommend trying *mini*, *micro*, ***and*** *nano* projects. What tf is the difference here? In the software world, examples are always useful. Here are some such projects I've worked on recently that illustrate this difference while also allowing me to shamelessly plug some of my own micro-projects:

1. ###[Doubly-Linked List](https://codepen.io/HoraceShmorace/pen/xxRjoEe)
**size: nano
time to complete: < 1 hour**

    No one should ever need a Linked or Doubly-Linked List in JavaScript, but it's the kind of exercise that *always* comes up in job interviews. I decided to whip up proof that I know what these things are, which took all of 40 minutes, tops.

1. ###[Side Scroller w/ Sticky Headers + Snap Points](https://codepen.io/HoraceShmorace/pen/bZXeKd)
**size: nano
time to complete: 2 hours**

    An example "widget" in HTML and CSS (no JS) that scrolls horizontally through slides with sticky vertical headers and snap points. I know... what? Click the link to find out. 

1. ###[React Stopwatch](https://dev.to/horaceshmorace/creating-a-full-featured-stopwatch-in-react-js-and-css-35a0)
**size: micro
time to complete: 3 days**

    After completing a coding challenge to create a clock in vanilla JS and CSS—which I did in record time (ha, pun!)—I was inspired to try an interactive stopwatch in React and SCSS.

1. ###[Particle Soup](https://codepen.io/HoraceShmorace/pen/ewNXyr)
**size: micro
time to complete: 3-4 days**

    Having trouble coming up with a project idea? Find someone else's project that inspires you, fork it, and make it better. That's what I did when I took this vanilla JS project on Codepen and made it into a streamlined micro React app.

1. ###[Image Flex](https://dev.to/horaceshmorace/an-open-source-and-completely-serverless-image-resizing-service-in-aws-589b)
**size: mini
time to complete: 1 week**

    A robust, secure, and easily deployable image resizing service that resizes, optimizes, and caches images on "the edge," on the fly, built on AWS Serverless technologies.

Very few of us have the actual time to do anything substantial on the side. What we *can* do is reduce the size and scope of a project down to something manageable—***micro***—while still creating something of value, and even worthy of acclaim. I'll play myself out with a list of free "code playgrounds" (mostly  front-end and Node.js) to create and run your mini, micro, and nano projects:

1. [Codepen](https://codepen.io/HoraceShmorace)
1. [Glitch](https://glitch.com/)
1. [JSFiddle](https://jsfiddle.net/)
1. [JSBin](https://jsbin.com/)
1. [Plunkr](http://plnkr.co/)
1. [Replit](https://replit.com/)
1. [Runkit](https://runkit.com/HoraceShmorace)

Of course, for open source, share your code (and follow me) on [Github](https://github.com/HoraceShmorace)!