Web controlled robot
Web controlled robot
2014-03-25 12:44:00
Web controlled robot

I ‘ve always been a great fan of robotics and I always wanted to build my own robot someday. This article explains how I created my first web browser controlled robot using Arduino and Raspberry Pi back in 2014!

The complexity of the project and the wide knowledge of things I needed in order to succeed, sounded a bit to much for a junior developer like my old self.

One day I decided to try with what I had and started searching online for some open source hardware that I can program. I was surprised when i discovered Arduino and Raspberry Pi. I was surprised not only from their great combined capabilities but also from their huge and passionate community which makes it much easier and fun to work with. In this article i will share with you some basic and all around considerations / keypoints on how i built my first fully operational wireless robot.

The initial idea was to build a robot that will stay at home and can be controlled from any computer, in or out of the home network through the web. The website will be hosted in a web server of the Raspberry Pi which will process the request and give the appropriate commands to Arduino. With arduino we can easily control analog sensors and motors to bring the robot to life. So for the robot to be wireless we need to include raspberry on the chassis apart from arduino. This way our robot will communicate with the home router through a WiFi dongle. A simple command flow of the system is the following:

To break down things we need to configure 4 things:

  • Arduino
  • Raspberry
  • Circuit
  • Router


Arduino will be the main controller for all of our sensors and motors. It will receive the messages we give from Raspberry, and act accordingly. So we need to come up with an efficient protocol for serial communication. In my case I used the convention “command:value”. The first part states the action we want to make and the value the action’s value. For instance I ll send the command “2:100” if i want the robot to start moving forward with motor speed 100 or “3:250” if i want it to turn right with speed 250 and so on.

After you initialize the serial bus with a logical baud rate inside the loop you can put this code:

C++ Arduino IDE code

The first piece of code is triggering the ultrasonic transciever and calculating the distance from any obstacle in front of the robot measured in centimeters.

What the second piece does is reading the input from the serial port, devides it in 2 pieces according to the position of “:”. Depending on what function we stated in the input the if else statement will execute the appopriate command setting the sensors to the value we stated.

After you connect some motors, servos or any other sensors you want you are good to go. Having built the Serial library means we can test the commands from the Arduino software directly. So you should definitely make sure everything works great before proceeding any further.

Raspberry Pi

Raspberry will be the main brain of the system communicating with the webserver, router and arduino. Here we ll need to install and configure a lot of stuff like:

  • An Operating System (I recommend Raspbian)
  • A WiFi dongle
  • Python
  • Install the GPIO (optional if you want to use the onboard pins)
  • Enable SSH (after you assemble the chassis it will be much easier to work remotely on linux via ssh)
  • Configure a local network static IP
  • Install a Dynamic DNS client (i strongly suggest no­ip)
  • Create and configure a startup script for the operating system (here you ll call all of the services you need to automatically start on boot)
  • Install Apache server and PHP and configure it
  • Set up MySql (optional)
  • Install FTP server
  • Build an Arduino Input Library
  • Configure cgi­bin and add .htaccess

After these configurations are done we need to implement the webserver functionality and the output library. The last one will be responsible of translating the users interaction into valid commands of Arduino ‘s library that we previously built.

Web Server

A simple implementation would be to create an html page with 4 sliders. Each one of them will correspond to one “action” and its value will stand for the action’s value. Forward,Backward,Left and Right. On change value of any of them we will call a python file in the cgi­bin using JQuery Ajax call.

The code looks like this:

For my robot’s web interface I added:

  • An iframe, to display the live stream from the onboard camera
  • Lock / Unlock functionality of the sliders for certain amount of time so as to prevent overload in the communication bus.
  • Also, on the bottom of the interface, I added a small textfield to display the ongoing message to Arduino that is returned by Ajax on every command.

The simplified interface looked like this:

Library to Arduino

After a user changes the value of a slider, a Python file will be called in cgi­bin. We also pass the data of the slider through the ajax call. Inside the Python file we should translate this information according to our robots library. For example:

Here after we state how we want to interpret our script, we state the usb port and baud rate that our arduino is using. There are a lot of ways to trace where is your device connected in the linux environment like “dmesg”.


This will always depend on what sensors and generally components you want to include to your project. The things you ll need for sure are motors. I used 2 simple DC motors tied up to a motor controller that can provide me current flow change. You ll also need a power supply. This topic is really important as it can easily burn both Arduino and Raspberry. I used 6 AA batteries in series directly to my motors and through a voltage regulation transistor to Raspberry. This voltage will be enough to supply all of my components for several hours. Arduino is powered up through the serial port from Raspberry so it doesn’t require any more power supply.

An important keypoint is that python closes the serial each time a command is given making Arduino to restart. A fast hack for this is providing a 220μF electrolytic capacitor between GND and restart.That will make the trick but you will be unable to upload any more code to Arduino.


By now we have a fully operational robot locally. Raspberry has a static IP each time we power it up and our Dynamic DNS client is giving each time a specific domain name to our dynamic public IP. If we navigate with our web browser to our domain name though we can’t reach our user interface. The process stops in our router. That is because our router’s port is not assigned to any device’s port. This process is called port forwarding and it is essential. Access your router’s panel and create a rule from whatever port you like, to the port specified in your apache’s configuration file.

The Result

The final result for me was a web browser controlled robot that:

  • Has the ability to move forwards, backwards, turn left and right
  • UltraSonic sensors stop it before it hits any object
  • A web camera mounted onboard, serves live stream to the user interface
  • 2 micro servos (9g) rotate the UltraSonic sensors and the Camera

Final Considerations

The whole process is a race to synchronize everything and work perfectly with each other. From synchronizing serial bus ports with Baud rates to counting overheating on your voltage regulation transistor. The trickiest parts though are the ones that have to do with linux and networking. You may end up spending hours troubleshooting file permissions or asking yourself what is wrong with your port forwarding. These are the parts that, in my opinion, need some extra caution in the whole process.

In the end you are definitely going to enjoy your web browser controlled robot built with Arduino and Raspberry!

Some things you might find useful:

  • If you don’t need to measure your robot’s exact movement then, DC motors is the best solution for you.
  • You can adjust servos to work as motors, rotating continiously.
  • UltraSonic sensors is a great toy for you and a great tool for your robot!
  • If your project requires camera feed then Motionis a great spycam library to supply you with the appropriate tools in linux. You may spend some time configuring it but it definitely worths it.
  • You may want to use a less crowded channel of wifi using a wifi analyzer tool.
  • There is a great biodegradable polyester material called InstaMorph ;­)

Other posts

WordPress CI / CD in Kubernetes using Flux

WordPress CI / CD in Kubernetes using Flux

Integrating WordPress in a Kubernetes Flux CI/CD pipeline.
Kubernetes Cluster & CI/CD made easy

Kubernetes Cluster & CI/CD made easy

We created ESM, a project that creates production ready Kubernetes clusters with built-in CI/CD, TLS issuance, monitoring and more in…
Our go-to Frontend stack

Our go-to Frontend stack

The most efficient and modern frontend technologies to work with.