Category Archives: 2019 Spring class

jQuery: I need somebody (not just anybody)

Even with a lot of work both on the professional and educational side, I feel like I was able to make a big step towards gaining “jQuery proficiency” this week. Codecademy explains everything quite clearly and turned out to be a great resource, even though at first it seemed quite scary and overwhelming with information. In my opinion, the website is very good if you are a beginner in a given field, since the courses available on it provided me with a foundation that I am excited to use in the future. Also, this week I had the opportunity to complete the jQuery course on that website, which turned out to be quite straightforward, but rather stimulating experience. Another part of my study involved finding commonalities between HTML, CSS and jQuery, as combining them all together would surely be helpful to produce a great piece at the end of the course. As of today, I still need to watch more videos and do some research on this area of study, in order to strengthen the knowledge I already have and the language skills I might gain through completing another set of lessons next week.

Moreover, in the last couple of days I was able to reach out to a developer (through a friend) with a fascinating background in programming. I believe his interesting experience and knowledge can be a good resource for a programming novice such as me. Right now, I am working on some specific questions to ask him and drafting a profile that might be helpful to both me and students who will have the possibility to read it in the future. To conclude, I am looking forward to conducting an interview with him and excited to learn more about programming and the ways it can benefit my future career.

The adventures of jQuery

I attended my first class with little to no experience of web development skills. I have always heard people claim JavaScript as one of the tricky languages. However, when I finally became  comfortable enough with HTML and CSS, JavaScript and jQuery came into my life and I felt doomed. I understand that JavaScript is used for adding dynamic behavior to web pages, but I was a little confused by why people still use JavaScript if there are libraries like jQuery that make developers’ lives easier.

From my understanding, jQuery is basically pre-written JavaScript code that can be used in any coding project. As a newbie, I visited the first page of the Introduction to jQuery assignment thinking, “isn’t this cheating? Can JavaScript really be simplified?” l have realized that in cases like this one, it isn’t worth reinventing the wheel. It finally makes sense why people claim that developers are lazy and I thank my introduction of jQuery for that. As a fan of metaphors, I like to think of it as you wouldn’t manufacture your own wood when building a house. With jQuery, web developers can spend less time connecting JavaScript features into a web page and dedicate majority of the time incorporating features that are unique to their site.

jQuery sounded too good to be true, so I went to the internet to research why jQuery is not always a good thing. During the lesson, I was confused on why we didn’t jump to jQuery and completely skip JavaScript. Rather than being built for JavaScript and DOM API combined, jQuery is built for DOM manipulation only. Apparently jQuery wasn’t exactly made for beginners so it is necessary to learn the core JavaScript language or else it would be difficult to use jQuery properly.

I guess I can’t quite say goodbye to JavaScript.

 

jQuery: The shortcut language

Whoever came up with the idea for jQuery deserves a medal. Such a simple concept can go such a long way. Some effects are difficult for me to conceptualize, like for example in the second jQuery exercise, we were able to simply change the speed of a dropdown menu using either the  “slow” or “fast” parameter. Whereas some methods, like .fadein, you can quantify for exactly how long in milliseconds the animation should last. Perhaps this comfortability just comes with practice. For example:

