{"id":494,"date":"2020-06-04T16:10:51","date_gmt":"2020-06-04T16:10:51","guid":{"rendered":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/?page_id=494"},"modified":"2026-03-24T12:21:22","modified_gmt":"2026-03-24T16:21:22","slug":"programming","status":"publish","type":"page","link":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/programming\/","title":{"rendered":"Programming"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Introduction<\/h2>\n\n\n\n<p><em>If you&#8217;re looking for project ideas, please check our <strong><a href=\"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/workshops\/\" data-type=\"link\" data-id=\"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/workshops\/\">Workshops<\/a><\/strong>!<\/em><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">Programming is everywhere! It is in our websites, our apps and programs we use, and even the operating systems our machines run on! But what is programming exactly?<\/span><\/p>\n\n\n\n<p><i><span style=\"font-weight: 400\">Programming<\/span><\/i><span style=\"font-weight: 400\"> is a language for computers, it is a set of phrases and syntaxes and rules put together to give an instruction on how a computer\/program operates. Like instructions on how to do quite literally, <\/span><i><span style=\"font-weight: 400\">everything<\/span><\/i><span style=\"font-weight: 400\">! And like the many languages we have here on the planet, <a href=\"https:\/\/en.wikipedia.org\/wiki\/List_of_programming_languages\"><em><strong>there is a myriad of programming languages<\/strong><\/em><\/a> used for many different purposes.<\/span><span style=\"font-weight: 400\">&nbsp;<\/span><\/p>\n\n\n\n<p><strong>JUMP TO: <a href=\"#history\" data-type=\"internal\" data-id=\"#history\">History |<\/a> <a href=\"#makerspace\" data-type=\"internal\" data-id=\"#makerspace\">Programming in the Makerspace <\/a>| <a href=\"#start\" data-type=\"internal\" data-id=\"#start\">Where do I Start?<\/a> | <a href=\"#exploration\">Further Exploration<\/a><\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"history\">History<\/h2>\n\n\n\n<p><span style=\"font-weight: 400\">The earliest known \u201cautomation\u201d can be traced back to Hero of Alexandria, a mathematician who invested a rudimentary vending machine for temples to disperse water, as well as some automatons. Many of these were simple and more analog, powered by gears and pulleys and using physics rather than computational logic.<\/span> (The Greeks were the first on record to study pneumatics!)<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.neatorama.com\/wp-content\/uploads\/2010\/11\/5202398554_4a584341b8.jpg\" alt=\"\" \/><\/figure>\n<\/div>\n\n\n<p><small>An illustration of one of Hero&#8217;s vending machines by&nbsp;Bennet Woodcroft from his book, <em>The Pneumatics of Hero of Alexandria<\/em>, now in Public Domain.<\/small><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">Automatons have been made in the centuries following, mostly made as entertainment for those who could afford it, curiosities rather than practical devices, <strong><a href=\"https:\/\/gizmodo.com\/this-450-year-old-clockwork-monk-is-fully-operational-5956937\" data-type=\"link\" data-id=\"https:\/\/gizmodo.com\/this-450-year-old-clockwork-monk-is-fully-operational-5956937\">like t<\/a><\/strong><\/span><a href=\"https:\/\/gizmodo.com\/this-450-year-old-clockwork-monk-is-fully-operational-5956937\" data-type=\"link\" data-id=\"https:\/\/gizmodo.com\/this-450-year-old-clockwork-monk-is-fully-operational-5956937\"><strong>his automaton monk<\/strong><\/a>&nbsp;(built by a watch maker) was made in&nbsp;<em>1560<\/em>! And <a href=\"https:\/\/youtu.be\/nITEU4fsqCU\"><strong>this Dulcimer player<\/strong><\/a> (made in&nbsp;1784 for Marie Antoinette) can play 8 different songs! Or one of the most famous automatons, The Silver Swan, was made in 1773.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"The Silver Swan at The Bowes Museum\" width=\"840\" height=\"473\" src=\"https:\/\/www.youtube.com\/embed\/e0LMe5pi7ME?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>(Here&#8217;s some more videos from <strong><a href=\"https:\/\/www.youtube.com\/watch?v=puTLCaCv__w\" data-type=\"link\" data-id=\"https:\/\/www.youtube.com\/watch?v=puTLCaCv__w\">History Channel<\/a><\/strong> and <strong><a href=\"https:\/\/www.youtube.com\/watch?v=6Nt7xLAfEPs\" data-type=\"link\" data-id=\"https:\/\/www.youtube.com\/watch?v=6Nt7xLAfEPs\">Timeline<\/a><\/strong> on Automata.)<\/p>\n\n\n\n<p><span style=\"font-weight: 400\">But by the first true computational device wasn\u2019t developed until the early 1800s.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">The earliest code was what we call <\/span><i><span style=\"font-weight: 400\">binary code<\/span><\/i><span style=\"font-weight: 400\">. <a href=\"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/pcomp\"><em><strong>We covered that a bit in the our Physical Computing page<\/strong><\/em><\/a><\/span><span style=\"font-weight: 400\">, the quick overview is that there are two states: <\/span><b><i>on<\/i><\/b><span style=\"font-weight: 400\"> and <\/span><b><i>off<\/i><\/b><span style=\"font-weight: 400\">. This was first expressed in the patterns of weaving <a href=\"https:\/\/www.youtube.com\/watch?v=K6NgMNvK52A\"><strong>in Jacquard looms<\/strong><\/a>, or <a href=\"https:\/\/www.youtube.com\/watch?v=VlfCz3deugo\"><strong>the comb of a music box to create music<\/strong><\/a>.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">In the past, \u201ccomputers\u201d were people who parsed data and filled it out on paper by hand. Many of them were women, like <a href=\"https:\/\/en.wikipedia.org\/wiki\/Harvard_Computers\"><strong>The Harvard Computers<\/strong><\/a><\/span><span style=\"font-weight: 400\">, women whose data helped us classify extrasolar stars! <strong><a href=\"https:\/\/en.wikipedia.org\/wiki\/Charles_Babbage\">Charles Babbage<\/a><\/strong>, a mathematician sought to help automate the process. Inspired by Jacquard looms, he developed the first computation devices that could take data given and create an output following a set rules and logic. This <em>Analytical Machine <\/em>was improved with the work of&nbsp;<a href=\"https:\/\/en.wikipedia.org\/wiki\/Ada_Lovelace\"><strong>Lady Ada Lovelace<\/strong><\/a> that created the first instance of programming that we know. While his machines were never built due to lack of funding, his research was sound and brought us the first steps towards computers. His&nbsp;<em><a href=\"https:\/\/youtu.be\/KBuJqUfO4-w\"><strong>Difference Engine<\/strong><\/a><\/em>&nbsp;was recreated in the 1990s.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"makerspace\">Programming in the Makerspace<\/h2>\n\n\n\n<p><span style=\"font-weight: 400\">Nowadays we\u2019ve gone far past binary, and each language has a set syntax and follows a particular logic. Once you\u2019ve learned at least&nbsp; two languages, it is said it gets easier to learn more.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">Here in the Makerspace, we do a small bit of programming! CSS and HTML are visual languages that build websites (Javascript too, but it also can do more than sites!). More frequently you\u2019ll use programming with the Arduino (which is C++), and sometimes Processing and p5.js for visual designs. There are many books on the subject (<strong><a href=\"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/bibliography\/\">some covered in our Bibliography page<\/a><\/strong>)<\/span><span style=\"font-weight: 400\">&nbsp;and many have reference websites listing all the syntaxes and functions allowed in the language. But really, programming is something you just need to <\/span><i><span style=\"font-weight: 400\">do<\/span><\/i><span style=\"font-weight: 400\">.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"start\">Where Do I Start?<\/h2>\n\n\n\n<p><span style=\"font-weight: 400\">First you\u2019re going to need some application to write or edit your code which is called an IDE. <\/span><span style=\"font-weight: 400\">An <\/span><i><span style=\"font-weight: 400\">IDE<\/span><\/i><span style=\"font-weight: 400\">, or <\/span><i><span style=\"font-weight: 400\">integrated development environment<\/span><\/i><span style=\"font-weight: 400\">, is a software application that allows you to write code and test that code out in the programming language the IDE supports.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400\">Some languages provide their own, like <a href=\"https:\/\/processing.org\/\"><strong>Processing<\/strong><\/a><\/span><span style=\"font-weight: 400\">, <a href=\"https:\/\/editor.p5js.org\/\"><strong>p5.js<\/strong><\/a><\/span><span style=\"font-weight: 400\">, and <strong><a href=\"https:\/\/www.arduino.cc\/en\/Main\/Software\">Arduino<\/a><\/strong><\/span><span style=\"font-weight: 400\">, but others you can use a general IDE such as <a href=\"https:\/\/atom.io\/\"><strong>Atom<\/strong><\/a><\/span><span style=\"font-weight: 400\">, <a href=\"http:\/\/brackets.io\/\"><strong>Brackets<\/strong><\/a><\/span><span style=\"font-weight: 400\">, or <a href=\"https:\/\/www.sublimetext.com\/\"><strong>Sublime <\/strong><\/a>or<a href=\"https:\/\/code.visualstudio.com\/\"><strong> Visual Studio<\/strong><\/a><\/span><span style=\"font-weight: 400\">. Adobe Dreamweaver is an IDE focused on Web Design. You can also just use a basic text editor such as Notepad (Windows) or TextEdit (Mac) too, though the other IDEs can help organize and troubleshoot errors with a built in console.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"exploration\">Further Exploration<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong><a href=\"https:\/\/learnprogramming.online\/\">Learn Programming:<\/a><\/strong>A Basic Walkthrough on Programming; geared to prepare for Javascript (Free)<\/li>\n\n\n\n<li><a href=\"https:\/\/dash.generalassemb.ly\/\"><strong>Dash:<\/strong><\/a> HTML, CSS, and some javascript (Free)<\/li>\n\n\n\n<li><span style=\"font-weight: 400\"><strong><a href=\"https:\/\/www.khanacademy.org\/computing\/computer-programming\">Khan Academy:<\/a><\/strong> HTML, CSS, Javascript (Free)<\/span><\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.freecodecamp.org\/learn\">freeCodeCamp: <\/a><\/strong>Various programming languages (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.w3schools.com\/\">W3 Schools: <\/a><\/strong>Various programming languages (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/thecodingtrain.com\/\">Coding Train:<\/a><\/strong>P5 and Processing (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/processing.org\/\">Processing.org:<\/a><\/strong> Processing (Free)<\/li>\n\n\n\n<li><a href=\"http:\/\/learningprocessing.com\/videos\/\"><strong>Learning Processing:&nbsp;<\/strong><\/a><span style=\"font-weight: 400\">&nbsp;This is the site that accompanies Daniel Shiffman\u2019s book, but can be used as a reference.<\/span><\/li>\n\n\n\n<li><strong><a href=\"https:\/\/funprogramming.org\/\">Fun Programming:<\/a><\/strong>Processing (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/p5js.org\/\">p5js.org:<\/a><\/strong>p5.js (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.learn-js.org\/\">learn-js:<\/a><\/strong>Javascript (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/learnjavascript.online\/\">Learn Javascript Online:<\/a><\/strong>Javascript (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.learnpython.org\/\">Learn Python:<\/a><\/strong>Python (Free)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.codecademy.com\/\">Code Academy: <\/a><\/strong>Various programming languages (Free &amp; Paid Courses)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.udemy.com\/\">Udemy: <\/a><\/strong>Various programming languages (Free &amp; Paid Courses)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/www.coursera.org\/\">Coursera: <\/a><\/strong>Various programming languages (Free &amp; Paid Courses) (Formal Class Structure)<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/stackoverflow.com\/\">Stack Overflow:<\/a><\/strong>Great reference to learn and troubleshoot with other programmers!<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Introduction If you&#8217;re looking for project ideas, please check our Workshops! Programming is everywhere! It is in our websites, our apps and programs we use, and even the operating systems our machines run on! But what is programming exactly? Programming is a language for computers, it is a set of phrases and syntaxes and rules &hellip; <a href=\"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/programming\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Programming&#8221;<\/span><\/a><\/p>\n","protected":false},"author":184,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"portfolio_post_id":0,"portfolio_citation":"","portfolio_annotation":"","openlab_post_visibility":"","footnotes":""},"class_list":["post-494","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/pages\/494","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/users\/184"}],"replies":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/comments?post=494"}],"version-history":[{"count":13,"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/pages\/494\/revisions"}],"predecessor-version":[{"id":3445,"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/pages\/494\/revisions\/3445"}],"wp:attachment":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/makerspace\/wp-json\/wp\/v2\/media?parent=494"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}