Megan Taylor

front-end dev, volunteacher, news & data junkie, bibliophile, Flyers fan, sci-fi geek and kitteh servant

post

Food Walk

food-walk-08-13I have a wonderful friend who lives in NJ and is a passionate foodie. She comes into NYC once every other month or so and takes me on a journey of foot and mouth, walking up to 12 miles in a day to find interesting and delicious things to eat. This is a map of our August walk. Stops included Eataly, Joe’s Shanghai, and Taim, among many others.

August 31, 2013 | Comments Off on Food Walk | Categories: Posts | Permalink

post

Thinkful Unit 2 Comprehension Checks

Lesson 1

Assignment 1

What is the DOM (Document Object Model) and how does it relate to JavaScript/jQuery?

The Document Object Model, normally abbreviated to DOM, creates a hierarchy corresponding to the structure of each web document. The DOM is the API through which JavaScript interacts with content within a website.

Why would you choose jQuery over JavaScript to add interactivity to your web page?

jQuery is designed to make many JavaScript development tasks much easier.

Is there a difference between the following: jQuery('h2'); vs. $('h2');?

No.

Why is it oftentimes important to wrap your jQuery functions in the following?
$(document).ready(function () {do something;});

To make sure the page is completely loaded before running scripts.

How do you get jQuery into your web page?

Download the jQuery library from jQuery.com or include jQuery from a CDN, like Google.

How would you select an element vs. a class vs. an id in jQuery?

$( "div" );
$( "#myDiv" );
$( ".myClass" );

Describe the difference between and provide an example of each of the following jQuery selectors:

descendant selector
jQuery descender selector (X Y) is used to select all elements matched by ‘Y’ that are child, grandchild, great-grandchild, great-great-grandchild..(any levels deep) of a ‘X’ element.
Ex: $('form input'); ‘ selects all elements matched by <input> that are descendants of an element matched by <form>.

child selector
jQuery child selector (X > Y) is used to select all elements matched by ‘Y’ that are child of a ‘X’ element.
Ex: $('form > input'); ‘ selects all elements matched by <input> that are child of an element matched by <form>, Only child element will match, grandchild, great-grandchild will not match.

multiple selector
Selects the combined results of all the specified selectors.
Ex: $("div,span,p.myClass"); – selects all divs, spans, and paragraphs with the class “myClass”.

What does it mean to ‘traverse the DOM’ and how do you do it?

jQuery lets us “traverse” ‘ or move through ‘ the HTML elements that make up our page. First, we make an initial selection, and then move through the DOM relative to that selection.

What is ‘method chaining’? Provide an example.

You can perform multiple methods on the same set of elements.

<div id="divTest1"></div>
<script type="text/javascript">
$("#divTest1").text("Hello, world!").css("color", "blue");
</script>

Which methods can you use to add a new node to the DOM?

.append()
.add()
.insertAfter()

How do you delete a node from the DOM?

.remove()

Explain how (and why) to use ‘this’ in a jQuery function.

this is a special keyword that is used in methods to refer to the object on which a method is being invoked.

What is the ‘data tag’ in HTML5 and how do you access it in jQuery?

The HTML tag is used to store custom data private to the page or application.
You can access the values of the data attributes like this:

<img id="pic" src="picture.jpg" data-large="picturelarge.jpg" data-productid="52"
data-license="creative commons">
$('#pic').data('productid') // 52

How can you use variables to reuse jQuery objects in a block of code?

jquery Object Methods

Which jQuery methods can you use to add and remove a class?

.addClass() and .removeClass()

What methods can you use to make an event handler listen for keyboard inputs?

.keydown(), .keypress(), .keyup()

How might you use the .val() method to retrieve user input from a form submission? If you ultimately want to get an integer as opposed to a string value, what do you need to do?

var quantity = +$(this).val();

Why would you use event.preventDefault() in the function of an event handler that listens for clicks on a link?

To keep the page from jumping around.

How do you use jQuery to get and set style properties of a selected jQuery selection?

$(this).css("background-color", "#252b30");

