Tag Archives: week1

The beginning steps of building structure

1 Reply

The highlight of this week in terms of assignments was being able to do lessons on Codecademy! For the longest time I was not sure what HTML and CSS stood for or the difference of these languages. I am happy to say that I finally discovered that HTML stands for Hyper Text Markup Language and the purpose of this language is to structure content on a page. As for CSS, it stands for Cascading Style Sheet and it is the style that dresses up the structure. These languages go hand in hand and often work together to create a beautiful web page. I think the reason why I have always been hesitant of code is because I was afraid of not understanding the purpose of each language. However, these two languages have names that speak for themselves once you know what each letter stands for.

In Codecademy, I was able to pick up on the material pretty quickly. However, I felt like the experience of doing these lessons had similarities to learning a foreign language. During undergrad, I studied Arabic and had to learn different rules in order to read and write. With HTML, there are different headings and tags that can easily go wrong if you do not follow the HTML rules. It is similar in learning Arabic, it is possible to completely change the meaning of a word by not following the rules of which letters go next to each other. It is important to continue practicing a foreign language daily in order to exercise this muscle in your brain. So far, it seems like it will be the same case for HTML & CSS. I feel determined to build the structure and let the rules flow after I continue to practice and revisit these lessons on Codecademy in the future.

 

Programming Language 101

Leave a reply

Just as I was last week, people who have never had any close contact with programming are afraid that it is extremely difficult. However, it is worth realizing that programming is nothing but a process of learning a new language. Obviously, beginnings are always difficult, but once we learn our first programming language, studying new ones becomes easier. Right now, we are not learning programming because of the need to change a profession, but because it is important to guide our minds to a resourceful way of thinking, which is essential in the field of communication. Even if our careers are/will not be related to programming, these compact skills will help us to better understand the problems that can stand in our way in the future.

What’s more, learning programming involves not only acquiring new knowledge about coding in different languages, but is also a great way to work on ourselves. It is as effective as solving logic puzzles such as sudoku, which helps to train your mind. In addition, programming teaches consistency and organization. Namely, while writing a line of code, we must plan and implement next steps necessary to achieve a goal, which includes application of the most efficient solutions.

To conclude, a good programmer has to be like a writer. He/she should not only know programming languages – most of all, one must be able to think in an analytical way, to break down a problem and prepare component elements from which a given program can be later developed. Just as a writer creates his work to make it interesting for the reader, the programmer creates a program that is supposed to be as effective as possible. Thus, the ability to understand a problem, which often involves the need for interdisciplinary thinking, is essential. However, it all comes down to a programmer facing the need to translate the gathered knowledge into a programming language.

Cause and effect panels greatly helped my understanding

Leave a reply

Those multi-panel windows in Codecademy are honestly a genius and elegant way to show how what you do to the underlying code affects the displayed webpage. After learning a few basic tags and following the lesson instructions, it was interesting to toy around and go off-script to see how things changed. Only once or twice were the instructions difficult for me to follow and I had to use the hints.

It speaks to the economy of HTML that you can only know how to use no more than a dozen tags and be relatively well-equipped. With some basic research I found that there are only about 250 HTML tags that anyone would ever really need to know — this makes me more confident that learning this language will be a lot easier than I originally anticipated.

It was also revealing (and strangely powerful) to use the inspector tool. The example in the “Meet your web inspector” showed how it was easy to download a picture that the site perhaps wanted to prevent (obviously you could also screenshot anything). Not to skirt the ethical boundaries of the technology, but I did experiment with the tool a bit… I used the web inspector to delete a site overlay on The Boston Globe website when the paywall hit, but the site didn’t load any part of the article. The inspector did come in handy on the Wall Street Journal site, which will load the lede and second paragraph, but obscures the second paragraph making it hard to read. Using the inspector though, you can easily read the first two paragraphs within the HTML. I suspect that with more poorly-designed paywalls, simply deleting the paywall pop-up could reveal an entire article. Or we could all just start paying for subscriptions to newspapers…but I digress.

 

We built a house this week

Leave a reply

