JavaScript…ouch

This week, I appreciate that our work was broken down into a small increment that was more manageable for me to work through and digest between last week’s class and this week. That being said, I definitely struggled with keeping all of the concepts straight, and I definitely took comfort in the fact that my fellow classmates had difficulty with some parts of the lessons as well.

One thing that confused me, and that I think Codecademy did not do a good job explaining, was some of the small pieces of syntax that got overlooked. Most specifically I believe this case was demonstrated when the syntax switched from regular parentheses to square brackets when writing out arrays — something I didn’t catch initially but only noticed when I worked through the problem for long enough. Things like this are very minute, but obviously make a difference when writing code. I also thought that the amount of knowledge (most specifically lumping in jQuery and JavaScript together) was a lot to comprehend. Even though it makes a lot of sense to learn those two language together, it was very hard for me to digest JavaScript and then jump right into jQuery — a language I don’t think was explained all that well.

One question that I had was about the explanation in Codecademy about generating a random card by using the Math.random and Math.floor functions. I wasn’t sure why you would multiply that function by 4, and where exactly that number and matching “card” came into play. Hopefully Greg will be able to shed some light on this, or hopefully walk us through this example and explain where the multiplication comes into play.

Overall I am looking forward to working through a couple of examples, similar to how we walked through the photo gallery last week, so that the overall structure of some of the jQuery concepts can be explained, and how that integration process works.

Muddling Through JavaScript Madness

I do have to say that I found this a little easier than the combined HTML and CSS lessons. Somehow this was less confusing. Much of my trouble came from Codecademy’s unclear instructions.

I also wonder if there was a glitch with the program. I have no idea if other students had the same problem but for some reason when I opened some of the lessons, the code was already complete. The solution was simple, I just refreshed the code. But when you are just starting out it is a little confusing.

I also struggled with the directions at points. The exercise would say to write JavaScript but not where. As I found out, the placement of certain elements is very important. I did not find the hints helpful with this, especially since they often gave the answer instead of gentle nudges in the right direction.

Thankfully many of the codes are very similar and build on each other. I struggled with divs and how to put them together and the way they interact with the elements on the HTML page. Variables and functions though, I picked up easily. It is strange because structurally they are kind of similar.

Overall I had significantly less trouble understanding this than I thought I would. Surprisingly enough I found myself enjoying learning this language. Maybe my fear came from the way it was described in class. Or seeing the completed code in another language while I was still struggling with the first two. I’m not sure really, but I like it now that I have tried it. Will I say the same thing later this week while trying to build a photo slideshow? Will I have the same level of clarity as I do today? Watch this space in a week for my answer.

Javascript Confusion

After reading everyone else’s post thus far, I feel a little better. This weeks CodeAcademy exercises were very frustrating and confusing. I felt really good at first that I was really understanding everything. That was all until logical operators and functions. The functions were easy at the start, and I was able to comprehend and write in comparison operators and if/else statements. However, I became very confused when logical operators and functions came into play. I think it might be because there wasn’t great visualization on the CodeAcademy exercises.

Later in the course, I thought that the Array was very easy to understand. I found this to be a simple concept and way of creating lists. However, I’m not exactly sure what those lists would mean when put onto my HTML website. I think I am having trouble deciphering HTML, CSS, and Javascript and what they all mean separate from each other, and added together. I am praying that one day this will be made into an easier process.

I am worried that I will have trouble with the rest of this class and am starting to get a little stressed. I spent about 3 hours trying to learn this language, and still have a low understanding. I think that it will help me in the future to have classes that really walk through the basics. Last class was lost on me as I am a visual learner and don’t think just talking through the different things JavaScript can do was of much help to my learning type. I really do like the CodeAcademy that it walks you through the basics, and think bringing it down to that level in class would be extremely helpful.

Overall, I think I still have much to learn when it comes to Javascript and hope to learn more in the next class!

Logic, or JavaScript?