Why might it be better to manipulate the style of a DOM element by toggling its class, as opposed to getting and setting properties directly?

Because it keeps the appearance and function separate, making it easier to maintain and manipulate.

What does the animate method do?

Adjusts a CSS property pixel by pixel in order to animate it.

Lesson 3

Assignment 1

What is the relation between JavaScript and Java?

Nothing. Silly marketing people.

What are the six basic types of values in JavaScript?

Numbers, strings, booleans, objects, functions, and undefined values

Why would the following JavaScript function not return the value 2?

function squareRootSquared() {
    var squareRoot = Math.sqrt(2);
    var squared = 2 * squareRoot;
    return squared;
}

Calculations with fractional numbers are generally not precise.

What does the % operator do? For instance, what would result would you get from 101 % 100 ?

Modulo, like remainder. So 101 % 100 would be 1.

When would you need to ‘escape’ a character in a string with a backslash?

Quotes inside quotes, newlines, backslashes, tabs

How do you concatenate two or more strings?

+ operator

How do the logical operators && , || , and ! work in JavaScript?

The && operator represents logical and. It is a binary operator, and its result is only true if both of the values given to it are true.
|| is the logical or, it is true if either of the values given to it is true.
Not is written as an exclamation mark, !, it is a unary operator that flips the value given to it, !true is false, and !false is true.

What is the order of precedence for operators (keeping in mind that you can always use parentheses when in doubt)?

Division and multiplication always come before subtraction and addition. When multiple operators with the same precedence appear next to each other (1 – 1 + 1) they are applied left-to-right.

What is an expression in the context of programming? How is this different from a statement? (HINT: Think about side effects).

A piece of code that produces a value is called an expression. An expression can be content to just produce a value, but a statement only amounts to something if it somehow changes the world.

What are reserved words?

javascript keywords that cannot be used as variable names.

How do you implement a while loop? How do you implement a do loop? How do you implement a for loop?

While loops: First, a ‘counter’ variable is created. This variable tracks the progress of the loop. The while itself contains a check, usually to see whether the counter has reached some boundary yet. Then, at the end of the loop body, the counter is updated.
Do loops:
For loops: All the statements that are related to the ‘state’ of the loop are now on one line. The parentheses after the for should contain two semicolons. The part before the first semicolon initialises the loop, usually by defining a variable. The second part is the expression that checks whether the loop must still continue. The final part updates the state of the loop.

Why is indentation important (though not necessary) in JavaScript?

The role of the indentation inside blocks is to make the structure of the code clearer to a reader.

What happens when the break keyword is reached in a loop?

It immediately jumps out of the current loop, continuing after it.

What is the syntax for a function in JavaScript?

function add(a, b) {
return a + b;
}
show(add(2, 2));

Why might you define a function within another function?

Because the computer looks up all function definitions, and stores the associated functions, before it starts executing the rest of the program.

Give an example of a recursive function. Why is the elegance of the recursive function not always preferable in JavaScript?

function power(base, exponent) {
 if (exponent == 0)
 return 1;
 else
 return base * power(base, exponent - 1);
 }

In JavaScript, running through a simple loop is a lot cheaper than calling a function multiple times.

What is an anonymous function, and why might you use one?

A function that doesn’t have a name.

Lesson 4

Assignment 1

What is a property in JavaScript? How do you add a non-existent property to an object?

A property is an association of another value with a value. If you have a JavaScript value with the type object, you can add and remove properties at will. If a property that does not yet exist is set with the = operator, it is added to the object.

 var empty = {};
 empty.notReally = 1000;
 show(empty.notReally);

What is an array? What do the following array methods do?

A set of numbers or objects that will follow a specific pattern
myArray.push() – adds an item to an array
myArray.pop() – removes an item from an array
myArray.join() – builds a single big string from an array of strings

How would you get the value of the item at a given index in an array?

var valueAtIndex1 = myValues[1];

What does the new keyword do in JavaScript?

– It creates a new object. The type of this object, is simply object.
– It sets this new object’s internal, inaccessible, [[prototype]] property to be the constructor function’s external, accessible, prototype object.
– It executes the constructor function, using the newly created object whenever this is mentioned.

