loading

The Raspberry Pi is an amazing 35 dollars mini-computer. It allows you to do everything you could do with a regular Linux computer (Connecting to the internet, watching videos, launching applications, ...) but also to interact with the world surrounding it, just like an Arduino. That's why I qualify it as a mix between a computer and a micro-controller.
That's also why I chose it for this project. I'm going to show you how to control LEDs with your Raspberry Pi. Firstly directly from the Raspberry Pi itself, then from any device in your house like your Smartphone or your tablet.

Here is a very good example of what you can achieve after reading this Instructable: http://www.instructables.com/id/Web-Controlled-8-Channel-Powerstrip/. Thanks to Rleddington for his amazing project.

Update: French version here

Step 1: The electronic part

     The electronic part is nothing special, it's only 8 LEDs with their protecting resistor. The only hard part is to connect the LEDs to the good pin on the Raspberry Pi. Indeed, I'll be using later a library called Wiring Pi made by Gordon Henderson (You can visit his website at: http://wiringpi.com/) and the pin's numbers used in this library aren't the same than the ones on the Raspberry Pi. See this page for matches: http://wiringpi.com/pins/ (just be careful about your Raspberry Pi revision, the pinout isn't exactly the same). I'll be using Wiring pins 0 to 7.
     Concerning the resistors, they should be 270Ω but since I don't have this precise value, I'm using 560Ω resistors (LEDs are just less bright).
     Finally, I've made two schematics to make it simpler. The first one (with the complete Raspberry Pi) is showing you the real pins as they are shown on the board. The second one is a simplified version, it's showing you only the useful pins and their matches in the Wiring Pi library (GPIO Wiring number/Actual number on the board).
<p>Thanks for posting this. It provides an easy, fast way of exposing the pi to the user and interfacing with the gpios. I can think of so many applications!</p>
<p>This was fantastic!! I'm turning on a tea kettle remotely with this and it works like a charm. I am controlling two outlets with this so I edited the code down to two options, no need for loops in this case (but in the future....). My question is, and I think it was asked earlier: If you turn on the LED, then refresh the page, the page doesnt initially read the value of the Pin. </p><p>I have two relays I am controlling, if I turn them on, they show on in the browser, then I refresh browser, they show off on the browser but are still on. They will turn off if I click the button, and then the cycle is properly rest and the buttons turn on and off.</p><p>I am trying to write up a javascript read function that reads the status of the pins when the page loads...no luck in the last 15 minutes or so but unless someone else figures it out, I will post when I'm done! This isnt a serious issue, just would be nice to have. great instructable!! oh... I did it!!</p>
<p>quite a simple solution... :) I just told GPIO via php to set all status to zero as first line...this way, no way any outlet could be accidentally forgotten or left in an unknown but truly &quot;On&quot; state </p>
Yes, i had the same.problem. as i said both index.php and script.js have to be edited with the correct state (0 or 1) in order for it to work. Simple changing one file and not the other will result in the problem u are having. Coming from almost NO programming background, it was my projects Achilles heel u til it was solved.
<p>HEY!!!</p><p>One last quick question...</p><p>I am almost finished my enclosure! :)</p><p>I was wondering if it was possible to add a status led for when my relays are powered?</p><p>I am already using an 8CH relay with status LED's, but these will now be closed inside the case. I'd like to add LED's on the cover of the case, so I can see which relays are on without opening the cover...</p><p>Would I be correct to breakout the pin of the GPIO I wanted to control, and add an LED (with a corresponding resistor) like that??</p><p>I (tried) to draw what I'm trying to say in paint. You may want to grab some popcorn before viewing; it's quite entertaining... </p><p>Basically the RPi, pin for relay board, and led's anode would all connect in the same row, with the cathode and the relays &quot;-&quot; connecting in a row of its own on the protoboard. Any future LED's would be connected the same way.</p><p>IS THIS CORRECT? :S (thk u for your time)</p><p>I'll take some pics when everything is complete :)</p>
Hey!<br> <br> Here's a link for you about how you should connect your LED. The way you did it seems to be the good one&nbsp;<a href="http://forum.arduino.cc/index.php?topic=126629.0" rel="nofollow">http://forum.arduino.cc/index.php?topic=126629.0</a>&nbsp;(Although your drawing is as you said, entertaining... :p). Also, don't forget to connect the Rpi's GND to the relay board's GND.<br> Btw, try fritzing to draw your schematics, it's a very nice and free software.<br> <br> Why not publishing an 'Ible about your project later?<br> <br> Hope I helped,<br> TheFreeElectron
<p>Fritzing is like my long lost friend thk u!!!!!</p><p>I've decided to incorporate 555 timers to make the external status LED's blink when the circuits are closed.</p><p>I've gotten everything tested, just waiting for my parts to come in from China (a 555 timer locally is something like $5, I got 10 from China for under $2) to complete everything (finally).</p><p>Once finished I will post back with the completed project. </p><p>I never thought of making an 'ible but it's a great idea!!!! I've always wanted to contribute some way and it seems like a good place to start!</p><p>Thanks a million again!!! :D:D</p>
<p>What's that twisted blue wire connected to the RPi? I have an RPi 2 so the layout is different, but from looking at diagrams of the model B, I don't see anything that would plug in where it looks like that wire is connected.</p>
They go to header P6 which is the RESET. I installed a header riser so i could easily connect wires to it in the future. The only problem ive had is that the web server sometimes (rarely though) crashes, in which i need to pull the power to reboot. The reset button not only offers a more convinient way to reset the pi, but also helps prevent data corruption by allowing you to NOT cut power to the Pi. Data corruption can occur when power to the Pi is cut while trying to write to the SD.
<p>No problem, it was a pleasure to help!<br>Now, enjoy your own project. As I said, my 'Ible is like a tool and it's up to you to make something with it. In your case, you did it in a clean and very useful way. Congrats! ;)</p><p>TheFreeElectron</p>
<p>No problem, it was a pleasure to help!<br>Now, enjoy your own project. As I said, my 'Ible is like a tool and it's up to you to make something with it. In your case, you did it in a clean and very useful way. Congrats! ;)</p><p>TheFreeElectron</p>
<p>Perfect guide that helped me with some things I didn&acute;t get to work with one of my Pi-project. I don&acute;t have so much PHP knowledge so I have one question: Is it possible to get the status to update if the GPIO value changes from another script? Of course I can set auto update on the page but it will &quot;flash&quot; every time it updates... </p>
Hi,<br>In your case, a good and easy solution is to create a kind of JavaScript routine calling a function every x seconds. That function would simply ask the server for the pin's status and update the page in function of the response. No &quot;flash&quot;.<br>The only problem is that you have to create the JS routine (google is you best friend I would say), the JS function called by the routine and waiting for the response, and the PHP function reading and printing the pin's status. Fortunately, these functions are very similar to the one used in the code so you shouldn't have much problem writing them.<br><br>Hope I helped,<br>TheFreeElectron
<p>hello, thanks for the tutorial</p><p>i have a problem with change the pict, the pict can't show why i change the pict. i have already change the name of pict with same than your code. but the pict what i want don't show. can you help me for fix the problem ?</p><p>the function of controll work perfect, but the pict won't show correct</p>
<p>Hello,</p><p>Maybe you forgot to update the access rights of the pic? If you didn't, Apache cannot use and display these pictures.</p><p>Hope I helped,<br>TheFreeElectron</p>
thanks for reply me.<br><br>i found the problem, the problem is i forgot change the permission pict. <br><br>when i change the permission, the pict change correctly :D
hi <br>does it works on raspberrry pi 2 ?
You may need to make some minor changes but I think yes.
<p>Dude, its amazing. I will try it soon and click &quot;I Made it!&quot; button. Wish Me LUck :)</p>
Thank you TheFreeElectron for the tutorial!<br><br>How can I control LEDs that are connected on different raspberry pi devices (on same or different networks) from the same web page?
And can a nonexpert do it?
<p>Hey I wanted to do something like home automation, for my room specifically, like you did here but also want to stream video from my Pi cam (or webcam) side-by-side of my room to seen in actual when I turn on a light does it actually lit up. Any idea how to integrate a web stream of my pi cam (or webcam) into your program?</p><p>Thanks</p>
<p>I have no idea how to do this with solely the RPi, but I have an ip camera that i look at to see if my kids have left the tv on, at which I can shut it off. I can view the cameras from any mobile device or pc so it is very easy for everything to work in harmony.</p><p>Also this way you can have WAY more cameras, and you aren't limited by the length of USB wire.</p><p>I have cameras on every level so I can see if the tv is on, if the lights were left on, etc..</p><p>Have had it set up like this since around december with NO problems whatsoever.</p>
Hi!<br><br>Sounds like an amazing idea! Streaming a webcam isn't something very easy to do by yourself so you are very likely to find and use a software. This soft (installed on the Rpi) will get the video stream from the Pi cam, then broadcast it with its own server. To integrate this stream into your project, you would just add a video object to index.php with as address, the address and port of the webcam server. Try to google your project, with all the applications the Rpi has, someone has probably already done the search and work for you.<br><br>Hope I helped,<br>TheFreeElectron
<p>This is a realy good and easy way to stream your camera. http://elinux.org/RPi-Cam-Web-Interface</p>
<p>This is a cracking Instructable, and I can see me using it for much more than I am at present.</p><p>I have a couple of SkyHD boxes that (typically) crash from time to time, and Sky's solution is to pull the power cord. When the boxes are mounted in a busy rack, this isn't quite so easy.</p><p>I have made some changes, including paring the UI down to 2 circuits and adding a little text here and there so my other half can understand it, as well as using my own images.</p><p>All I need to do now is mount it in a neat enclosure.</p><p>Good work TheFreeElectron!!</p>
<p>Very nice! I see there a very practical and useful application! With, by the way, a nice and clean interface.<br>Good work to you too!</p>
How to access blocked websites in colleges or schools<p><a href="http://www.besthacktricks.com/how-to-access-blocked-websites-in-colleges-or-schools/" rel="nofollow">http://www.besthacktricks.com/how-to-access-blocke...</a></p><p>Grab all the tricks and tips on latest android phones,apps,iphones and latest technews at www.besthacktricks.com...visit now!</p>
Best Tips to Build a Great and User Friendly Website<p><a href="http://www.besthacktricks.com/best-tips-to-build-a-great-and-user-friendly-website/" rel="nofollow">http://www.besthacktricks.com/best-tips-to-build-a...</a></p><p>Grab all the tricks and tips on latest android phones,apps,iphones and latest technews at www.besthacktricks.com...visit now!</p>
<p>How would you go about creating an all button for these versus the individual buttons or in addition to the already configured buttons?</p>
You can do it either in the Javascript: Add a button then attach it to a function calling change pin for all leds. Or in the PHP: add a eighth button, when the PHP receives change pin's request for this button, it turns everything on or off.
<p>I understand the layout of doing it, just not super familiar with the structure for coding the all button</p>
<p>I'm sorry but I don't have the time to write a sample code. Inspire from the current project, add a button and use one the two solutions described in my previous comment.</p>
<p>Thank you to share</p><p>Is possible do for 200 LEDs ? what i need do ?</p><p>thank you in advance</p>
Hey!<br><br>Well 200 LEDs is quite a big number and since the Rpi doesn't have 200 GPIO ports, you'll have to use some external components to control all these LEDS. One of the most common solution is to use a chip called a shift register, like the 74HC595 which can control 8 LEDs with only 3 Rpi ports. Also you can stack these chips one after the other to control even more LEDs with these same 3 ports (there is however a limit). I let you google the previous terms.<br>There are many other chips but the choice is depending on what you want to do these LEDs.<br>Finally, be aware that my code is not well adapted for high speed changes and operations, you might need to change several parts of the projects depending on your objective.<br><br>Hope I Helped,<br>TheFreeElectron
<p>I am looking to expand to 36 with two mcp23017 but I am a bit stumped. Any ideas on where to start with that?</p>
<p>Take a look at these, your chip is using I2C which should be supported by Wiring Pi:</p><p><a href="https://learn.adafruit.com/mcp230xx-gpio-expander-on-the-raspberry-pi/overview" rel="nofollow">https://learn.adafruit.com/mcp230xx-gpio-expander-...</a></p><p><a href="http://www.raspberrypi-spy.co.uk/2013/07/how-to-use-a-mcp23017-i2c-port-expander-with-the-raspberry-pi-part-1/" rel="nofollow">http://www.raspberrypi-spy.co.uk/2013/07/how-to-us...</a></p>
<p>Thanks! I have already ordered some of these chips to try out. I don't have a large exposure to java, so getting that aspect to work has me a little concerned. </p>
<p>I understand but there's nothing to really worry about. Take a look at the wiring Pi library's reference. You should find everything you need to use I2C and your chips. Enjoy! ;)</p>
<p>pretty good the project is quite straight forward although my gpio write 0 1 and gpio write 0 0 are interchanged i though i had wired badly but i checked my all my pins when in write 0 the lights turn on when i write 1 the lights come on ? any ideas why </p>
I've heard about that issue several times. I have no idea about what may cause it. The code perfectly worked on my Rpi 1. Maybe the Pi 2 is in cause?
<p>I just wanted to say THANK YOU. This project is above-awesome, and I've had the &quot;PowerPi&quot; built for around a week. The instructions given worked flawlessly. I made this to help control my tv's / monitors / lights to help keep the hydro cost down. </p><p>The only problem I had was one that was stated in the comments, where the incorrect image was displayed ( all pins set HIGH instead of LOW).</p><p>I found, through trial and error (and hair pulling, I honestly had to look up everything, I have minimal programming background... If I didn't have google I'd be lost) that index.php AND script.js had to be changed in order to get the correct pictures. Initially I had only changed one of them (can't remember which one). I'm not sure why, but everything was working great, then all of a sudden the images wouldn't refresh. I've been looking at the scripts since last night and it was not 5 minutes ago that I came across this. Yes, everything is up and running with 3 / 7 relays populated so far.</p><p>I'm cutting out a Brinks metal case to house everything. There's already mounting holes and a keylock so it should add some nice finishing touches.</p><p>I'm looking forward to more instructables from you! I have fun trying to understand your scripts since you make them easy to understand.</p><p>Keep it up!!!! :D</p>
Thank you for the cheering!<br>The best reward is to see what you can do with my 'Ible. Home automation is a rising domain where applications are nearly boundless. Doing it yourself is just amazing. Btw, your project looks really nice and, that is to say, very clean ;)<br>You are not the first one having trouble with &quot;reversed&quot; relays. Adding a 'reverse' option to my script would be nice. However, my studies are very time consuming. I hope next year will give me more time to create and share. :)<br><br>keep it up too :) <br>TheFreeElecton
<p>Hi, I really like your tutorial. I just had one question. I didn't personally get to test this, but I'm assuming because this is written in PHP, that everytime you click a button, it will redirect the page in order to run the GPIO code. Is there a way to execute GPIO code without reloading the page?</p>
Hi!<br>Thank you!<br>Actually, I used JavaScript so that it doesn't need to reload the page. PHP is used to execute the linux commands and is indeed executed once, but that is what we want.<br>Everytime you click a button, JS asks for the PHP page. This page will execute gpio commands and print the updated pin's status. The JS receives this as a response and then updates the page you're on, without reloading.<br><br>Hope I helped,<br>TheFreeElectron
<p>I see that now, looking through the code. However, I want my Pi to be controlling PWM pins, and that means the pins will not be binary, they will be between 0 and 255 (I believe). Is there any way to store this other than a database? Or this that my only option?</p><p>Sorry for bugging you so much,</p><p>Ankur</p>
<p>The PWM option is explained in the wiring pi's reference. You should find everything you need there. Among which the value's range.</p><p>I see two options to store data:<br>*Use a database, but it is relatively slow and long to implement.<br>*Use a file, it is very easy to implement and doesn't require an external SQL server. I would prefer this option and already used it in a previous project.</p><p>Hope I helped,<br>TheFreeElectron</p>
<p>I'm thinking of using the pigpio library, and I realized that can read the individual states from the pins, so I won't actually need to store it!</p><p>Thanks,</p><p>Ankur</p>
<p>First I want to say, Thanks for this awesome project. I have been struggling to web control my relay board and thanks to you it works!</p><p>but I have a small problem:</p><p>If i view the site it doesn't show the button pictures, and html says: &quot;GET <a href="http://192.168.1.29/data/img/green/green_0.jpg" rel="nofollow"> http://192.168.1.29/data/img/green/green_0.jpg </a> 403 (Forbidden)&quot;.<br>The site works, but with the pictures it would look way more awesome.</p><p>Can you help me?</p><p>Thanks in advance!</p>
Hi!<br><br>It seems to be an &quot;access rights&quot; issue. Are you sure you allowed apache to access the &quot;var/www&quot; directory AND its subdirectories? There is a recursive flag for the command. Also, you can easily check who's owning a file/folder by typing &quot;ls -l&quot; in the terminal.<br><br>Hope I helped,<br>TheFreeEletron

About This Instructable