The Frankenstein Method (Becoming a Dev Without The Fatigue)

Designed by Mike Mangialardi, See pure CSS version here: http://codepen.io/mikemang/pen/mOxGGL

What you’re getting yourself into: an introductory detailed story of my crisis in trying to become a web developer and concluding actionable steps I learned on how to avoid fatigue

Who is this for: Beginners to web development who are looking to have an action plan on their journey, those struggling to start their careers, and teachers looking to break their curse of knowledge and understand the issues students may run into

Wait until the end to click links: This post is loaded with links, I really encourage reading this through before clicking through.

Affiliate Links/Sponsored Post?: Nope and nope.

Background to My Post-Graduation Crisis (An Introduction)

In December 2015, I graduated with a generic Bachelor’s degree in Computer Science. I had a senior capstone project under my belt in which I created a web application from scratch using HTML, CSS, basic JavaScript, PHP, and MySQL. I was eager and excited to start a career as a web developer…but I couldn’t land a job.

I ended up settling for a job doing IT Support so I could have income and promised myself that I would use my time on the side to get caught up on the modern, massive JavaScript ecosystem. I felt a huge burden upon myself to prove that my 3.5 years at school were not a waste and struggled with the doubt of being an impostor.

While I was graduating, I got swept into the world of online entrepreneurship thanks to discovering Pat Flynn of Smart Passive Income. I had created two of my own separate businesses with a supplementary blog and become interested in social media marketing, search engine optimization, content marketing, and graphic design.

And there I was in midst of a massive conflict.

My Conflict

I had full time work at a job from 7:00–5:00 (plus the commute) that wasn’t utilizing my desired skill-set. I was craving to learn the JavaScript ecosystem.

I worked in a corporate office, and I was consuming non-stop information about how I could be my own boss and work my own hours.

I needed to take on projects as I learned to make JavaScript web app. But thought I was wasting my time if I wasn’t aiming at making a web app that could be turned into my own business.

All of this resulted boiling frustration at my current job and massive fatigue in actually learning JavaScript frameworks as I had intended.

How I Got Back on Track

After months off with not even looking at code and being too burnt out to do anything with all the entrepreneurial ideas fluttering in my mind, I finally took a deep breath and decided to slow down by learn JavaScript in manageable chunks.

Instead of trying to make an entire web application that could be a business, I decided to take on projects that were lean and manageable. While it is true that I could work towards a full-scale, business-ready web app in manageable chunks, the burden of completing it just served as a distraction and a possible cause of fatigue.

I also did the following to really get the feeling of a clean slate:

  • Created a new email address and throughly organized it
  • Setup an Evernote to organize notes, links, and resources
  • Made updates to my Twitter account so I could get access to useful development resources and blogs
  • Ran a massive audit on the files on my computer and organized my folder hierarchy
  • Created a new Github account
  • Created a new Codepen account and bought the PRO subscription
  • Created a Trello account to organize my tasks

As you can tell the a big boost into getting back on track was organization. This gave me a sense of a fresh start and I was ready to tackle learning web development skills in a manageable fashion, which I will outline below.

The Frankenstein Model

This is what I decided to call the outline of steps to take to get on track to web development without fatigue. Why Frankenstein? Good question.

  1. I wanted to make a cool Frankenstein vector graphic for this post.
Designed by Mike Mangialardi

2. Frankenstein is a creature that was put together with individual parts. I think the this encapsulates the value of breaking down your projects into to individual pieces. These pieces can then be rehashed and referenced to finally take on a full-scale project to exemplify your skills. But by separating boundaries between the two, there is less chance of fatigue and stress.

Frankenstein Model Components

  1. Get an overview of your end goal, perhaps a full-scale web app idea you have always had. Use this as fire, but put it aside for now so you don’t be burned.
  2. Grasp the big picture of the JavaScript ecosystem. Don’t try to learn all the components of the JavaScript ecosystem at once. Get the overview, understand what needs to happen even if you don’t know how. Medium is a great source to find articles like this. In particular, I found this article from Free Code Camp helpful.
  3. Start with projects you already can do. If you are like me and had a background in development, start by doing projects you already know how to do and get better at it. For instance, I used Codepen to make a ton of static landing pages. Codepen works nice since you can easily import tools without dealing with the manual configuration. This served as a refresher for my HTML/CSS knowledge. Along the way, I added more modern tools like Bootstrap and Animate.CSS to leverage my web design skills until I felt confident.
http://codepen.io/mikemang/pen/ORaJNR

4. Progressively make your projects harder. After completing projects I knew how to do and improving my skills during them, in my case static web pages, I went ahead and made learned the basics of React via Codecademy. While learning I assigned myself mini-projects after getting to a certain point of the tutorial. For example, I started with a simply made static landing page with React easily via Codepen.

Example Landing Page Made With React

After achieving this, I started to get a bit deeper by creating a React pen that changed the background of a web page on a button click. Next, an interactive Wrigley Field Scoreboard that required setting states and challenged me to make use of conditional statements like you would in any web application. Currently, I made a YouTube Video Player in React locally using a nice boilerplate and am venturing to learn Vue.JS (which I wish I learned first). I am ambitious to take these skills and eventually make a complete web app.

5. Share your work. One of the nice parts about using tools like Codepen is that you can easily host a web page and share with friends. You can also embed the pens on blogs such as I have or simply share via Twitter. Lastly, you can easily make a pen and upload it to Github to build a portfolio, organize your code, and boost confidence. Nothing helps fuel the fire like positive feedback when sharing your work. You’d be surprised how impressive a mini-application can be.

6. Fight the impostor syndrome. We all feel it. Someone starts spewing code talk and you awkwardly try to tell yourself you are tracking when you are not. Well, that’s ok and you aren’t alone! I still run into this and I went to school for 3.5 years learning computer science.

You are not an impostor if you are working on mini-projects. There are plenty of people who are in your boat and people who only got to where they are now with patience. The path to success is a marathon and not a sprint.

An easy way to fight impostor syndrome is to listen to people in a similar boat. The way I like to do this is through podcasts. I really enjoy Learn to Code with Me.

Conclusion

I hope this article was helpful to demonstrate that creating a Frankenstein through individual mini-projects is an easy way to relive fatigue. If all you take away is that you need to step back and take a deep breath on your journey to being a developer, I am happy to help.


Feel free to share this article, there are no affiliate links, but I would love to see this information help fellow devs, cheers!