top | item 4642330

Show HN: LearnStreet - The Best Place to Learn How to Code

101 points| teamls | 13 years ago |learnstreet.com | reply

Hey HN -

We’ve built a site where you can learn Python, Ruby, and JavaScript in a fun, engaging and interactive way. How is LearnStreet different from other learn-to-code sites you ask?

UI/UX: A key aspect of LearnStreet’s courses is its distinct UI/UX. In order to see this, simply sign up!

Multi-modal: Our courses are designed for beginners, and we have multiple ways to help you learn, including live chat, Twitter, Q&A, hints, videos and background material. If you don’t know which language you want to pick up, check out our teaser videos in the Courses page! http://www.learnstreet.com/lessons/languages/javascript

Code Garage: If you already know how to code, check out Code Garage where you can try your hand at cool coding projects like building a Mastermind game or a Sudoku Solver. http://www.learnstreet.com/cg/simple/projects/javascript

Dev Tool: We’ve culled the web to provide some key resources beyond the core programming language that will help you gain a better understanding of what it takes to become a competent coder. http://www.learnstreet.com/dev_tools/

We just launched about a week ago and would love to get your feedback. We are looking for expert coders to help build out our other courses so check out the Contribute section on our site as well.

Coding Starts Here!

-The LearnStreet Team

61 comments

order
[+] justjimmy|13 years ago|reply
Still waiting for a code teaching site that actually explains how everything fits together.

What's HTML used for? What's CSS? What's the bigger picture? What's the difference between java and javascript? Why are there so many languages. What are all these terms you are spitting out? Can we get some real world analogies so we can grasp some concepts?

But every single lesson from all these startups starts with type 'this' in or 1+1.

I don't think coding lessons should start with 1+1. It should start what coding is, what the language is, why I am learning it and what I could do with it and most importantly, what is different about it compared to rest of the languages. You got Python, Java, HTML, CSS, Ruby, C+ and the list goes on. I think it'd be very beneficial to have a map, that shows every day stuff that people use and list how it was built. ie: iPhone are built on 'X', Android are built on 'Y', Websites are normally built with 'Z', but you can add 'A', 'B' and 'C' to make it even better etc.

To me, the approach taken by these sites are almost identical. And they're all missing something…

[+] russelluresti|13 years ago|reply
Actually, most of that information is unnecessary to start coding. In fact, it actually works as a barrier to entry. People who don't understand a programming language aren't going to understand the different nuances between Python and Ruby.

Instead, you teach development by having people start coding as soon as possible. You get them playing with the code, manipulating values, and seeing the outcome. Once they see that they're creating something and they enjoy doing it, that's when you explain it to them. Khan Academy has taken this approach and it has proven extremely effective in getting children to start coding.

It's really basic game theory - you don't have to explain the entire backstory or all the controls to get someone playing a game. You drop them in a situation and go "OH SHIT YOU'RE UNDER ATTACK - PRESS X TO ATTACK." You give them one instruction and get them hooked. After that, you can then go through the basic tutorials that explain the menu system and or what numbers mean or how you level up or whatever. But the point is to explain things to them as they need to know them and not before.

The point is to get people coding as quickly as possible. If someone has to read 60 pages of introductory text, they're not going to do it. It's asking for too much up front.

[+] hluska|13 years ago|reply
I see what you're saying and there are some sites that do a pretty decent job of what you're saying. For example, Opera has some amazing documents on their site. The much maligned w3schools even does a pretty decent job of showing how everything fits together (in the context of web development).

The problem that I see with your approach is that it is really hard to explain certain concepts to people without any experience. For example, if I wanted to explain the difference between Java and Python, I would likely have to get into the difference between static and dynamic typing. I can't think of a way to explain a type system to someone who can't write a basic program.

Another concern I have is that too comprehensive a resource could actually teach bad habits. If I would have learned from one source, I wouldn't have learned how to debug via Google. I can't tell you how many times knowing how to answer questions with a search engine has saved me!

Great comment though - I bet the developers love reading feedback like this!!

[+] AlexBlom|13 years ago|reply
On top of this, once the coding starts, too many languages focus on command / effect (note: not cause / effect). This is arguably fine for basic looping and data structures.

