Tag Archives: freecodecamp

100 days of code? Hell yes!

Right now, right now it is 23:05 pm on Friday 04/5/19 and I just saw r/girlsgonewired’s post about starting 100 days of code! I’ve been feeling a little discouraged, so maybe this is just the motivation I need.

I logged into the discord chat and people are declaring what they’ll be working on over the next 100 days. So, over the next 30 days, I want to complete the Responsive Web Design Projects so that I can get my FCC Responsive Web Design Certification. With the remaining 70 days, I want to complete the Javascript Algorithms And Data Structures Certification. Bueno, lets go!

Code on peeps,

Alex

Advertisements

FCC Tribute Page Revisited – part 2

Full disclosure: I really don’t know how many parts this tribute page is going to have. Due to work stuff (and finally getting around to playing Final Fantasy XII) this week was a slow week dev wise.

I went to Thursday’s meetup event and was impressed. There were a few technical difficulties but I was happy to see everyone keep their cool. Since moving here I’ve just felt so much more anxious about everything and I’m afraid to look like an idiot– but I’m learning something new and I’m going to look like an idiot, so I just need to put in the time until I reach the point where I know what I’m talking about. ::audible groan::

What I’m actually annoyed about are some insecurities I’ve had for a very very long time. While I was watching a demo on using JEST a testing library for Javascript I was smacked across the face with functions. In the context of something like Excel, I love functions! they make sense and Excel helps you understand how to correctly use them with minimal errors. But in the context of coding, functions mean ALGEBRA. For those of you who don’t know me, algebra is legit my arch nemesis. I can trace this back as far as the 7th grade. We had a quarter system in my JHS, and my math scores were something like 95 / 94 / 67 / 93. The 67 was the quarter where algebra was introduced to our class. As someone who’s worked with students, I really don’t know why I was not pulled aside for intervention especially because this haunted me in the 8th grade when I took Algebra and received the first “C” in a class IN MY LIFE. I went home, curled up in my parent’s bed before they got home, crying into my report card.  But that wasn’t the end of it. Then in the summer between 9th  & 10th grade, I was given the opportunity to attend summer school to get ahead in math. We did 6 hours of Algebra 2 every day– and I got an F. Since I spent the summer exposed to Algebra, I was put in an honors class for my sophomore year– at the midpoint, I was doing so badly that I was moved to a lower level class and still failed for the year! Finally, as a junior, I was put in a class that was more my speed with an excellent teacher, AND I GOT AN A! But the damage has already been done. Even when I went to college I had to repeat finite math several times. I got out of my math requirements by taking classes like data analysis (basically a how-to for MS Excel) and Statistics for Business. But Algebra isn’t going anywhere. The only thing I can compare it to is how I felt before I learned how to drive, in the sense that whenever the situation arises where I’m supposed to use a skill that I don’t know and have legit been traumatized by, I walk in the opposite direction. But both of these skills are the things that are between me and better, more fulfilling life, so I have to suck it up and work on the skills. There is no shortcut.

Anyway. Here are my notes from the week:

28-Mar 18:04 19:45 1:41
Used the girls who code website as inspiration for a color scheme.
Used W3 Schools to pull the parts of the code that I need to make the layout what I want it to be.
Idk if it’s just me but my code feels a bit disorganized. I would love to see how someone else formats their HTML/CSS and how they use their comments. Is there a style guide like MLA/APA is to writing?

lots of anxiety towards the end of the meetup. Being in a space where I have to force myself to focus and work on my projects was a good practice. I just felt so unimpressive working on FEWD when people were testing out Javascript functions.

31-Mar 8:00 9:00 1:00
Trying to incorporate sections that have a background color and ones that do not. Apparently, I cannot add padding around the image because it will make the FCC test fail–but without it, there’s just too much whitespace. Maybe try margin? A good resource for color harmonies https://htmlcolorcodes.com/color-picker/

Added copy into ed/law/politics/code sections. I want the columns to be responsive because they only look nice next to each other. Perhaps use @media query with window min/max? Also, I need to figure out font sizes/how to make font sizes responsive.

 

code on,

 

Alex

FCC Tribute Page Revisited – part 1

This was written on 03-25-19 @ 11pm-ish