$(‘#nav-dropdown’).slideToggle(‘fast’) vs. $(‘#nav-dropdown’).slideToggle(‘100’)

Either way, it’s easy to see how powerful the combination of JavaScript and jQuery can be. The complex animations I see daily on websites, which just weeks ago would have been impossible for me to explain, make sense now.

I wonder if other programming languages have libraries like jQuery that can condense complicated and extensive chunks of code into easily-referenced bits of code only a line or two long.

I also found reviewing the DOM very helpful as It’s easy to get lost in the weeds when doing this line-by-line coding. I think of it as a sort of order of operations, which I’m sure it’s been described as before.

Looking ahead

I’m very excited to start building a profile site and to include the plethora of media I’ve produced over the past four years. I’m especially excited to show off my news photography and video work. Every profile site I’ve used on WordPress has had an unattractive profile layout that I didn’t find conducive to showcasing media. And the themes that did showcase media well I wasn’t interested in paying for.

I’m looking forward to talking with my profile subject, Ryan Schneiderman, about how he’s built his dad’s photography showcase, and hopefully take some good tips from him.

jQuery… to hide or not to hide

Coming into this class, I only had a vague understanding of JavaScript (let alone jQuery). After this lesson and the previous one, it’s neat that everything is a lot clearer on a fundamental level. It’s also awesome how the latter gives you the ability to significantly reduce the line amount of JavaScript due to its shortcuts (being the purpose of compression-oriented library). I think it also speaks to the relative openness that developers have when it comes to sharing (Google hosting for jQuery).

I think linking the CSS and jQuery pages to change multiple aspects using jQuery at the same time is a breath of fresh air. All the while, as the lessons noted, it still presents the possibility of things getting even more hectic within the page (if they’re not grouped/organized separately and intentionally). The mouseleave functions in the lessons were also really interesting. And the .animate( ) function is a neat tool. I haven’t thought much about how the standard practices incorporate significant design insight.

I remember in class, I believe someone asked why we would intentionally have a hidden element that would be unhidden upon the user’s activity. The mouse hovering over the menu button in this case was a time for using it that I had not beforehand thought of. Toggling the fade elements for the add to cart design is another interesting function.

Reviewing the DOM method was also good. In addition to that, specifically targeting descendant elements and excluding others.

Midterm

I’m looking forward to working on and finishing my profile. My web developer is with Facebook, and his company’s attention to all of the aforementioned possibilities in crafting visually appealing and intuitive websites is verified by the amount of users that it has worldwide. That, and the criticism it receives after the slightest update or change.

Bringing all the pieces together!

The jQuery lessons on Codecademy seem pretty straightforward, but with a few reviews and practice it will be by far the most straightforward and easy to comprehend. You could literally watch the code structure from the lesson notes and get through most of the questions. Much of the code follows similar patterns, making it the quickest to get through. After the week’s jQuery lessons, I as usual re-enforced the tutorial by watching a few YouTube videos from mmuts’s channel he has a lot of helpful tutorials on HTML, CSS, JavaScript, jQuery and other pertinent coding programs. Check him out here: https://www.youtube.com/watch?BaIgTKj1iCQ

I think my greatest concern is how to stay on top with the new coding programs while  perfecting the earlier programs. I realize there’s a likelihood of forgetting some of the previous lessons, especially JavaScript, which is the most challenging. I was wondering whether it is possible for a programmer to be solely proficient in jQuery and not JavaScript, yet be able to create great stuff without problems.

I’m really looking forward to bringing together all the various coding languages to produce something great. For my final project, I’m looking at developing a unique news websites that is visually appealing and fun for visitors to explore. I will want it to look something like this or better: https://blexing2.wixsite.com/mysite. I put this together on wix.com earlier. so far I doubt whether I can pull that off yet, but hopefully soon.

.showMe more

This week, we had the chance to learn and code using jQuery. It has changed the way people write JavaScript. jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML documentation, event handling, and CSS much simpler. What I found hard about learning jQuery is learning all the handlers and figuring the order of the code. For the upcoming days, I need to watch more videos and re-emphasize the knowledge in my mind.

I did a mistake while doing the chapters this week. I did the interactive lessons, then the quizzes for all the chapters and then I went back to do the freeform projects for each chapter. The issue was that I got the concepts all confused and when I tried to do the freeform projects I became confused with all the information and the concepts I had learnt. For the future, I am going to do each chapter fully and separately from one another and I am going to do all the parts of the chapter at the same time and not in pieces so that I apply whatever concepts I learnt immediately. This will help me build one new information in a more organized way.

Week 4

For this week’s tutorial lesson on Codecademy for jQuery, I wasn’t initially sure what it was in comparison to HTML, CSS and JavaScript. However, I learned that it was essentially just an extension of JavaScript, or what they referred to as a “library.” I thought it was neat to be able to accomplish the same dynamic function that JavaScript enables, just instead using JQuery with a way smaller amount of lines of code.

When reading about the structure of where to input certain elements when writing your code, Codecademy explains that HTML loads from top to bottom. In essence, it makes sense, but it’s just not something that I had thought about when learning HTML and such. So, putting JQuery at the bottom of your code allows it loads after everything else. This was like a low-key lightbulb moment for me to understand that this is the reason behind why pop-ups and elements controlled by JavaScript and jQuery are the last things loaded on a webpage.

Using jQuery seemed a lot simpler, which is great since I’m sure that is its purpose – using $() to target elements makes it easy to identify throughout the code and it remains consistent. Additionally, using the period sign as a means to attach the handler is practically the simplest way I could think of for connecting method that triggers a return function.

All in all, JavaScript was easier to learn than CSS for myself. In comparison to jQuery, JavaScript seems more difficult and time-consuming, because it is. Either way I am glad that the lessons are somewhat easier to digest the farther we get along with the lessons. The only thing is, Codecademy makes it so easy to learn and understand the material even when I’m not understanding it. It’s when I go to GitHub or another page and see a blank page then I feel like I’m lost, have no idea what to type or where to start.

$(“#iFeelBetter”).kindOf();

This week’s jQuery lessons came as a relief following last week’s focus on JavaScript. jQuery solves a problem that I’m glad to learn was more universal than just my own shortcomings: the JavaScript language is bulky, the syntax is confusing, and small mistakes are easy to make.

Unfortunately, using the jQuery library doesn’t eliminate the possibility for error, but it does render errors much easier to locate and address. Hooray for jQuery!

The biggest challenge

The exercise I found most challenging had to do with the DOM. I wasn’t expecting to have such trouble with it—I understood the basics of parent-child and sibling relationships within the context of HTML—but I found that using the DOM jQuery methods to reference various elements abstracted the code to the point where I had trouble remembering what I was supposed to be doing in the first place.

I can understand how jQuery selectors are useful for referencing specific areas of code, and how jQuery actions simplify the code that would be necessary to make things perform the desired behaviors. I also understand that utilizing the parent-child HTML structure by referencing it in the JavaScript makes the code more dynamic—that is, as things within the code change, the JavaScript functions will still apply.

Yet for some reason, using the .next(), .children(), etc. methods just felt like a big riddle. Onwards to more practice, I suppose!

Fun facts

This is just nerdy, but I was really interested to learn that the common case used in JavaScript is called “camelCase.” I had noticed its structure in earlier lessons, but didn’t know anything about it. Apparently, it’s named for the shape of a camel’s humps—with each hump representing a new capital. Of course, we’ve all seen it used in cases like “iPhone and eBay.”

A side note along this nerdy grammar thread: Is anyone else frustrated with Codecademy’s consistent misuse of “it’s” when they mean “its”?

What’s next?

In addition to putting out feelers for our midterm web developer profiles, I’ve been giving some thought to what shape I want my final project to take. At Georgetown SCS, we have a number of WordPress microsites that serve specific populations. The Hoya Professional 30 and the SCS Commencement site are two examples of projects I’ve launched. There is a nascent desire among the administration to launch a student life website dedicated to events, social resources, and student groups here at SCS. I think this is a project I’d like to take on in order to test the new development skills I’ve learned. The major hurdle I’ll need to figure out is the hosting (the other microsites are hosted through Georgetown Domains, which limits the themes and add-ons you can use).

More to come!

Logic, JavaScript and some questions

JavaScript proved to be simultaneously the most interesting and most challenging language yet for me. The Codecademy lessons were as good as they could be, but I certainly will need to review this language the most.  

Having struggled through logic in college, I was familiar with some of the key terminology and the concepts behind it — boolean connectors, statements, arguments, inferences and implications. I never had an opportunity to really apply those concepts except within equations. I now wonder if we should have been taught JavaScript alongside logic.

Learning how to write pseudo-code was a key takeaway for me. I know that writing pseudo-code will be immensely important not just for my own understanding but also to make sure the code is organized. For me, it’s always more important to understand the why rather than the how — I find that especially important here. I’m confident that the goal can be reached when I understand the concepts. The how will come.

There were some requirements that I found unnecessary in JavaScript that I feel I need more clarification on. Why is it that, when interpolating, you need to use the + sign? Why aren’t there more standardized ways to access your JavaScript in the HTML?

Java-what?

We had the chance to get exposed to a lot of information learning JavaScript this week. For the future, I want to start the assignments for the week much earlier so I allow myself to digest the information at a slower pace instead of cramming them in three days. I felt like if I had taken my time with it, maybe left it for a bit and came back to it, I would have been able to understand the concepts more easily. 

Apart from doing the Codecademy lessons, I spent some time learning about JavaScript, the history, and the benefits of learning it. JavaScript is great because it is extremely useful and works on various platforms.  It is easy to learn and can be found everywhere. 

I liked how Codecademy walked us through the logic behind all the shortcuts they have. For example, they do a lesson on if/else and show us how it can get complicated when dealing with more code and when more items are included. Then in the lesson after, they teach us how to use functions to make the code simpler. It can be a little frustrating to learn something and practice it, then to realize it is useless because there is an easier shortcut. However, I think it is important to understand the logic behind all the shortcuts.

I definitely need to do more exercises to become more comfortable with JavaScript. I am going to make a list of the basic codes and try to memorize them. This might be handy when we build on the rest of the codes. I will be using Khan Academy to learn more about how HTML, JavaScript, and CSS can be utilized to work together and create a final product. Also as we get into jQuery, it will help us simplify HTML, CSS, etc. This will allow us to see the bigger picture among all these languages that we learned so far.