The problem is I see this knowledge break when 1) it is applied to a more difficult problem that 2) is outside of the scope of the provided loop.

Spending time understanding the conceptual elements (when, where, why) before the how doesn't give immediate results, but it saves many headaches down the road and makes future tools / languages much easier to learn.

[+] helen842000|13 years ago|reply
I agree with this. I think some attention needs to be paid into teaching people how to set up their environment outside of the browser.

I mean it doesn't sound too good if you say, 'oh I've learned to use Python' and someone asks you to show them & you have to show them inside of the learnstreet tutorial as you don't know any other way.

I do think it's great people are investing time and effort into this area but it just needs some context so that people can actually walk away with skills from it.

[+] swanson|13 years ago|reply
I'll be "that guy".

You should change your Github OAuth permissions. I'm never giving you access to private repos - and would only give you access to public repos if you were creating a repo for me to do the Code Garage stuff (it isn't clear if you do that or not).

I'm happy to auth with Github if you just request my public profile.

[+] msarchet|13 years ago|reply
Same here, it was a instant nope.
[+] teamls|13 years ago|reply
Hey HN -

We’ve built a site where you can learn Python, Ruby, and JavaScript in a fun, engaging and interactive way. How is LearnStreet different from other learn-to-code sites you ask?

UI/UX: A key aspect of LearnStreet’s courses is its distinct UI/UX. In order to see this, simply sign up!

Multi-modal: Our courses are designed for beginners, and we have multiple ways to help you learn, including live chat, Twitter, Q&A, hints, videos and background material. If you don’t know which language you want to pick up, check out our teaser videos in the Courses page! http://www.learnstreet.com/lessons/languages/javascript

Code Garage: If you already know how to code, check out Code Garage where you can try your hand at cool coding projects like building a Mastermind game or a Sudoku Solver. http://www.learnstreet.com/cg/simple/projects/javascript

Dev Tool: We’ve culled the web to provide some key resources beyond the core programming language that will help you gain a better understanding of what it takes to become a competent coder. http://www.learnstreet.com/dev_tools/

We just launched about a week ago and would love to get your feedback. We are looking for expert coders to help build out our other courses so check out the Contribute section on our site as well.

Coding Starts Here!

-The LearnStreet Team

[+] shaufler|13 years ago|reply
This looks great guys! I especially like the tutorial flow.

Some criticism: You should show JS syntax errors instead just showing a generic error message. I understand you don't want to scare newbies away with compiler errors, but your solution just makes debugging more difficult.

You should show syntax errors, but translate the default JS error messages into something friendlier. Codecademy does this for their intro lessons.

[+] techpeace|13 years ago|reply
That Heroku video you link to on the Dev Tools page is about 4 years old, and is demoing a version of the product that no longer exists (their attempt at an online IDE of sorts).

Looks like a great product, though! Keep it up.

[+] intellegacy|13 years ago|reply
I don't understand why we cant skip around the lessons in the python tutorial. I don't need to start at lesson 1; i want to skip around to different lessons.
[+] lowglow|13 years ago|reply
On your javascript tutorial, it kept giving me an error when I typed in the string "Javascript" as it instructed.
[+] jfarmer|13 years ago|reply
Disclaimer: I'm a teacher at Dev Bootcamp (http://devbootcamp.com). Everything I say comes from love -- if I didn't care about this deeply I wouldn't bother to remark in the first place. :)

Very nice! We can always use more absolute-beginner tutorials in the world.

Just started the Ruby tutorial:

"Great! So what just happened here? To begin with, let's define what you typed 2 + 2 as instructions. The ruby console reads your typed instructions, interprets it, and then acts on the instructions the way you gave it. This step is called evaluation. Instruction when complete are called an expression. If the instructions you have typed are incomplete (for example, if you typed 2 + and hit enter), this console will show an error message. The instruction you typed, 2 + 2 is an expression. It is important to remember that evaluation of an expression always returns a value. This value is what is shown as result on the console. In this case, 4 was the result of the evaluation."

If someone honestly knows nothing about coding, you've probably just lost them right there. Questions a beginner would ask:

* What is a "ruby console?"

* What instructions? I typed "2+2."

* What does "interprets" mean?

* How can instructions be complete? Were they ever incomplete? How do I know when they're complete?

* "Returns?" "Value?" "Result?"

In a few sentences, with jargon highlighted:

I type instructions into a console which turn into expressions when they're complete. The console evaluates the expression and returns a value, which is shown as a result on the console.

A beginning programmer won't have the mental models necessary to make sense any of that. It's context-free. Most of those words have no prior associations, and those that do will lead them astray. Metaphor is your friend.

For reading, I recommend Bret Victor's essay on Learnable Programming: (http://worrydream.com/LearnableProgramming/) and Mindstorms by Seymour Papert (http://www.amazon.com/Mindstorms-Children-Computers-Powerful...).

[+] teamls|13 years ago|reply
Thanks for the feedback! We're always iterating on our course content, so we'll keep this in mind.
[+] alexholehouse|13 years ago|reply
Looks great, really nice. Minor point, I have a feeling (and can't find evidence to the contrary) that Twitter's stack is actually Java, not Ruby [1]. They may have changed back since then, but I can't find anything about it. Maybe I'm totally off though, and other parts of their stack are rails. I don't know - I'm not really a webdev guy...

[EDIT] - any reason for the downvote? I'm totally fine with being wrong, or have I just completely missed something?

The reason I brought it up was because when you select Ruby, one of the motivational messages opens with, "Twitter uses Ruby to power 400M incredible tweets every day."

http://www.readwriteweb.com/cloud/2011/04/twitter-drops-ruby...

[+] jitl|13 years ago|reply
Twitter runs a whole range of different technologies, as you can see from their Github page [1]. Much of their performance-sensitive code is Scala, but they also run Python, Ruby, C, and Javascript tools.

Their front-end, however, remains Ruby. The link you posted is just about search infrastructure.

[1]: http://twitter.github.com/

[+] kyro|13 years ago|reply
Although these types of sites (Codecademy, etc) are great and teach absolute beginners all the basics of programming, they've left me lost as to how to continue developing my skill set. I've hit a wall for some time and am stuck in this strange better-than-a-beginner-but-still-terribly-amateur middleground where the resources I keep coming across are either tailored for fresh beginners or more advanced programmers.

Does anyone have any suggestions or good resources that are tailored to my level?

[+] skyhook_mockups|13 years ago|reply
Everyone is different. Speaking for myself, I never found books or tutorials useful. My mind simply balks at the prospect of doing exercises for the sake of it.

Instead what worked really well for me is to find a practical problem that I wanted to solve (maybe with the goal of making money from it). It turns out that just about any interesting project that you dream up for yourself will have aspects that are outside of your current knowledge/ability. Then as soon as you hit these parts start looking for reference materials, documentation or tutorials specifically related to this problem. Before you know it you're learning new stuff.

And the upshot of this approach is, that if you stick with it you may end up with a functional product at the end, which you can sell.

Also read other people's code. I find it really humbling to read well crafted code. It also motivates me to continue refining my own code.

[+] allsystemsgo|13 years ago|reply
I'm not quite at your point yet, but I'm getting close. I've taken a class in Java, built some simple programs like an address book etc. Then I journeyed into python, ruby etc. Nothing really struck a chord with me until python.

In any case, I'm still plugging away, but I have learned about doing basic math, variables, etc etc quite a lot. I'll keep going but, in the end, what I want to make is a fully functioning and actually USEFUL web app that LOOKS and FEELS professional.

So many of these online resource just take you half way. They try to be SO user friendly and approachable, but in doing so the tutorials are filled with too much useless fluff. "We are different because we make learning FUN!"

Or, the tutorials are just far too advanced.

[+] crntaylor|13 years ago|reply
Get a copy of Structure and Interpretation of Computer Programs [1] and read it beginning to end.

It won't teach you how to use any frameworks. It won't teach you how to write a particular language (well, you'll learn a bit of Scheme, but that's a by-product). Instead, it will teach you to think computationally, which is a far more valuable skill.

I can't emphasise enough how much that book improved my programming. Everyone should read it. If you read that book beginning to end and do all the exercises, I don't think it's an exaggeration to say that you will instantly be in the top 1-10% of programmers worldwide.

[1] http://mitpress.mit.edu/sicp/full-text/book/book.html

[+] nicolethenerd|13 years ago|reply
I'm not a Rails dev, and I admittedly never made it all the way through this book (more out of lack of time than lack of interest, though), but I was very impressed with the first few chapters of http://ruby.railstutorial.org/ruby-on-rails-tutorial-book

It manages to cover material fairly quickly and talk you through getting a working webapp up and running (and deployed!) while still taking the time to explain the little things that a more experienced dev might find obvious.

[+] chudi|13 years ago|reply
If you want to go out and try some more mathematical approach use the exercises on http://projecteuler.net/ to improve a little on the math side

If you want to understand what the computers does and on what level you just need to start reading books or going to courses

Books about algorithms and data structures (Cormen et al) Any book introductory to Operating Systems is a must (Tanenbaum or Silberschatz operating systems)

[+] pendext|13 years ago|reply
This might be an obvious suggestion, but have you tried building something useful? I have found myself in that strange in between space before when learning a new language, and by starting to build something I am able to quickly move past that middle ground.
[+] teamls|13 years ago|reply
We're coming out with some "intermediate" level content soon ;)
[+] eranation|13 years ago|reply
I like it, I agree with the GH comment, I used twitter, your tutorial is great, though a bit long, didn't wait till the end. I would add a "skip the basics" option for people who already know adding numbers. but besides that looks great, but how are you different from all the others? (See partial list here http://eranmedan.com/post/22359967135/codeschools)
[+] jkeesh|13 years ago|reply
If you are looking for a new approach in learning how to code, check out CodeHS. While LearnStreet is an amazing tool, and another great way to be introduced to programming, the site immediately feels very similar to Codecademy. A responsive console is very cool, but I don't think it is the best way to connect with absolute beginners.

Our philosophy is that the key to teaching beginners is on providing help from real people, and that is what we are doing at CodeHS. Would be grateful for any feedback from the HN community.

[+] JPonczek|13 years ago|reply
LearnStreet is a great introduction to the world of coding. They have a bunch of really awesome Code Garage projects, and I especially like making the games, and Conway's Game of Life. Their teaching methods are very welcoming to someone who hasn't been exposed to this stuff yet, and I recommend anyone who is even remotely interested in learning how to code to give it a try, you won't regret it.
[+] quad_copter_cat|13 years ago|reply
It wouldn't work for me in Safari 6.0 / OSX 10.7.5. Never made it past the green progress bar.
[+] rurounijones|13 years ago|reply
Comments:

When I log in with Github why do I have to enter my name and email on the sign-up form?

You guys already got permission to read that from github, if you want to offer flexibility then at least put in the defaults and let me edit them.

Also "Email Id" could be named better.

[+] sdesai|13 years ago|reply
LearnStreet coming out with a bold statement, but from a quick review of the site, they are offering something different. This is going to be a big market for the service that cracks the code...pun intended.
[+] DGCA|13 years ago|reply
I can't play around with code after the lesson is over. As a UX analyst, this bothers me. The interpreter shouldn't just shut down after the lesson is complete.
[+] zio99|13 years ago|reply
I'm logging in with Facebook but I keep getting this error:

  The page you are looking for is temporarily unavailable. Please try again later.
[+] JosephHatfield|13 years ago|reply
I'd like to see a course that teaches new languages by first teaching me how to read existing code before asking me to write a single program.
[+] lutusp|13 years ago|reply
The argument is often made that understanding a language comes more quickly by writing and executing small examples than by reading examples.
[+] swagv|13 years ago|reply
Liking the Code Garage stuff at least. Not your typical "hello world" fodder, which I never found too practical.
[+] bromang|13 years ago|reply
the indentation the code editor shows does not always reflect the actual indentation of the code. so i had to c+paste it into another window and then back again to get the code to run...
[+] teamls|13 years ago|reply
We will be releasing changes to the code editor which will resolve the indentation issue in Python.