post

Thinkful Unit 1 Comprehension Checks

Lesson 1

Assignment 1

Explain in words your grandparents would understand what happens after you type a URL in your web browser and hit ‘Enter’.

Browser reads the URL, finds the rules for talking to another computer, finds the name of the computer serving the webpage, finds which specific webpage you are looking for. From the name of the computer where the webpage lives, the browser can find the computer’s IP address(like a phone number). The browser connects to the IP address (like calling someone and they pick up the phone) and then if it can find the specific webpage you asked for, it shows up on your screen. If it can’t (like if you call and someone picks up but the person you are looking for isn’t home or its a wrong number) then it shows a 404 page.

What is a DNS, and what is its purpose?

DNS is like a phone book for computers. It’s how you can connect to another computer from your own.

What is a server and what is a path, and how do they relate in a URL?

The server is the computer where your webpage lives. The path tells the computer where the file you are looking for is.

Assignment 2

What do the ‘hypertext’ and ‘markup language’ in HTML mean, respectively?

Hypertext is simply the idea of documents that are capable of being linked together.
Markup languages are used to annotate and add semantic structure, or meaning, to a text document.

What is an HTML tag?

Tells the browser what different pieces of text are (list, header, paragraph, etc.)

What’s the difference between a span and a div?
The div tag is used to divide section of a webpage and a span tag is used to divide up text.

What is the doctype tag, and where does it go?

It goes at the very top of the HTML file. It tells the browser what version of HTML you are writing the document in.

Lesson 2

Assignment 1

Explain what it means when we say that CSS is responsible for presentation (vs. HTML, which is responsible for content)?

CSS adds color, size, columns, typography, images and layout

What is a selector? What is an element? How are they related in CSS?

The CSS selector is the HTML element we want to affect.

What is the general form for a CSS declaration (HINT: It’s a combination of the terms value, selector, property).

