Learning to Code

Learning to Code

ascendHeader3 (1)

There are dozens of free and accessible ways for students (and teachers) to learn how to code, design web sites and make apps. Here we highlight some of our favorite options, ranging from easy, elementary-friendly sites that feature visual interface, to step-by-step sites where more advanced learners can learn languages such as Ruby, Python, and Javascript. Besides code-teaching sites, we also included some sites and resources to take you beyond the “Hour of Code”.

 


Code.org Studio is the learning platform offered by Code.org. Students can learn basic programming with some of their favorite characters like Elsa from Frozen, Angry Birds, and Plants vs. Zombies. It offers both visual code scripting and ‘under the hood’ mode to see how blocks translate into actual JavaScript.



Code Academy is a premier learning site for coders of all skill levels. Work through step-by-step modules in a variety of languages (JavaScript, HTML/CSS, Python, PHP, and more) to build actual websites, games and apps. www.codeacademy.com/


Arguably the best and easiest way to teach programming to younger students or novices. Scratch was created by MIT and is a completely free way to make art, games, animations and more with graphical code blocks. Users can share their projects, remix others’, follow tutorials while teachers keep track of it all. scratch.mit.edu/


Screen Shot 2014-12-22 at 3.26.37 PMLightbot is a puzzle-style game that teaches programming logic like functions and loops. Students program a robot to light up a bulb to move to the next level. No programming languages are involved and it is easy way to onboard students to the idea of programming. www.lightbot.com/


Tynker is a for-profit Scratch-like site offering robust features, including kid-friendly tutorials (some paid), teacher dashboard (premium) and a physics engine to help students build the next Angry Birds. www.tynker.com/


Code Avengers began when a teacher in New Zealand wanted to teach his students how to make websites. It has now evolved to a platform for all types of learners who want learn HTML/CSS and JavaScript. Not all the levels and features are free. Codeavengers.com


Google created Made With Code to help students visualize what kind of projects they can build with code. It hosts a community and mentoring profiles. Learn how to make your own GIFs, LED dresses, and more. MadewithCode.com


Code Combat teaches JavaScript while you play a dungeons and dragons-style game. It is an open source community where learners and coders are encouraged to submit levels and content. It teaches concepts like loops, variables, syntax, and conditional statements, all essential parts of computational thinking.codecombat.com


Screen Shot 2015-10-14 at 11.03.22 AMMake School offers courses and summer academies to teach coding and coordinates internships in high-tech companies. They also have free online tutorials to learn iOS video game design using Cocos2d. Use their browser-based (and slow) iPhone simulator, or download Xcode on your Mac.makeschool.com/home


Screen Shot 2015-10-14 at 10.46.08 AMPencil Code lets kids learn basic programming using CoffeeScript and Javascript, through both a block-based and text based interface. HTML and CSS are also supported in this robust and well-documented community that also features student project examples and lesson resources for Math, music, storytelling and more. pencilcode.net


Other suggestions

Code Monkey: freemium coding site for kids.
BitBox: promising site still in kickstarter mode.
Hello Processing: intro to Processing, where art and CS meet.


Where to start

The resources above are a great way to start learning about computational thinking and get familiar with the syntax of various languages. But a beginner may not necessarily know what language they should learn. Below is a breakdown of several popular languages, what they are used for, and where to learn more about them.

HTML: Hyper Text Markup Language is the language that makes web pages possible. Learn this language if you want to design websites. The latest and most powerful version is HTML5.

CSS: Cascading Style Sheets: Most websites today use CSS to style HTML content. If you are going to learn HTML, you will also need to learn CSS. They go hand in hand.

JavaScript: probably the the most ubiquitous computer language around that makes webpages and many apps “do” things. Learning JS will set you on your way to learning other similar languages.

Ruby: Ruby is easy for beginners to learn. It is rapidly becoming the language of choice for building web apps like Twitter. Kids learn here.

Swift: Apple’s new language for iOS and Mac OS apps that will eventually replace Objective-C. Swift is easy and elegant and works alongside C, and Objective-C. You will need a Mac. For teachers, Apple Education has released an iTunes U course on App development using Swift.

PHP: is a widely-used open source general-purpose scripting language for web development that can be embedded into HTML. It makes sites dynamic and works with databases.

Python: like Ruby, Python is easy to learn. It is concise and powerful and a great way to learn programming for beginners. Check out Google’s Python Course.

Java: do not confuse it with JavaScript. Learn Java if you want to make Android native apps.

JQuery: built on Javascript, JQuery, and JQuery Mobile is a framework for building web sites faster with all kinds of plug-ins.

C#:not the same as C or C++, it is the language to learn if you want to make Windows and Windows phone apps.

More learning and practicing resources

W3Schools is one of the most valuable resources for learning a variety of languages.

At Learn-JS you can learn Java, javascript, php and C#.

StackOverflow is a place you will get to know well when you get stuck and you google “how do I do x in y language”. The user forum to rule all user forums.

JS Fiddle:a playground to test your html, css and js code. Used by many to share solutions to problems.

CSS Deck:check out the amazing things you can do with CSS, HTML and JS. Make or copy projects, from games to simple UI, and use them in your own project.

Code Pen: an HTML, CSS, and JavaScript code editor in your browser with instant previews of the code you see and write. Student love to play with other people’s projects and see what makes websites pop and sizzle.

iTunes University: Apple makes several CS college courses available for free. Learn from the best at Stanford, Harvard, UC Berkeley and MIT.

iTunes University: Apple makes several CS college courses available for free. Learn from the best at Stanford, Harvard, UC Berkeley and MIT.

Editey: make and release real-life websites straight from your Google Drive. It is a great way to make websites from scratch and see the results immediately in your browser.

Sublime Text: you will need a robust text editor to write all your code. Sublime is as good as they get. It will complete your code for you in more languages that you will ever care to learn. Sublime Text is free if you don’t mind being reminded to eventually pay up every so often.


Have something to say?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s