Git for Beginners (and DropBox Users)

I first began using Git because Github was where all the cool kids hung out. They posted all their cool code and snippets and projects online and had dozens of followers. Yet the only people who could see my super awesome projects that printed “Hello World” were me and the Chrome incognito man.

He has seen my code, among other things.

He has seen my code, among other things.

So I looked into Github a bit more and realized that Github is actually a resource for users of Git, an easy-to-learn-and-use SCM tool (software configuration management–basically, Dropbox for your software) that works from your command line (though there are also GUIs available, we’re pretty cool cats and prefer the command line–it’s simple and unambiguous).

A brief overview of terms that we’ll be going over in more detail unless I forget (Git commands will appear in text like this):

  • repository – This is what we call the structure that Git uses to store your project and the changes you make to it. Do not confuse this with the folder that your project is in. A Git repository is the .git subdirectory in your project folder, which keeps references to your changes (or commits).
  • add – Git won’t automatically infringe on your privacy and steal all your code. You have to give up your files yourself. So to allow Git (your .git repository) to track your files, you can run git add file1 file2 file3 (only track file1, file2, file3), git add . (add all changes in the current directory), git add --all (add all changes in this directory and all subdirectories), etc.
  • commit – just like every commitment you make in life, these stick around. Every time you “commit” a set of changes to your files, those changes will stay in your history forever. That sounds scary, but it’s actually pretty great because you can go back to that moment in time at any time. (Or, like the social commitments you make as an EECS major, they can also be ignored forever.)
  • revert – Basically, scrape out a bad commit. Pass this command a commit ID and it’ll remove it from your codebase.
  • status – See all changes you’ve made that haven’t been committed or files you’ve changed that you haven’t added to your repository.
  • log – See recent commits.
  • clone – Make a copy of the specified remote repository on your machine.
  • push – Push your local commits to the remote repository.
  • pull – Sync up your local repository with the remote repository, pulling in all commits that have been made since the last time you’ve synced. You should always pull before you push.

Continue reading

Hacking Electronics Part 1: The Official Novelization

A couple weeks ago we held the rather chaotic inaugural hardware workshop in (once again) 306 Soda. If you didn’t get a chance to implement all of the hacks we went through, were confused during the workshop, or just couldn’t make it that day, you can follow along to this write-up!

You’ll need an Arduino and some parts to actually build the hacks, but if you don’t have them that’s OK – this is meant as a thorough explanation of the basic concepts of electronics, and we’ve included videos of Sid and Nelson actually building the circuits.

(Shameless plug by Nelson: Arduinos are still on sale if you want one to experiment with!)

Continue reading

Javascript, Photo Filters, and First Person Shooters for Beginners

If you weren’t at the “Javascript for Beginners” workshop last Thursday, then you’ve missed out on a great time. No problem though, you can follow along below to work through the same content.

The workshop is broken up into 2 parts (and a top-secret third part that will be posted on demand). They are independent so feel free to start at any one.

Part 1: Introduction to Javascript Syntax
Part 2: Javascript event handlers and your first dynamic web page

Part 1: Introduction to Javascript Syntax (photo filters)

Javascript is the language of the web. What does that mean? Well almost every website you frequent wouldn’t work without it. When you load a webpage your browser receives three parts: The HTML, the CSS, and the Javascript. The HTML is responsible for laying out the page and includes the actual text. The CSS is the styling component — it specifies colors, fonts, shadows, and fancy stuff like that. Those are pretty cool, but Javascript is what ties it all together. Javascript introduces logic to your web page; it can, for example, change your HTML and CSS in response to the user clicking a button. Without Javascript, the page would be an extremely boring static page with no interactivity.

So lets dive into the syntax. Javascript is a dynamically typed language. That means it behaves more like Python, where you don’t have to specify the type of a variable like in Java. Javascript and Java have very little in common despite the names.

For this part of the workshop we’ll be using this website: http://introjs.hackersatberkeley.com

You must be using Google Chrome 21+ for the page to work!
Click `allow` in the information bar to activate your webcam.


You should see a picture of yourself on the left and a black box for entering code on the right.

So our task for the first part is to create a photo filter that will make the photo we take on the left look great.
The code on the left is the Javascript that will be applied to the photo. There should already be some code in that box. We’re writing a function called filter(..) that will take in a parameter called pixels, modify them in a way of our choosing, and then return them so they can be shown in the browser.

Continue reading

Intro to Fitting into 306 Soda and Hacking

Last night I attended H@B’s largest, most fire-hazardous workshop to date: Intro to Hacking. My job wielding the almighty camera meant that I had plenty of time to ponder the speakers’ words as my arms went numb. Having never been formally initiated into hacking when I was a beginner, I (embarrassingly) hadn’t learned what many crucial hacking terms were until recently. In fact, just last semester I still thought typing pwd in my terminal would let me change my password (you’ll understand why that’s so embarrassing if you Google what it means). I also didn’t really understand what a protocol or a server was, despite hacking largely on web-based projects.

HP Auditorium (306 Soda Hall) filled up before the clock struck seven and people ended up sitting two-wide in the two aisles. If someone were to spontaneously combust, no would would be able to escape the carnage. But never mind that; I made a crappy timelapse of the mob:

And you don’t even see the left side of the auditorium. I put a couple of seats up on stage next to where I was filming, but no one wanted to sit next to me :(.

So with all that bloggy fluff out of the way, here’s my walkthrough of what went down last night, as well as my own strategies for conquering the terrifying beast known as hacking (in a hazardous room with slow AirBears).

First, pgao (Peter Gao) gave a moving speech about what it means to hack and to have the mind/soul/body(?) of a hacker. You should watch it because I lost the transcript that he sent me. And because you want to become best hacker like Mark Zuckerbearg [sic]. I call it Intro to Intro to Hacking.

/me sheds a tear.

Before we go on, if you don’t understand what a function or an array is, you should check out this page put together by Vaishaal, who taught the workshop along with Nelson Zhang and pgao. Remember to come back when you’re done being amazed!

Now, you’ll notice that pgao likens the tools that hackers use to Legos. I, however, like to compare them to my friends. I don’t really know what complicated processes shape their thoughts and actions, but I do know that certain calls to them will evoke a response. That is, they provide certain functions for me to achieve my desired functionality. For example, if I wanted my friend Vedant Kumar to pose for a photo for me, I would call Vedant.recieveLostWaterBottle() (that is, call the recieveLostWaterBottle() function on my friend Vedant), which would result in him posing for a photo with said lost water bottle:

Sad, lost water bottle seeking owner.

Sad, lost water bottle seeking owner.

This water bottle has already found an owner. He's pretty happy.

This water bottle has found his owner. He’s pretty happy now.

In this case I’m not entirely sure why he chooses to pose for me with only lost water bottles, or how he manages to look so good, but I am happy that I have received the intended result from my function call to Vedant.

Continue reading