h1{color:#fff;}
selector:{property:value;}

What is a descendant selector, and how does it work?

Descendant selectors are similar to family trees; you start with the parent element you wish to select, add a space, and continue naming any interior elements until you’re arrived at the specific element you wish to select.

Assignment 2

How would you implement inline styles?

<p style="color:#fff;">text</p>

How would you implement internal styles?

<style>
p { color:#fff; }
</style>

How do you link to an external style sheet?

<link rel="stylesheet" type="text/css" href="stylesheet.css" />

Why is it generally a good idea to avoid inline styles?
Because it defeats the point of CSS, you would have to go back through everything to make style changes.

Lesson 3

Assignment 3

For a given styled div element, what would you expect the following margin settings to do:

div { margin: 10px; }
10px of space on the outside of the div (every side)

div { margin: 10px 10px;}
10px of space above and below the div

div { margin: 10px 10px 20px 5px;}
10px of space above the div, 10px of space to the right of the div, 20px of space below the div and 5px of space to the left of the div.

Explain the difference between the following values for the display property: block, inline-block, inline, none.

none: Turns off the display of an element (it has no effect on layout); all descendant elements also have their display turned off. The document is rendered as though the element did not exist.
inline: The element generates one or more inline element boxes.
block: The element generates a block element box.
inline-block: Basically, it’s a way to make elements inline, but preserving their block capabilities such as setting width and height, top and bottom margins and paddings etc.

What does the clear property do, and when would you use it?

return the document to its normal flow after floating

Explain the difference between absolute and relative positioning.

The relative value allows you to use box offset properties such as top, right, bottom and left. The absolute value breaks the element from the normal flow of a document.

What is the effect of setting a negative top margin on an element?

The element will be pulled up on the page.

Lesson 5

Assignment 1

What’s the difference between an HTML element and tag?

Elements are designators that define objects within a page, including structure and content. Some of the more popular elements include h1 through h6, p, a, div, span, strong, and em.
Elements are often made of multiple sets of tags, identified as opening and closing tags. Opening tags mark the beginning of an element, such as <div>. Closing tags mark the end of an element and begin with a forward slash, such as </div>.

What’s the difference between a relative and absolute path, and when should you use the former instead of the latter?

A relative path is used to point to something on the same computer or server. An absolute path is used to point to something on another computer or server.

Why would you often want to include multiple options when setting the font-family property for, say, the body element in your CSS?

Because the font you use might not be on your users’ computers.

Lesson 6

Assignment 1

How would you implement a gradient background for a given div?

 div {
 background: #70bf32;
 background: url('linear-gradient.png') 0 0 repeat-x;
 background: -webkit-linear-gradient(#a1e048, #6a942f);
 background: -moz-linear-gradient(#a1e048, #6a942f);
 background: -ms-linear-gradient(#a1e048, #6a942f);
 background: -o-linear-gradient(#a1e048, #6a942f);
 background: linear-gradient(#a1e048, #6a942f);
 }

How would you use an image as a bullet in an unordered list?

 li {
 background: url('tick.png') 0 0 no-repeat;
 list-style: none;
 padding-left: 20px;
 }

What’s the point of including the alt attribute in any and all img elements appearing in your HTML?

The alt attribute value is displayed in place of the image should the image not be available. Also, the alt text is the cursor tooltip text that may be shown when hovering over the image.

post

Learning Front End Web Development with Thinkful

Thinkful is an online learning community that combines online resources with personalized feedback and mentoring. They have a Front End Development course, and just added a Python course. I recently signed up for the Front End Development course, hoping to shore up my JavaScript and figure out some of the cool new features of HTML5/CSS3.

After looking over the syllabus, I was initially concerned, because they start with very basic HTML/CSS. Been there, done that. I’m confident in that skill set. But after voicing my concerns, both my mentor and the class coordinator assured me that I could skip anything I felt comfortable with and go straight to the JavaScript.

So this week, I’ll be doing a quick overview of HTML5/CSS3 features (beyond the new semantic tags), and then I’ll jump into the JavaScript/jQuery segment.

Here are some resources I’ve collected:

Road Map To Coding With HTML5: Tutorials and Guidelines

Top HTML 5 Tutorials from HTMLGoodies

Take Your Design To The Next Level With CSS3

HTML5 Rocks Tutorials

Dive Into HTML5

If you have any other useful resources, I’d love to see them!

post

My Ideal Twitter Client

I knew that the old-school Adobe Air TweetDeck was on the chopping block, but found out this morning that I have until May 7 to find a new Twitter client.

TweetDeck to be discontinued for Android, iPhone, and AIR on May 7th

I spent 2 hours this morning looking for a replacement, but haven’t found what I want yet. Nothing out there really replicates what TweetDeck does:

  • I want to the option to post to Facebook and Twitter simultaneously, but also separately. (I don’t actually need my Facebook newsfeed in the client.)
  • Desktop app. If I wanted to use Twitter in the bloody browser, I would do that.
  • I want the post box to slide up from the bottom or down from the top, but not overlay the timeline.
  • I want single column AND multi-column views.
  • I want the app to take up as little horizontal space as possible: 250-300px wide in single column view is fine.
  • Keep toolbars and column navigation buttons out of the way.
  • Autocomplete for usernames.
  • Retweet options.

I would add cross-platform to the list, but I don’t want to seem greedy. I work on a Mac, use Ubuntu at home, and sometimes I just have to boot into Windows. I would be happy to settle for a different app in each OS if it fulfilled all the other requirements above.

Someone, please tell me my perfect Twitter client is out there.

post

Volunteering for ScriptEd

For the past few months I’ve been volunteering once a week with ScriptEd, a non-profit organization that offers programming courses to students at schools in low-income communities in New York City. I co-teach 5 students at Harlem Village Academies for 2 -3 hours every Wednesday. So far, we’ve been covering HTML, CSS and JavaScript.

What’s cool about this group of kids is that they are self-selecting (yes, I see how this is also a short-coming, but it’s early days yet). ScriptEd is an after-school activity, rather than part of the normal curriculum, so they are really into learning how to code. They have stuck with it, through exams and SAT prep and baseball games.

This past weekend, ScriptEd had its first student hackathon. We had 11 students from 3 different schools and at least 12 volunteers (I lost track, since more people kept showing up over the course of the day) in addition to the regular teachers. We formed 6 teams, with 2 students and 2 volunteers each.

Our theme was CIRCLE, SQUARE, TRIANGLE.  We challenged the students to use their imaginations and create something awesome with these shapes — for example, students might decide to make the shapes bounce to the beat of a song, or have the shapes divide every time the user clicks on a shape.

The results were incredible. I was so impressed with what these kids came up with and were able to build with their rudimentary skills. It was really rewarding to see how excited they were to actually put their skills to use and build something they could show off.

Here are some of the projects our students came up with:

http://scriptednyc.github.io/Hackathon/harlemshake/shake.html

http://scriptednyc.github.io/Hackathon/colorblock/block.html

http://scriptednyc.github.io/Hackathon/memory/memory.html

http://scriptednyc.github.io/Hackathon/blackhole/hole.html

April 22, 2013 | Comments Off on Volunteering for ScriptEd | Categories: Posts | Permalink

post

Three WordPress plugin ideas

Because I can’t find any that do exactly what I want…

1. A sidebar widget that shows the 5  (or whatever) most recent commits by a user to any GitHub repo. Realized my commit messages are not useful, found a plugin to show a list of repos.

2. A sidebar widget that shows the 5 (or whatever) most recent public Gists by a user Found one.

3. A sidebar widget that shows 5 (or whatever) Meetup groups a user belongs to that are either the most active or have upcoming events.

April 18, 2013 | Comments Off on Three WordPress plugin ideas | Categories: Posts | Permalink

post

“I finished Codecademy, now what?”

I really like Codecademy about 80% of the time. It’s a good way to learn the syntax and keywords and concepts of a language. But it’s buggy and once you complete a course, there are few pathways to the next level.

I see this question asked on Reddit all the time, in various programming subreddits. The responses are not always kind, and there are  a lot of vague “Build something!” responses.  But I thought it would be helpful to compile the best ideas here.

PYTHON

Enkaybee: I always recommend Project Euler because it’s free and it presents some real challenges without any guidance. You have to think logically on top of knowing syntax. You have to write efficient code for many of them. Codecademy is the training wheels, Project Euler takes them off.

RojaB: Don’t you even feel prepared to contribute to open source projects like www.whatcanidoformozilla.com? Have you done API things (dunno what those are yet) for Python at codecademey?

AluGeris: I also have recently finished codeacademy’s python track. Completed ‘Rice university’s An Introduction to Interactive Programming in Python’ with flying colors. Now I’m into CheckIO challenges. They don’t have a learning course per say, but when I complete a challenge with my weak skills I am able to view other peoples solutions, which gives me an insight on how much easier I could have done something.

FletcherHeisler: See if the practical topics in the 2nd half of my course at RealPython.com might be of interest to you – maybe a good first step toward some of the scientific applications! For crypto and game dev I definitely recommend Sweigart’s two books respectively. For mobile dev (in Python!) you might want to take a look at Kivy. Definitely focus on one, maybe two courses at a time to make sure you’re making progress instead of just distracting yourself, but start with whatever interests you most at the moment!

monoglot: A new intro to Python course is starting this week on Coursera. Focuses on simple game design. https://class.coursera.org/interactivepython-002

johnflim: I heard about this site from a friend. i only just looked at it now, and the second puzzle deals with a cipher. PythonChallenge

eriiccc: Check out udacity.com. They have a bunch of python classes. I’m currently working on building a blog site with python and google App Engine. The guy teaching the class is one of the Reddit cofounders. They also have a class that goes over algorithms taught by Peter Nordvig. Both classes have been great so far.

R3TR0: Edx.org 6.00x. Seriously.

Mtn_Wolf: I say you should go to the DailyProgrammer. Here you can try out tons of different coding challenges. Rule #1 of Coding: Practice Practice Practice. Also! Keep all your programs you make. You will notice that you pick bits and pieces from previous works to build more complicated projects. Happy Coding!

wumsdi: Where do you want to go with programming? As a general advice I’d say: Learn more about data and computer science: Take a look at courses at Udacity.com, for example; read more about python http://pythonbooks.revolunet.com/) – and practice a lot (sites like http://codingbat.com/python are good for repeating – although the python part here is a bit short). Have fun!

303me: “Head First Programming.” It uses Python as the language and introduces you to basic concepts in programming, making a GUI, using libraries, etc. NOT to be confused with “Head First Python,” which isn’t as good of a book.

Cfattie: Well, if you’re into coding games, I would suggest “Invent Your Own Computer Games With Python”. I’m not sure how much of it is overlap from Codeacademy, but I guess you could skip the stuff you don’t know. I started with Learn Python the Hard Way but I switched to this because it tells you most everything you need to know to understand the program, and then gives you the program to copy and learn from.

kgleeson: Check out http://code.google.com/edu/languages/google-python-class/ Its a pretty basic course, but it gets you to do a lot of interesting things.

Jon-Targaryen: I’d recommend that you switch right away to the latest version of Python, Python 3. You should be able to pick up on the differences very quickly (as far as usage goes, it’s mostly just minor syntax). Non-Programmer’s Tutorial for Python 3 is a good wikibook tutorial.

cheifing: As someone who is also learning python, I would recommend: http://www.learnpythonthehardway.org/ Since you already know a bit about python, you’ll go through the beginning chapters very fast, but the later ones get interesting. The author also checks the comments very often, answering any questions you may have. If that seems to advanced for you, or if it gets too hard, I would recommend this book. This book is great if python is your first language, and goes through everything in detail. It also teaches you some of the general programming lingo.

herefortheawws: I would try the flask (flaskr) or django tutorial, or another framework. That way you will actually move to putting things online, and it will gradually make more and more sense, and it will be easier to transition to making your own web apps (if that’s something you want to do). IMHO, there’s only so long coding practice is useful until you need to learn how to put it all together.

IronPhysco: The other comments suggesting that you should tackle a personal project are good, and I definitely suggest you do that as well to become more familiar with using python in practical applications. It’s difficult to find tutorials for practical code exercises outside of academia, so if you can think of some small utilities like:

  • grab a webpage from a given url and download all images
  • write an image-to-ascii program (and the corresponding ascii-to-image converter)

or possibly a game (and smart AI) such as

  • tic-tac-toe
  • connect-4
  • a program that can play battleship against you or itself (and can draw the board on the terminal)

you’ll learn a lot from analyzing the task itself, and from getting stuck on a certain function and looking up ways to improve your approach.

However, you do mention not knowing much about intermediate subjects of programming. If you wish to take a deeper approach to learning the why-does-this-work side of programming via Python, I suggest you dive through this text written by my CS professor. The Art and Craft of Programming: Python Edition. He starts from the basics and works his way up to data structures (something I don’t think was covered in your linked text) and operations on 2D arrays (matrices). You’ll learn a lot from the data structure sections, specifically why some structures are better than others in certain cases, and when you should use them.

I would also recommend looking into “Big O Notation” for more advanced theory into algorithm complexity, something which I cannot stress enough how useful an understanding of this is for writing quick and efficient code. A good summary/example for beginners can be found here: A Beginner’s Guide to Big O Notation. Using this knowledge with an understanding of different data structures can keep your future programs from stalling unnecessarily when operating on a collection of data.

JAVASCRIPT

pandu13: Try learning JQUERY. A javascript framework.

d0gsbody: The sidebar here has a pretty great list of resources, especially if you check the Mozilla link. (As you quest forward, google, stackoverflow, and mozilla dev network will become your best friends).

Start working your way through Eloquent JavaScript. When you can’t understand 3 paragraphs in a row, start googling for answers.

Get the tampermonkey (chrome) or greasemonkey (firefox) plugins for your browser. Start writing Greasemonkey scripts for your favorite webpages. Post them to userscripts.org.

Start using developer tools. Use the console in your browser. Set up a github account and start pushing your better code to it (like your greasemonkey scripts). If you’re not already using a text editor, download Sublime Text 2.

I know you said you don’t want to do a bunch text, but, just so you understand how your jQuery actually works and are equipped going forward: Go to projecteuler.net. Start solving these (this will force you to learn a lot of syntax and to thing algorithmically, which pays off in spades). Write pseudo-code solutions and then actually code them up in JavaScript. Push these to GitHub.

Be active in this community and others. Learn from collective intelligence. Post your questions!

Most importantly, just don’t stop coding. Your knowledge will snowball.

EvanHahn: I made JSTypes and Fiesta.js to learn JavaScript in depth. In order to learn Ruby on Rails, I’m currently working on a site that allows you to meet up with other Super Smash Brothers players in your area. I’ve a bunch more things I’ve made on my website, if you’re curious, and most of them were terribly educational.

IncipLTN : I hear The Definitive Guide is more of a reference book and not as good for beginners. I’d instead suggest Javascript: The Good Parts, but my first suggestion would definitely be Professional Javascript for Web Developers. Eloquent Javascript is another very good option, but it doesn’t go quite as in depth as those two books. I personally did a whole mishmash between the three and somehow came out okay, but I’d definitely suggest sticking with Professional Javascript. But really, your next step should be making something. Anything that interests you. Node.js piqued my interest, so I picked up Smashing Node and I’ve now built a decent IRC Client and I’m half way through building an IRC server.

d0gsbody: Join my study group: http://www.reddit.com/r/learnjavascript/comments/1bombd/announcing_the_how_to_learn_js_properly_study/

If you just finished Codecademy, make sure you do the Discover DevTools course in the next week (it’s linked in my study group post). It’s OK if you don’t understand the whole video, just try to burn through it and know how to open the console that codecademy never taught you about, though you used console commands quite a bit (“console.log”). The study group is going to incorporate a decent amount of jQuery.

PHP

krues8dr: Time to learn a framework or two. Picking up Symfony or Laravel will help you out dramatically from here.

April 17, 2013 | Comments Off on “I finished Codecademy, now what?” | Categories: Posts | Permalink

post

Project Idea

After dealing with movers, cable guys, couch guys, wall building guys, and every other service guy imaginable, I had an idea for a side project for you. Also, this may exist already, haven’t looked yet. But it’s a site where you plug in what the service was, how much it cost, how long it took, how happy you were, variables like that, and it spits back out how much to tip the service guys. I don’t know if data like this even exists but it would be very HANDY (get it? ;) ) Just food for thought.

h/t Ezra

post

Visualizing Farmers Markets in NYC

<Stream of Consciousness>

Problem: GrowNYC does not have an at-a-glance visualization of what farmers market are open and where they are.

Solutions: Calendar and map visualizations, to answer both “What’s open now” and “What’s open near me.”

Implementation: I’ve never worked with .ical files before, but I would imagine you could scrape the data off the GrowNYC site and run a script to format it to be added to Google Calendar or whatever. I’m more interested in the map visualization. I’ve done some work with KML and GIS before, so I know it would be possible to scrape the data off the site and build a map with different icons showing year-round, open and closed markets.

Sub-Problem: I know how to scrape a single page of data, but have no idea how to go about scraping a series of static pages.

Solution: Google that!

I would like to scrape the data into a Google Spreadsheet, this would enable a lot of versatility and less maintenance (maybe?). Then set the scraper up to run once a week or so to update the spreadsheet. Spreadsheet could easily be used as the basis for both maps and calendars of various types.

Data needed: Each market’s location, active days of the week and hours, special closed days?, location, special events occurring?.

List of markets

Each market then has a page of its own (which contains the data needed!) like so:

97th St Greenmarket

Technologies:
Probably could all be done with Python. Use Beautiful Soup for scraping? How to get scraping results into Google Spreadsheet then? Google Spreadsheets also has a scraping language, I think. Could try to figure that out.

</Stream of Consciousness>

Yes, this is actually the way I thought this through on the way to work this morning.