This week was the first week to delve into the first exercise of coding and learning more about HTML. I really enjoyed the exercise and the steps I took to create the final outcomes. It was a little frustrating in the beginning to get something wrong because I forgot to add a comma or a “>”. Then I came to realize that every single symbol, letter, and space matter — which is crucial in our field of work — and the importance of attention to details in coding. Also, the organization and the neatness of the code and the spaces used are essential to the final product. I am very excited to get started with CSS because I am really interested in developing more knowledge about design, which is as important — if not more important — than the content.

One of the readings shows a great analogy of building a website and building a house. The analogy helped me understand the layers of work that go into putting together a house apply in the same way we put together pieces to have the final product of a website. This understanding of structure helps journalists in laying out their work and creating that final piece of work.

I found it most interesting to learn more about the browser’s web inspector. We started the exercise in class but I got more into it this week with the readings. I was playing around with different pages and looking at the HTML code. I found it very helpful that you can hover over the code and it will highlight on the website to show you where it is. I am also fascinated by the back-end work of websites.

I am excited to be learning more about the various structures of a website in the next few weeks and see how these are out together to create the final product.

Learning the basics to code

Leave a reply

Coding is an important skill more than ever today. It seems to be a skill employers are looking for more from aspiring journalists today. Learning the basics to it today reminded me of learning how to do different math problems back in high school or college. Not because the basics to coding are as complex, but because the process of learning of them is similar. Learning how to do a math problem usually starts by watching the teacher complete a similar problem on the board. Often, you will follow along and understand the steps the teacher is taking, nodding along as the teacher arrives to the answer. But, once you sit down to do a problem yourself, it is impossible to evaluate how well you grasp the material. Without the teacher’s help, you’ll come to understand what confuses you or what steps you’re forgetting.

Similarly, when I was going through the Codecademy exercises, there were times when I would run into trouble and use their “show me a hint” feature, which was usually helpful. But if I was still stuck, I eventually noticed that you could ask for the solution. While I appreciated that feature when I was stuck, I also think it offered a bit of false comfort. I could nod along and tell myself I just had a minor error and *basically* had everything right, that is not actually the case.

With coding, minor mistakes have enormous consequences. Or so it seems to a beginner. Forgetting to close a tag or include a quotation mark can make the difference between the code functioning or not. As we go along, I am trying to figure out the best way to learn through Codecademy — when to struggle with the code and when to ask for a hint, or when to struggle with the code and when to ask for the answer. Moving to the next slide was helpful in itself because, just like a math problem, sometimes you need to just look at a new problem.

Leave a reply

My main takeaways from this week’s readings were simplistic descriptions and analogies by Mindy McAdams on programming. Her conversational approach to programming and code were particularly refreshing and easy to grasp. The next article and its Website=House analogy and it’s picturesque slides made it more comprehensible. Also the introductions of elements, attributes and structure of tags (open <p> and closed </p> tags) and how the concept can be related to our everyday lives was so helpful.

I think the most abusive tool for me this week was the web inspector. I have umpteen times checked and changed the HTML of several websites just to see how what will happen and it was a pretty cool experience :). Sarah disagrees lol. Codecademy’s split screen for instructions, coding and display shows in real time how the tag hierarchy relates to each other and how a glitch in the arrangement can alter the whole hierarchy. Their website is beginner-friendly, with hints to help you along the way should you get stuck on an exercise. GitHub seem pretty straight forward with the creation of a repository and committing to projects. I hope to explore and learn more about its operations as the course progresses in the weeks ahead.

 

Why is the web inspector editable?

Leave a reply

The thought of someone sitting in their home rewriting the headline on the front page of a newspaper makes me cringe. Why then, is it possible for me to go to Sir Ian McKellen’s official webpage and change his background image to that of a cat in a turkey costume?

It’s obvious that the web inspector tool is useful for learning how the building bocks of code and style interact. I can also understand that it may be helpful to inspect the code of a website in order to debug it, or to be sure that it doesn’t contain malicious material. But I can’t think of a lot of reasons why it should be editable to the point of replacing McKellen’s face with Turkey Cat’s.

Regardless of the reason, it reveals a few things about the personality of web development, and perhaps of web developers themselves: they are tinkerers. In using Codecademy for the first time, I was reminded of how genuinely rewarding it is to achieve tiny victories in code. If you’re not de-bugging to figure out a past mistake, you’re often pre-bugging to see if (maybe) you can get something right the first time. Because of this, it’s important to break the code components (and the expected behavior) into its smallest unit.