As I mentioned to the IE-SD Slack chat, I *finally* got back to the project page. I got there years ago, and made it on my teenage crush Brandon Boyd. That embarrassing little nugget lives on codepen.io.

But I experienced some legit panic when I looked at the project on Sunday, cuz real talk… I forgot ALL OF THE BASICS. It’s been so long since I’ve even had to set up a page!!
There’s a part of me that was going to start reaching out to people but someone in the FCC Slack chat posted this and it made me pause for a bit because I’ve been dealing with this… funk a lot lately.

Lately, I’ve been having a hard time with being wrong– or uninformed or not being able to make good inferences, or whatever. Since leaving Chicago, I’ve had to learn two jobs —at the same time–that have very precise directions. There are usually immediate consequences involved when you don’t follow the directions at work and one way or another the customer suffers because they’re not being serviced accurately and efficiently. I’ve had both of these jobs for a year now so there’s been a good deal of note taking, workflow forming, and flat out crying when I feel dumb. To be honest, you’d think that I would be better at dealing with these feelings, but really, I’m not. It’s taken a lot of tools to reign in runaway emotions and straight up panic attacks to be where I’m at right now.

So after some breathing and talking out loud about the things I forgot, I told my husband that this is likely going to keep happening. At some point in my development career, someone is going to ask me to do something that I’ve done before, but cannot remember. The better I get at understanding how to code, the more I’ll need to learn how to dig around for solutions.

So that’s what I did. I went on W3school and one by one knocked out the *minimum* requirements for the tribute project. Just going one by one until the test script climbed up and read 10/10– and YAY, it fucking worked.

I’m going to call it a night. Tomorrow, I can focus on making it pretty.

 

code on,

Alex

Yay for new peeps!

Have you ever read the Alchemist? There’s a famous line from it that goes something like

“And, when you want something, all the universe conspires in helping you to achieve it.”

The past 24-hours kinda feel like that.

So, this week I decided to venture out a little. Since I’ve been going through the FreeCodeCamp curriculum, I decided to see if there was a Facebook group in my area and joined it. One of the organizers sent me a friend request and we started chatting about the curriculum. He invited me to the group’s Slack chat (man you’re just not a legit group of developers unless you have a slack chat). A lot of the members were online and someone mentioned something about RSVPing to an event. I clicked through a few links and it turns out it was that night! After coordinating with my husband, and rushing home to get my laptop, there I was sitting in a new-to-me software development MeetUp group.

The people were super friendly. Ironically, the group started because of 3 people who were *also* accepted to the Grow With Google program— but they were doing Front End Web Development while I was working on Android. One of the organizers made a very good presentation on hosting, domains, and DNS and the group was actually engaged! People were asking good questions and they led into really good sidebars.

I left early because I had to run to my parents’ house, but I’m so fucking jazzed about this. My husband has been pushing me to venture out and go to meetups like I did in Chicago, but I had been avoiding it because of time and, tbh, my spirit has been a little crushed lately. For the past year, I’ve worked 7 days a week, averaging 56 hours/week. I’m still working this schedule and I’m pretty tired all the time. It makes me moody and generally unfit for human consumption. I do it because it takes these two jobs to make anywhere close to the same amount of money that I was making in Chicago.

Going through the FreeCodeCamp curriculum and logging my time/lessons has helped me find pockets of time to continue to study. Finding *this* group of straight-up nerds is a fucking godsend and I cannot wait to see what we make and learn from each other.

Speaking of learning, here are my notes from this week’s FCC lessons:

Applied Accessibility
17-Mar 8:45 10:00 1:00 11

“The goal is to make the web more accessible to everyone regardless of abilities. To do this, website content must make semantic sense.

<div> – groups content
<section> – groups related content
<article> – groups independent, self-contained content

Photos need alt text for images that don’t load and for people who are visually impaired and use screen readers. Audio needs alt text for clips that don’t load and transcripts for people who are hard of hearing/deaf. (mind blown)”