I struggled mightily with this week’s Codecademy lessons. I knew that JavaScript relied heavy on logical values and statements to perform its functions, but I did not anticipate just how difficult these things would be to comprehend.

I worked on lessons one, two, and three prior to the June 7 class so that I could at least have a basic understanding of what our lecture that night was going to cover. I was able to make it through lessons one and two fairly easily and with few issues. Lesson three, however, proved to be a different beast. No matter how many times I re-read the descriptions and instructions, there were certain steps that I was unable to perform correctly and move past. For the first time this semester, I was forced to use the “get a hint” and “get the code” tools during this lesson module. I’m not happy about having to do that, to say the least, but it was a necessary step in order for me to proceed through the exercises. I went back through each lesson and looked at the correct code, which helped me to see where I went wrong when trying to complete the exercises.

Completing the first few lessons prior to class enabled me to follow Greg’s lecture more easily. As we looked at the JavaScript code of the slideshow sample, I was left wondering where exactly the console.log property comes into play. This is something that figured heavily into the Codecademy exercises, but I don’t recall seeing it come up during our in-class analysis of the example of JavaScript code. Is the console.log something that is specific only to Codecademy when printing the output to the screen, or does it have real-world applications?

I thought the lessons on JQuery were interesting, and I appreciate that there is an easier way to interact with elements in the DOM that does not require us to write such lengthy JavaScript code. I am dreading having to memorize the JQuery commands, as they are difficult to understand (I needed more hints during this lesson, too). I find it difficult to memorize and truly learn the concepts as I work through them on Codecademy, because referring back to an earlier concept requires hitting the back button and navigating away from your current page. I’ve started copying and pasting the entire lesson into a Google document so that I can refer to earlier parts of the lesson while working on the current module. My Google doc for the JavaScript and JQuery lessons 1-5 is 41 pages long.

I’m hoping that our June 14 class lecture will help me make more sense of the concepts I encountered in the Codecademy lessons. I look forward to applying these concepts through the slideshow exercise in the coming week.

The Struggles with JavaScript

I now see why everyone had difficulties with JavaScript. Completing the exercises on CodeAcademy this week was brutal. I spent five straight hours trying to code for it.

The problems I have with it are that the code is fickle. In journalism and public relations, creativity is key. No one can copy your voice, your thoughts or your reporting. In coding, the answers are the answers. While there is a little creativity in how you create your code, knowing how to do it is straightforward. In other words, you cannot BS code.

What was challenging about the exercises was that you had to remember every little thing in order to do the next exercises. I kept having to do hints to help me remember how to code or what to press or what to do. I’m honestly scared of what comes next, but I just have to keep working hard in order to master this. Once I can do it, I’ll be so proud of myself.

As a feminist, it is so important for me to learn how to code. On Linkedin, I always see tech employers discuss how they get hundreds of applications for a tech job opening, and very few are from women. There are so many male coders, but not many female tech employees. There needs to be more representation of women in many industries, but especially in tech, considering some of the workplace drama that has been happening in startups and tech enterprises.

There were days this week when I was tired from work, extracurriculars and schoolwork. Still, I need to remind myself to keep striving, keep pushing and remember that anything worthwhile requires time, effort and patience. I’ll just have to keep practicing in order to get any better.

One thing I am excited about is working on our developer profile. One of the reasons I enrolled in the Journalism program is because I love interviewing and learning about people and why they decide to do what they do. I’m already researching some leads on Linkedin and cannot wait to get started.

JavaScript or jQuery, That is the Question

June 11, 2017
11:09 PM

I was an idiot and did almost all of next week’s jQuery exercises before realizing that I was in fact on the jQuery page and not this week’s JavaScript page. At least now I know why I was so confused. But, needless to say, a dastardly start to this week’s homework.