For that reason, I’m also excited to begin becoming familiar with GitHub, which operates a bit like track changes for large pieces of code. With each small unit of code and expected behavior, new opportunities for error and unexpected outcome are introduced. Thus, the ability to isolate small changes and to keep a clear record of edits over time is extremely valuable.

But I’m still not totally convinced about the web inspector tool…

Music in the key of code

Leave a reply

This week’s assignment was good. It rekindled my burning frustration with forgetting to close p tags, but the Codecademy setup was so intuitive that my questions were resolved almost immediately. I remember using W3 for learning to code in one undergrad course, and the user-friendly nature of this homework workflow (at least, so far) is far easier than editing in a notepad locally and refreshing the page.

Another point of reflection I’d note was the music. In fact, it was quite funny because I immediately thought of music (basic seven notes) before the actual guitar reference. Bringing things into perspective is a lot better for digesting. Just like learning a basic 2-chord song (HTML) for starting off is better than introducing a beginner to jazz standards (JavaScript). Whenever I try to encourage other people to play an instrument they’re reluctant about picking up, I often tell them to think about what they want to do rather than start off worrying how to do it. It appears the same logic is applied here.

I do agree, as you noted, you’ve got to practice a decent amount every day to build your skills and grow without forgetting too much in between down time. That’s not unlike music (or Mandarin and Spanish, which I haven’t practiced in years and have thus forgotten.) I’m glad that the Code Academy assignments allow you to reset them for practicing them further.

—

Regrading our websites, I would want to make a music review site where music is catalogued by genre>artist>album>year. It would be a mix of niche interest, personal and business. I already have some form of cross-page organization in mind in addition to that general hierarchy I just mentioned. The purpose of the website would be to show album art, an artist’s full discography, include references (at the bottom of each page) to similar artists and other purposes. I think it’s somewhat of a wiki page that is more in-depth, adding personal review sections as supplementary elements after straight factual info.

Learning Modules on Codecademy

Leave a reply

For this week’s module, I want to reflect in more detail about my experiences on Codecademy. Just to mention, even after the readings I still did not know what to anticipate for the actual activities and lessons.

First off, I liked the format and method that Codecademy used to teach HTML. I felt like the breakdown of lessons into different segments kept relevant and more advanced information lumped together, which made it feel more approachable and manageable. Also, viewing everything side by side in a single window was awesome! Seeing the detailed instructions that included pictures, the input area and the coded results all in one look made it easier to learn. I utilized the “Show Solution” option after two failed attempts and it corrected my mistake. This allowed me to go through the text and see the difference between what I had input and what was needed to follow the instructions. Information checking in the form of a quiz was beneficial to reinforce some of the new information I learned.

I had learned some HTML in elementary school when we made our own webpages through HTML, so a lot of the tags and attributes came back to me easily. However, I did have difficulty making the unordered lists and ordered lists appear with bullets or numbers. I will just have to keep working on it.

Just Starting Out…

Leave a reply

So far HTML seems pretty easy and straight forward to use. I went in thinking that it was going to be some daunting dragon that I was going to have to slay, but it is surprisingly very user friendly. I’m saying this now, but may regret it later on in the semester. But for now, I am having an easy time grasping the concepts. So far, my biggest issue is indenting the lines of code, but the more I went through the lesson I was able to properly indent, so everything aligned and functioned properly. In terms of web development, I am not sure what kind I want to focus on or if I ever plan to use it beyond this semester. I plan to really get a feel for the discipline and see if it’s something that really interests me enough to pursue seriously. I find the idea of web development and coding to be pretty interesting, but I’m sure whatever skills I gain this semester, I will only use for my personal projects. For my final project I think I want to build a blog of some sort. A place unlike my blogs that I write for class that have to be very politically correct or ‘on-brand,’ I want this one to accurately reflect the actual views and opinions that I have about real issues. My current blog reflects the neutral persona that I’ve adopted for my career and doesn’t include many issues I am passionate about or those that I feel affect my community at disproportionate rates. I believe that I bring a unique perspective to things and should share. So essentially this blog will be the home to my real and true thoughts, sort of like a finsta—a fake Instagram where you share everything not just your picture-perfect highs but the lows as well, the real you.