DrumSensei

betwixt code and music

Image Gallery coming

Building a gallery for images posted from users

We have spent the week learning how to simplify JavaScript down into jQuery (although, that is an oversimplification itself, in some ways). Then we learned how to connect to a server using AJAX, pushing information to the server and then learning how to retrieve it. When you put that information alongside the small projects we did all week like creating a login page and making a todo list, then creating an instagram clone (albeit a smaller scale) is a logical outgrowth of that.

So, that is my goal for today and this weekend. If you need me, then I will be under the hood of Sublime Text reading some Input Mono and muttering to myself incomprehensibly.

Now time to leave

And head back home to

TIY - Day 15

This is it...don't get scared now...

We have driven deeper into this world of JavaScript and jQuery. Today we talked about review from last night's login page homework. I did not have time to get it fully implemented because I went to a meetup and watched some blazing React.js happening. I mostly understood it, but today Aaron showed us some things that made a lot more sense.



We learned how to interact with a server using AJAX. Not the cleaner bleachy stuff, heavens no! Of course I mean Asynchronous Javascript And Xml. Everyone knows that!



This allows us to give information to the server, remove information, or update information. (A slew of other things are also available, but this is plenty for now.) Now, you might be saying, "Hold on, Tex. What is a server? You talking about my waiter at Chili's?"

Great question! Most people have heard about things that are stored in the "cloud" and maybe they don't fully understand what that means. A google search of the phrase "the cloud" returned "About 47,500,000 results." SOMEONE is talking about it on the interwebs! The cloud is a great little marketing phrase for what used to be called servers. These are computers whose job consists of connecting other computers together and storing data. When you backup your iPhone to "the cloud," it is really connecting to a remote computer somewhere that is holding a copy of your iPhone backup. To be fair, these days we are using a lot of wireless technology, so it does seem as if things are magically happening through thin air. Perhaps that is why the phrase has caught on.

Anyhow, as we learned AJAX a bit today, it becomes plain to see how useful it is. I can finally get a better picture of how our job as front-end developers is to build out a website
and understand the ways in which it will interact with a server a.k.a. "the cloud." Today we built a little chat utility in the browser using jQuery and AJAX that could store information in an object on the server and then retrieve that information in order to provide a running list of messages in a chat room.

We have some fairly complex projects coming up, so things are about to pick up quite a bit, I feel. Time to buckle down and continue the onslaught, come what may.

The Iron Yard - Day 13

Week 4 - Day 13

JS + HTML = :]

Our homework over the weekend was to construct a to-do list using vanilla JavaScript i.e. just plain ol' JavaScript with no bonus features or extra doodly-whatsits. My implementation of this works pretty well. I wanted to add a few more features to it, but I had to learn some deeper concepts first.

On Friday
our instructor told us it was his favorite day of the entire span of twelve weeks. We officially learned to connect JavaScript to our HTML to produce a page like we are used to seeing in the wild. Remember, constant reader, the JavaScript is what enables actions to happen on the page inside of your browser. For instance, if you look at my very plain to-do list, you will notice that clicking the button next to the text input area will make that text appear below in a list format. While this may seem like an easy task, it does involve many steps.

First, we target the specific areas on the webpage that need action. On my list, those specific areas are the input text field, the clickable button and the "list" section below that.

Second, we create functions that tell us what action we wish to happen. For instance, when I click the button, the text from the input text area should become visible in the list section. At this point we should have thought about what areas are needed and what we need to happen with those areas.

Lastly, we add what JavaScript calls "event listeners" to be the messenger between our targeted areas and the desired functions. In my example of the list, I have JavaScript "listening" for a 'click' from the user on the button next to the input text area. When that button is clicked, the text is added to an array behind the scenes, the list section at the bottom is erased and redrawn with the updated list. All of this happens so fast that we cannot see it, but for every item added to the list, the entire list is erased and started over with all values. I am told that this will be useful later!

My reset button on the list example works in a similar fashion. It is "listening" for a 'click' to happen and then it interacts with the list values by resetting them all back to empty or zero and then redrawing the list section to reflect that.

In honor of our teacher
Aaron, enjoy some nutella...