I learned the abstraction before I even knew I what I was abstracting. I am, however, happy to say that I am now adept at navigating the murky depths of the Codecademy Question Forums. I’m also grateful that now I will understand the “why’s” and “how’s” behind the “what’s” of my mediocre accomplishment. I had no idea how I was supposed to know how to write the beginning JavaScript. But! Now I can use functions. Sort of. So, that’s exciting. Out of frustration and sleepiness, I am going to bed. Thank god I have some time to tackle this tomorrow.

June 12, 2017
7:53 PM

Well. Now I have stuck my toe into the cold lake of JavaScript, and it is not as logical as it seems. I really do feel like I’m drinking out of a fire hose–mostly because I’m building concepts that are built on top of shaky concepts. I’m definitely going to need to review this and ask a bunch of questions on Wednesday. It makes me kind of concerned about going forward, but I also am gaining confidence in my ability to google stuff, which I’m trying to tell myself is all that matters.

The exercises make sense…mostly? But it feels like something finicky is going on with the Codecademy stuff, but I don’t know if it’s just me. For example, I’ll start an exercise and it will say I am wrong before I’ve even clicked anything. It’s frustrating, because then I just have to click through and I’m not exactly sure what I’m supposed to be learning.

I will say, I’m feeling some serious solidarity with my fellow classmates, and that’s encouraging.

First Coding Experience — The Struggle Is Real

This week’s assignment taught me several important lessons, the first being that this class is likely going to be the most challenging course I have taken thus far at Georgetown University. As a student in the Public Relations and Corporate Communications program, I have been relatively well equipped for my classes thus far – crisis communications, public speaking, event planning, digital analytics are all skills I use in my daily life. I thought that web development, although not a skill I use often, would fall in line with these other classes as a sort of ‘second-nature’ skill. I can now say, after two weeks and numerous hours staring at my computer screen, I was wrong.

To begin, coding is very rational, as Codecademy explained the abbreviations are largely based on logic (e.g. px stands for pixel), the codes are straightforward (e.g. font-size equates to the size of the font), and almost all of the codes open and close with the same pattern (e.g. <tag> content </tag>). Yet, the system is so, incredibly fickle and specific, that I find myself struggling to understand the nuances between a <div> and an <id> and how an <h1> tag is different than a <div category =intro> if there is only one intro tag in the document? (I could continue with this stream of consciousness for pages, as I struggled with these differences for hours, but I will spare you that pain.)

I also struggled because I would then try to Google the questions in my mind, but I found I did not have the correct wording to find the answers I sought. I could envision in my head the piece of code I saw in previous Codecademy exercises that I was trying to recreate, but my search queries of “how to make a div connect to CSS” or “how to make a picture fit in the textbox CSS” resulted in nothing of use, which was frustrating.

In public relations and writing, there is no one answer to any solution. There are numerous ways to write a speech, pitch a story, structure a corporate campaign, etc. Thus, I think the exactness of coding is something that I will struggle with, especially given that I do not fully understand why one code works whereas another doesn’t, even if they serve (to my knowledge) similar, if not identical, purposes. I am hopeful that as my knowledge of coding grows, this confusion will subside and I will find it easier to differentiate between tools, tags, labels, numbers, etc.

At this point my biggest question is better understanding the purpose of a div, and how to use that div, and the offshoot of a category or a class, in CSS coding.

Introduction to CSS and Designing a Page

Readings: Responsive Design

Going through this week’s readings, what stood out to me the most was the point Ethan Marcotte made in his article about the “more adaptive approach” being the way forward in web design. I think it’s important to keep in mind that technology is constantly changing, and as Marcotte points out, creating technology that adapts rather than just “tailoring disconnected designs to each of an ever-increasing number of web devices” is the only way to keep up.

Coding: CSS Intro & Homepage Prototype 

I really liked the way Codecademy introduced CSS in its lessons. For the most part, it was easy to follow along with the instructions and explanations. The trickiest lessons to understand were the last two on creating boxes and styling images. I think some of the explanations about sizing using pixels and percentages went over my head — as did the explanations about changing an element’s position on the page — and I will try to review these bits before class on Wednesday.

