The Start Of 30 Projects In 30 Days

#codenewbie

Welcome to my first post! This is my first Dev writing and I look forward to being a more active participant in this community!

A Quick Backstory

COVID 19 affected us in so many ways. For me, it is being stuck outside the USA as I was finishing my remote engineering boot camp. As the pandemic hit, my one-way ticket home was promptly cancelled as the country's government where I currently reside shut land, air, and, sea borders even instigating a month-long pedestrian and traffic curfew.

Despite this, I was still positive and looked forward to the job hunt, joining an eight-week accelerator program to learn how to work with other developers remotely. I continued to practice algorithms and take on a project for a nonprofit I was given an opportunity to build all while job searching.

Well, it's been six months and a roller coaster of ups and downs in the job hunt where I found myself grateful for being able to do a handful of interviews and coding challenges. Yet, I do not have an official job. Needless to say, I am still abroad with no clue as when it is safe enough to go home.

Recently, I found myself feeling demotivated to build things that help solve real-world problems which is really my only reason to get into programming. So I found myself with my own problem: How can I maintain my own motivation with coding? How can I make it more fun?

Taking It On

After some thought, I decided to take on the 30 projects in 30 days challenge after being inspired by the 100 projects in 100 days challenge

I have several reasons:

I can just focus on coding things up for fun without feeling any pressure.
Skill decay is a real thing and I want to make sure I make the most out of what I've learned so far.
I figure this will help me with my coding challenges (at least on the skills-end) that might come up in the future.
30 days is reasonable.
I want to avoid burnout.

My Rules

Generally, I will loosely follow Florin's foundational rules and added a couple of my own:

I must start a new project every day but all projects must be completed by the end of 30 days.
Talk about what I've learned and how this helps me in development (most important)
Post about it on Dev

Timeline

Start: September 14, 2020 (first day of coding)
End: October 13, 2020 (last day of coding)

Sample Project

I took a project challenge from Frontend Mentor and gave myself two days to do it. I started this simple HTML, CSS and Javascript project at 6PM on a Thursday and completed it around 2AM on Saturday.

The project is a simple article preview component with a share button to click. From that click, a share component appears with icons. The share button also changes colors while it is active. You can check out my repo here.

Even though, I didn't work on it all day on Friday, it gave me a shocking sense of use-it-or-lose-it. I have gotten used to coding using React, styled-components and JSX so right off the bat, I got frustrated with not having error boundaries to tell me what is going wrong. My intuition about skill decay was dead on.

Progress Is Not Linear & What I Learned

squigly — I like to call this growth mindset

It was great being able to review fundamental HTML and CSS, as well as vanilla Javascript. I thought I would struggle coding up the simple Javascript functions, but it was surprising to discover that it was the easiest part of the challenge.

In the end, what I took away from this sample project was an in-depth review of parent and child relationships. I aimlessly coded my way through trying to lock an absolute positioned element horizontally and learned that I needed to set an invisible parent element inside the body to relative but this element has to be above the target element. When using global styles with styled components or style sheets that come with React libraries it was easy for me to overlook things like these.

Now I get to walk away with a better understanding of how absolute and relative elements work!

How This Can Help Me

For the nonprofit application I am working on, I took on writing my own drop down component instead of using a package. I will be building additional screens to add more features that will require the drop down component that I made but will most likely be a different size from the original. My recent review with absolute and relative elements will help me style them more efficiently.