18-Mar 21:00 22:01 1:01 11 
date & time tags.”.sr-only {” creates things in the CSS that are only accessible to screen readers and not visually visible to website visitors. contrast ratio for text readability is 4.5:1 contrast for normal text. this is calculated by comparing relative luminance values. white against black creates the strongest contrast @ 21:1. A good way to achieve this is by declaring w/ hsl(). Tabindex tells the visitor’s keyboard what to focus on when tabbing through a website.

Responsive Web Design Principles
19-Mar 18:03 19:03 1:00 4

Responsive Web Design Principles: Create a Media Query (UGH……………. this was difficult to understand. I think I need to realize that I’m given very direct and explicit directions. there are no inferences to make. JUST DO IT EXACTLY AS YOU’RE TOLD.)

The 4 different viewport units are:
vw – viewport width- ie: 10vw – would be 10% of the viewport’s width
vh – viewport height – ie: 3vh – would be 3% of the viewport’s height
vmin – viewport minimum – ie: 70vmin – would be 70% of the viewport’s smaller dimension ( height v width)
vmax – viewport maximum – 100vmax – would be 100% of the viewport’s bigger dimension (height v width)”

CSS Flexbox
20-Mar 21:15 21:55 0:40 17

“Flex, flex-direction/ row, column.
Justify content:
flex-start aligns items to the start of the flex container (row default left, column default top)
flex-end aligns items to the end of the flex container (row default right, column default bottom)
space-between aligns items to the center of the main axis with extra space placed between the items.
space-around similar to space between, but first and last items are not locked to the edges of the container. flex-shrink controls the size of the items when the container shrinks. The flex-grow property controls the size of items when the parent container expands. flex-basis specifies the initial size of the item before CSS makes adjustments with flex-shrink or flex-grow.

ALSOOOO There is a shortcut. The flex-grow, flex-shrink, and flex-basis properties can all be set together by using the flex property. For example– flex: 1 0 10px; will set the item to flex-grow: 1;, flex-shrink: 0;, and flex-basis: 10px;.

align-self : adjust each item’s alignment individually. useful since other adjustment techniques using the CSS properties float, clear, and vertical-align do not work on flex items.

FYI SELF, YOU ARE 22 LESSONS AND 4 PROJECTS AWAY FROM JAVASCRIPT ALGORITHMS

::breathing intensifies::

CSS Grid
22-Mar 22:43 23:17 0:34 10 
“fr : sets the column or row to a fraction of the available space
auto : sets the column or row to the width or height of its content automatically
% : adjusts the column or row to the percent width of its container
grid-gap is a shorthand property for grid-row-gap and grid-column-gap from the previous two challenges that are more convenient to use. If grid-gap has one value, it will create a gap between all rows and columns. However, if there are two values, it will use the first one to set the gap between the rows and the second value for the columns.

Refer to CSS Grid: Use grid-column to Control Spacing for 3×3 grid example… trust me, it’s much better than trying to figure it out in your head.”
—————————–

Wish me luck and lots of sleep.

Code on peeps,

Alex

Checking in

Hey Y’all.

I’m still in Cali and I’m working on the FreeCodeCamp curriculum at a v slow pace.

I redid all of the lessons that I completed years ago because the curriculum has had a lot of updates and I didn’t want to miss out on anything. This week specifically I’ve started recording my stats. Not to micromanage myself, per se but so that I can pace myself and reflect a little bit on what I’m doing. Here are my notes from this week.

Applied Visual Design

12-Mar 23:11-23:45
Offsetting elements by pixels. Different ways to color an element in CSS. Basic ish.

13-Mar 11:25-11:45
Lunch break. Got stuck on Hex vs rgb/hsl.

13-Mar 23:25-23:56
OMG, WHY DID I OVERTHINK THAT?! The trick was that they literally wanted me to use hex #s instead of following the RGB( x, y, z )format.  These lessons offer neat tricks in how to manipulate color, texture, direction (i.e. color gradients that tilt on a diagonal angle).

14-Mar 18:51-19:53
The devil is in the details. Try to take every piece of instruction literally.  The content of these lessons is about creating simple shapes like circles, squares, and hearts as well as manipulating them by making them fade and move. Cool stuff–but how often will I actually have to do this down the line?

15-Mar 22:41-22:48 0:07
We went over animation-timing-function: cubic-bezier(x1, y1, x2, y2);. I have a hard time explaining exactly what this is, but it has something to do with changing animation speeds. This is the first time CSS has ever looked like a math problem.

Progress level

Total time this week: 2:34
15% or 213 out of 1409 total lessons

 

Later,

Alex

Looking Back and Moving Forward

We’re already 29 days into the new year and I have YET to sit down and finish this post! While that’s poor planning on my part, there is power in being able to encapsulate your experience at different points in time — so for the sake of documenting my progress I’ve just gotta get this stuff off of my chest.

WHAT HAPPENED IN 2014

The short of it is that for a few years now, I kept pushing to make my way into the non profit field or lower level jobs in higher education. After a year of interviewing, it was clear that my passion for the fields and experience weren’t enough, so I focused on finishing my BA. Even if neither of those fields worked out, I knew a BA would allow me more options in life.  I am at the tail end of this project and decided to switch fields and explore web and software development.  No one in my family nor social circles has gone down this path so I’m exploring it all alone. Thankfully, I live in Chicago which is a great city for web tech and have been able to meet people via meetup groups and local communities.

I know I have a lot of ground to cover but I firmly believe that if I am committed, I will be able to show off my skills in about a year. With that said some stuff just has to change.

WHAT I WOULD LIKE TO HAPPEN IN 2015

Get organized

As the saying goes “you can’t manage what you don’t measure” and it is still true when it comes to making sure that you’re getting things done and meeting your goals. This may be a personal project, but tracking time spent and milestones met will give me an idea of how I am doing and where to change things. At work, we use an XLS timesheet, but it’s not very easy on the eyes and I wanted to venture out and see what free services I could find. Google spat out toggl which has a free option as well as a premium one.  The interface is pretty simple and there are web, desktop, and phone app option which all sync with each other.  After using it for a weekend I can say that it’s a useful tool that allows you to tag your time according to what you’re working on. You can access reports that tell you how long individual tasks take as well as your total time spent for the day. This could be achieved with a simple paper timetracker, but with it being a free software and having cross-platform access, it wouldn’t hurt to try.

Alternatively, since I’m a productivity junkie, I’ve also considered that keeping track of time might be half the battle and managing tasks is the other half. For this, I would suggest Trello. I’ve tried it for a few weeks at work as a means of not only listing my tasks but organizing them by project and for the most part, it’s allowed me to incrementally plan each step of each project and easily remove or add tasks as necessary.

Ultimately, productivity systems are only useful if they’re used, so we’ll see which one’s i’m using in a year or so.

Get madd skills

I am about to jump into a purely technical field and I really, Really, REALLY need to know what I’m doing.  Since I’m taking the self-directed learning route, building out a comprehensive curriculum is imperative. Thus far, I’ve been working on Codecademy (which will be mentioned countless times on this blog) and attending meetup workshops to feel out this new developing landscape. Since Codecademy was my first it will always hold a special place in my heart. If you’ve never used it before, lessons  walk learners through a concepts within each language, building upon the last until you’ve come to the end of a unit. At that point you will use all of the concepts learned and proceed on to the next unit until you complete all of the lessons for that language. The languages are independent of eachother so you do not need to complete one before proceeding with the other, but I started off with the HTML/CSS course to just get my feet wet. Another neat bit is the gamification aspect that rewards the learner with badges upon reaching milestones within the language they’re learning and for completing a streak (consecutive days of code).

If you’re not completely new to coding or would prefer something more project based, I would suggest FreeCodeCamp. FCC is a community of developers and students who work together to complete projects for nonprofit organizations. The curriculum was created out of multiple free coding resources on the web and then assembled into a long 50-something point to-do list. Once learners reach the end of the list, they are able to virtually work alongside developers on projects in exchange for material that you can put in your portfolio. When I found FCC it made me feel like the little nook on the internet that it inhabited would be the ultimate sweet spot for me to get involved in. After all I may have changed careers, but that does not mean that I’ll never step foot into a role at a nonprofit again.

GET OUT THERE

This last point is broken into a few different goals

I want to build relationships with other coders at varying levels to receive and deliver support. 

I want to have several projects that I am proud of that were created alone and with others.

I want to know enough to lead (at least) one class focused on teaching others how to code.

From where I’m sitting right now, these things are scary and exciting but the truth of the matter is, I’m privileged to be able to access resources that will steer my life in a different path. This opportunity needs to be nurtured with time and hard work.


Code on folks.