Despite how easy Codecademy made it seem, I had a much harder time putting together the prototype homepage than I anticipated. I thought the best way to start the process was to model my page after one of the pages from Codecademy and modify the code and content. The two things I struggled with the most were changing the color of the background and getting the text to move the way I would like. Initially, I wanted to change the background color to a plain white and fix the main image at the top of the page to have the text move over it as you scrolled. I think I did manage to change the background color after a couple of attempts, but, no matter what I tried, I couldn’t figure out how to configure the image and text to behave the way I wanted. I think my problem with the text came from not fully understanding Codecademy’s lesson on positioning.

Lastly, adding the code to GitHub also presented some challenges. Although I found the tutorial really helpful, following the steps the first couple of times, I kept receiving an error message that told me my repository failed to publish without any clear explanation about why. I finally got the files to appear on my account but am not sure exactly how I did it.

Wins and losses from my first homepage

This weeks work made me warm up to Codecademy a lot more than I expected. I really enjoyed learning about CSS and seeing what more “front-end” web design looks like.

After this week I definitely want to focus my time on front end changes during my bigger projects. First, it more closely reflects the type of web development I would do at work, and secondly I enjoy making things look pretty. CSS gave some immediate gratification when it came to making changes, and learning about all the options I had when it came to color, sizes, and fonts was really interesting.

There were some minor things with Codecademy that I didn’t like. Perhaps the main thing was that if I got stuck on a lesson that had 3 or 4 different steps, the program would often give all the code for those steps, not just the one I was stuck on. That make it harder to learn the later steps, since they were already done for me.

I also had some struggles with getting Sublime Text and GitHub to play nicely together. I was able to make some basic code, save it, and drop it into my monitor and see it, but when I imported it into GitHub I couldn’t find the code. I tried looking around on the internet to see where I went wrong, but to no avail.

If possible, it would be nice to do these things in class together as a trial, so I know if I’m moving in the right direction or not. With the on your own work I felt like I was poking around in the dark, which to some extent is fine. However, since some of these concepts are so new to me, it would be really helpful to see things get done in class so I get a better idea of the flow of these programs, like GitHub.

 

Adventures in Creating a Homepage

Using HTML and CSS

Now I understand what Prof. Linch meant by having an idea of what you are developing before you begin. When building my new homepage, I started putting in code before I really knew what I was doing… and about 30 minutes later, I deleted most of it and started over with a vision! (see below)

screenshot of homepage

A couple challenges I faced that required a Google Search were:

  • How to link certain text within a paragraph and not the entire graph, or having to have the text on a separate line
  • How to download an image from the web and use it, legally cited of course, on my page; then how to display it on my homepage
  • Why my background color displays in Safari but not Chrome (Still unclear, ha! Something to do with fact my HTML file is saved as Chrome and my CSS file is saved Safari? Is that default — I didn’t select that.)
  • Several failed attempts to link my HTML and CSS files 🙁 But alas, some tiny edit made it click! (I think I simply removed a forward dash before style.css!)

My next challenge will be to further the CSS styling on my homepage. I plan to visit a few sites I know I like the look and feel of, and study the source code to see how they have been developed. There was so much to learn about CSS styling in our Codecademy lessons this week — I would like to play around more with opacity, overlapping content, margins, padding, etc…

I appreciated the w3school’s article, “Responsive Web Design – Intro,” especially the images of the expanded desktop, smaller tablet, and compressed mobile display. The article did a good job explaining what responsive design is, how it works and should look, and how to program the tool (though a lot of practice is warranted). Seems like a practice every programmer should utilize this day in age for UX given that mobile is taking over as the top device on which user access the web. Once the article gets into “grid-view” and “media query” I got a bit lost and was wishing I was taking a lesson in Codecademy:) On a related note, I found the alistapart article outdated and hard to follow — give me some images!

Cheers!!

Jane