Introduction: Wifi Raffle Button - Arduino

By My Github Account
About: Software Engineer. Studied Electronic and Computer Engineering in National University of Ireland, Galway

This instructions to create your very own wireless button for a raffle or for anything really. In this case Ii am going to show you how i created it for a raffle. This allowed me to pass the button around the audience so people in the room could activate the raffle spin.

Things you need to know:

  • Basic electronics
  • Basic javascript
  • Knowledge of NodeJs
  • Knowledge of Arduino.

Step 1: What You Need

There isn't a lot needed to create this and it is relatively inexpensive.

what you need:

  • 1 x Wemos D1 Mini (Available on Ali Express).
  • 1 x 4 pin push button
  • 1 x 100 ohm resistor
  • 1 x led (optional)
  • 1 x small power supply
  • 1 x USB to microUSB cable
  • 1 x computer
  • 1 x wifi network
  • some wire

Step 2: Install NodeJs and Arduino and Clone the Code

Download and Install NodeJs which will host the server your button will talk to and will serve up the web page.

Download and install the Arduino IDE

Now it is time to clone the repo containing my code.which is pretty basic. It can be found on Github.

Step 3: Building the Circuit

Using the supplies mentioned earlier we are going to build the circuit in the picture.

  1. Connect the positive(longer leg) of the led to pin D3 on the WeMos microcontroller board and the negative(shorter leg) to ground(GND).
  2. The push button configuration can be found here .
    • Connect one pin to the 100 ohm resistor which is then connected to ground
    • Connect the pin common to the resistor to the 5v output of the board
    • Finally connect one of the remaining pins on the button to D3 on the WeMos board
  3. Time to upload the code.

Step 4: Upload Code to the Board

Now we need to prepare your code to be uploaded to the board.

  1. In the Arudino IDE installed previously open the wifi-button.ino file.
  2. Modify the code to add your wifi networks name and password.
  3. In your computers command window run the following command 'ipconfig' which will print out your ip configuration. the value you need is the IPv4 Address.
  4. Add your I.P. address to the code.
  5. Connect your WeMos to the your computer and set the board type and port under tools.
  6. Compile and upload your code and now the board is ready to go.

Step 5: Prepare the Webpage

Now it is time you prepare the web page.

To do this wee need to have the raffle numbers, the names and the number of prizes.

In the members.js file add your list of people in the raffle and the max prizes so you don't accidentally pull an extra name.

Feel free to edit the code to suit your needs. Just edit the raffle.js file.The app just polls an endpoint to check if the button is hit.

Step 6: Running the Server

To run the server which will serve the webpage and which the webpage will poll and the button will communicate with it you will have to have NodeJs installed from the earlier step.

With node installed navigate to it in a command window and run 'npm install' followed by 'node app.js'

Your server is ready to go.

Step 7: Finishing the Product

In my project i put the led inside a round plastic button which i attached to the push button. I connected it to a portable battery and inserted it all inside a small coffee can.

You have a chance to play around with it and see you have a novel way to present it.

Best of Luck