Designing an open-source Community Award

I had the pleasure to announce the Vaadin Community Award during Vaadin Dev Day Spring 2021. This award is a way to recognize members of the Vaadin Community who actively participate and help others through forums, social media, events, code, and more. The Vaadin Community has been growing rapidly over the past years and more and more individuals have become extremely active online and in conferences. In the Community Team at Vaadin, we figured it only makes sense to officially reward those who constantly help developers and decided to create that Vaadin Community Award (VCA).

I lead the effort by looking into other similar programs in the software industry. Companies such as Google, Oracle, Red Hat, Microsoft, and others have multiple programs to recognize the efforts of their community members. From ways to select the winners and promote the program to the program's name, we quickly made adjustments from the initial idea using the findings from others. For example, initially, we proposed the name Most Valuable Professional. However, the acronym didn't play well for a company that produces web frameworks—MVP is easily understood as Model View Presenter by web developers, or even worst, as Minimum Viable Product! From there, we proposed alternatives and selected the name Vaadin Community Award.

A brief description of what the program intends to achieve is always useful. So I wrote one that describes the essence of the program:

The Vaadin Community Award (VCA) is a program that recognizes community members with an exceptional track record on community participation. The VCA is given to members that actively lead online and local Vaadin communities, speak at conferences or Java User Groups, create and maintain Vaadin Directory add-ons, publish articles and videos, engage in social media, Discord, and Stack Overflow discussions, and in general, passionately help other members of the community.

This helps the team and the community understand what the program is about concretely. It helps to give examples of things that community members should do to win the award. I left the benefits out since this is better explained with bullet points, and it shouldn't be (and it usually is not) the main motivator for members to be actively engaged in the community. Often, the driving factor is to get recognition and experience to show that they are proficient or have the passion for working on technical projects or communities around open-source software.

Coming up with a set of benefits is important nevertheless. From officially receiving the recognition to getting tangible prizes, a good set of benefits have the potential to keep the winners engaged in the community and inspire others to join the selected group. At first, the idea was to give a certificate that the winners can download plus extra powers in the Vaadin Discord server (chat). This combination works well as it officially recognizes the title and gives more tools to the winner to continue to help the community. We later added a physical recognition token that we would send to the winners, like a trophy that they can put in their homes to remind them how valuable they are to the Vaadin Community. We also decided to create a web page with information about the program and a list of winners to boost the recognition part. I proposed to give them a one-year subscription to the Pro offer of Vaadin for free—if someone has been helping the community to the point of earning this award, they should definitively have all the tools Vaadin develops in their belt. And to complete the package, we added the possibility to be interviewed for the Community Spotlight series.

Another aspect to consider when designing a community award is how to select the winners. Who nominates members, and who picks the winners? How many of them and for how long do they retain the title? For the VCA program, we decided that previous winners should nominate new candidates and the whole community select the winners through voting. By doing this, Vaadin yields control of the program to the community. We also decided to give the award for a period of one year, allowing winners to be nominated and win the award in subsequent years. The goal is to encourage previous winners to continue to work for the community. When the program starts, there are no winners yet, so we decided to select the initial ones internally at Vaadin to get a good starting team.

In summary, come up with a good name and description, select a good set of benefits, and come up with a good way to select the winners avoiding situations like "you have to do this specific thing to win." Let the community participate in the process as much as possible.

Read More

How to participate in and contribute to open source projects

I like to think about open-source involvement in terms of levels. Although no level is more important than the other, they build up on top of each other and take you through a good path to become a key member of an open-source community. In short, the levels are:

1. Observer
2. Member
3. Contributor
4. Committer
5. Maintainer

Become a user of the product

The best way to get inspired and start contributing to an open-source project is by using it. It's a natural first step. You'll learn about the vocabulary around the product, its strengths, and its weaknesses from a user perspective. Your interest in improving the product will increase alongside your motivation to contribute back to the community.

This level makes you an observer.

Join the community

Once you become a regular user of the software, you'll feel comfortable using the software and talking about it. You'll learn where to find help and how others use the software. You'll visit community forums and start asking questions. Eventually, you'll also answer questions. You are participating in the open-source community at this point. Forums are not the only way to participate in the community. You can present the software to others, talk about it, and promote it with your peers. The critical part here is that you interact with others who are or might be interested in the software.

This level makes you a community member.

Report bugs, issues, and improvements

Once you become a regular user, you can start reporting defects (bugs, issues) to the maintainers. Open-source projects typically have online tools for this. For example, if the project is hosted on GitHub, you'll most likely find an issues tab. Be considerate, and check if the bug has already been reported. If that's the case, see if you have new information useful to the maintainers. If not, open a new case and provide valuable information on the issue. If they have any, follow the guidelines of the project to report issues. Make sure you use formatting tools (especially for logs or source code when applicable) and attach relevant screenshots if they are relevant. Suggest improvements on issues but also as new ideas.

This level makes you a contributor.

Send source code contributions

If you are a software developer, this is the level you are most interested in. Your path towards contributing code can start with simple patches, add-ons, or documentation. They are frequently managed in the same way—through source code version control systems such as Git. Look for contribution guides in the project website, download the source code, and set up a development environment. Some projects are massive in terms of the number of lines of code, so be prepared to spend some time getting familiar with the big picture and focus on building and running the project. I guarantee you that seeing the software running from your very own built is a highly satisfying and motivating experience. Experiment by changing the code and seeing the results. Jump to the project's bug tracker and see if there are any easy-to-tackle bugs you could hunt. Often, maintainers mark a bug as a "good first issue" when they estimate that the effort required to fix it is low. Always go through the contribution guidelines for committers and stick to the processes that the project has established for good collaboration.

This level makes you a committer.

Become a key member of the project

As you contribute more and more to the project, you'll find that other community members start to recognize and trust your work. You have demonstrated your skills and passion for the project, and people trust your ability to make good decisions to help the project succeed. In many open-source projects, maintainers can nominate or even directly select community members to become permanent contributors to the source code. You'll start reviewing other's patches and, likely, implementing new features and help drive the future of the project. Only genuine interest and constant work in the project will take you there. The road can be long, but I promise, it's an exciting one at each of the levels I describe here.

This level makes you a maintainer.

Read More

Blog rebrand

Hey reader! A short entry to announce and document my blog's rebrand. These are the main changes: 

• Renamed to Programming Brain (previously Programmer Thoughts)
• New www.programmingbrain.com domain (previously www.alejandrudu.com)
• New cooler theme

It's been a while since I wrote for my blog. I had been busy publishing mostly on vaadin.com and dzone.com, but I do want to keep this one alive and this rebrand is proof of my motivation. I wanted to move the focus to the content rather than the author's profile. So, I found a Blogger theme that fits this purpose well. It doesn't show lateral menus all full of me, me, and me. Instead, most of the space is organized around the articles without distracting images and with the important information highlighted. At the bottom of the pages, you can always find a footer with more information about the website.

From now on, I'll try to share useful information around programming, software development, Java and its ecosystem, Vaadin, databases, and other technical topics. I also want to share thoughts on Developer Relations (or Developer Advocacy) and open-source community management. You can always send suggestions on topics that you would like me to discuss as well. I'd love to hear from you!

Big thanks to Sandpatrol for the design, NewBloggerThemes.com for the theme, and Blogger for the hosting.

Read More

How to start a career in coding

A couple of days ago, a good friend of mine asked me how to make her kid more interested in programming. I think that parents should focus on giving kids opportunities to try different things instead of pushing them to take a route. Success is guided by motivation, and motivation comes from the inside. The best programmers I know started and continued their careers because they enjoyed the craftmanship of coding. They were attracted to the cryptic look of a screen full of code. They liked the tactile nature of typing code on a keyboard. They were amazed by how a series of words in English mixed with special characters lead the computer to show something on the screen. They quickly grasp the idea of a series of steps typed in a text file and how the computer understands these steps and executes them. They early discovered that the computer is, in the end, a dumb machine that obeys the programmer. None of them told me something like, "I started to program computers because I knew I would have a job in the future." No. The motivation is in the craftsmanship.

Like with many other disciplines, you can try programming and see if you like it. I started when I was about 13 years old. Since it seemed my brothers and I liked computers and we had gotten our first one, my parents bought a series of books on computers for kids. The third book was about programming. The programming language that the book explained was BASIC, a general-purpose language with an easy-to-read syntax. I don't think you need to be a kid or a teenager to start a career in software development. All you need is to experience coding by yourself and be honest with your feelings. If you enjoy the process, you'll get trapped in it and your curiosity will guide you.

So, let me show you how you can try coding by using the BASIC programming language. Unlike in my days of learning how to program, you don't need to install anything (lucky you!). Head to https://www.jdoodle.com/execute-freebasic-online and follow the rest of this article. This won't work if you don't go and open that page, preferably, from a computer (as opposed to a mobile device).

What you see on the website I pointed you to, is a screen divided into several sections. On the top, you have a text editor where you'll be typing your code shortly. At first, you'll find a short program already typed for you. Remove all that. Select the text and hit the delete key on your keyboard. We want to start coding from scratch! Next, you'll see a section to configure things out. I want you to make sure that you turn the "interactive mode" on by clicking on the switch that says Interactive. The switch should be turned to the right. Next, you'll see the area where the result or output of the program is displayed.

A programming language consists of words. Very few words actually, especially when compared to a human language. We are going to use upper-case for those words that are part of the BASIC programming language. For the rest, we'll use lower case. Let's get started! Type the following on the code editor at the top of the page:

PRINT "This is my first program ever!"

Click on the Execute button. You'll see the text "This is my first program ever!" on the output. Try adding another line of code to make the program show the message "I'm coding!" in the output.

PRINT "This is my first program ever!"

PRINT "I'm coding!"

Remember to click on the Execute button every time you want to see the result of your program. You'll see that the output shows the texts in the order in which you typed them in the code editor. Try switching the lines of code:

PRINT "I'm coding!"

PRINT "This is my first program ever!"

Once again, the output shows the messages in the same order as your instructions. The computer executes each line at a time from top to bottom. Let's try an essential concept in programming—variables. A variable is a space where you can store a value like a number, for example. A variable has a name and you are free to use any name as long as you don't use a reserved word like PRINT and others. Define a variable to hold a number by inserting a line of code at the very beginning of the program:

DIM n1 AS INTEGER = 7

PRINT "I'm coding!"

PRINT "This is my first program ever!"

The line you added tells the computer to create a variable with the name n1 and store the value 7 in it. The variable is ready, so you can make the program tell its value:

DIM n1 AS INTEGER = 7

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT n1

When you run (another term for "execute") the program, you'll see the number 7 in the output. Imagine that the variable n1 is the computer's favorite number, so you want the computer say "I like the number 7". You can just use PRINT "I like the number 7" but that's boring. Instead, let's use the value in the variable n1. To do that, you need to add the value at the end of the text "I like the number ". To do that you can use the ampersand character (&):

DIM n1 AS INTEGER = 7

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT "I like the number " & n1

Run the program and see how the computer tells you the number it was programmed to like. Change the value of the n1 variable, and rerun the program. For example:

DIM n1 AS INTEGER = 4

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT "I like the number " & n1

A cool thing about variables is that they can store values you can type when running the program. For example, let's make the program ask you what number you like. For that, you can use the INPUT keyword of the BASIC language. We need three new lines. One for telling the computer that we need another variable (to store your answer), one to ask the question, one to get the input from the keyboard. Add them at the end as follows:

DIM n1 AS INTEGER = 4

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT "I like the number " & n1

DIM n2 AS INTEGER

PRINT "What number do you like?"

INPUT n2

Run the program and answer the question! Type a number and hit ENTER. The instruction INPUT n2 tells the computer to pause the execution of the program until the user (that's you as well since you are the programmer and the user of your own program!) types a number and hits the ENTER key. The value that the user types is stored in the n2 variable. Now you can use the value to show another message to the user:

DIM n1 AS INTEGER = 4

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT "I like the number " & n1

DIM n2 AS INTEGER

PRINT "What number do you like?"

INPUT n2

PRINT "Cool, I also like " & n2

A powerful thing computers can do is compare things and execute code if a condition is fulfilled. For example, let's say you want the program to show a message if the number that the user introduces is greater than 999. You can do that by using the IF and THEN keywords:

DIM n1 AS INTEGER = 4

PRINT "I'm coding!"

PRINT "This is my first program ever!"

PRINT "I like the number " & n1

DIM n2 AS INTEGER

PRINT "What number do you like?"

INPUT n2

PRINT "Cool, I also like " & n2

IF n2 > 999 THEN PRINT "It's a big number!"

The last line checks whether the value stored in the n2 variable is greater than 999 and shows a text in the output if so. Otherwise, the program won't show the message. Run the program and introduce a number like 1000. Try also entering a small number and see the different behavior of the program. You are making your program look smarter and smarter!

I'm going to leave it there for now. Did you enjoy the experience? Was it fun to type code, click the Execute button, and interact with your own program? This is the essence of what a programmer does, and if you had fun and cannot wait to type more code, you are on the route to becoming a programmer! If you found it tedious or hard to understand, it might have been my teaching methodology that doesn't suit your learning style. Try other resources, like videos or books, and reevaluate your experience.

There are many programming languages. It doesn't matter which programming language you want to learn. You can continue your journey with BASIC or jump to a language such as Java, Python, C++, or any other that you find interesting for whatever reason. I recommend you get a book on the language you pick and read it through. Code small programs to understand the concepts or if you have a fun or funny idea, go ahead and code it!

Once you feel comfortable with a programming language, explore the libraries that are available for it. A library is code that someone else has written to fulfill a particular function. A library can include code for making it easier to render graphics or images, store data in files, show input controls like text fields and buttons, run complex financial calculations... The list goes on and on.

At some point, you'll have to learn concepts such as data structures and algorithms. Make sure to study the basics of these two topics as well. Read about software engineering. Learn about unit testing and source code control systems such as Git. But don't worry about these things when you are starting. Bookmark this article and come back as you progress. I really hope you continue your journey and, most importantly, that you enjoy it! If someday you get a job as a coder, let me know! I'd love to hear your story.

Read More

My Experience Talking at JConf Colombia

Ever since I joined the team at Vaadin I had wanted to showcase our technologies at a local conference in my home country, Colombia. This year, the organizers of JConf Colombia 2019 invited me over to give not one but two talks during the event. It was good timing–the conference took place around the summer vacation time I had already planned to have in Colombia (I'm based in Finland).

So, I packed my suitcase with the usual essentials, plenty of Finnish treats (read, salmiakki) and a bunch of Vaadin stickers and T-shirts. Unfortunately, this swags didn't make it to Medellín (where the conference took place) since I know quite some people in the IT industry in Bogotá, where I initially landed in Colombia. Vaadin T-shirts are super popular! So, blame my IT colleagues in Bogotá if you didn't get one at the conference. Kidding. It was bad planning from my side, sorry. Catch me at the next conference I'll get you one.

I headed to Medellín two days before the conference started and was picked up at the airport by Geovanny Mendoza, a fervent Vaadin fan to whom I'm more than grateful. He has also been talking about Vaadin in other versions of the Latin-American JConf conferences. We spent the rest of the day talking about technology and the promising future of Vaadin.

The next day, I visited IBM Colombia and presented Vaadin and its philosophy–code your web UI in Java without JavaScript or HTML. Most of the audience didn't know about Vaadin at all. They looked impressed by how fast you can get started with it. The code, to them, resembled the API of Java's Swing, which many developers used when they were learning Java. However, it was an eye-opener to realize that the younger developers didn't know about Swing nor had used it before. And even so, they were easily guessing the names of the Vaadin API's methods I had to use while coding.

The first track of the conference started the next day. It was held in the theater of the University of Antioquia which has a capacity of more than 1000 people. Talks were mostly technical but there was an emphasis on community and open source.

My first talk at JConf Colombia, Colombians in the Open Source World: Our Experience Working for Payara and Vaadin, was shared with the talented Fabio Turizo, also Colombian, and a Java Architect and Developer working as a Service Team Manager for Payara. I hope we can do additional collaborative work in the future with Fabio and Payara's technologies.

In our talk, we shared our experience working for open-source companies. What are these companies all about? What products do they develop? How did we end up working there? How is it to work for these companies? What do we do at these companies? It was fun to share this kind of insights, and since Vaadin is so simple to use and everybody in the audience was a developer, I managed to explain what Vaadin is in a single slide with a "Hello, World" application. After the talk, I was amazed by some developers in the audience who approached me to ask more about Vaadin, both the company and the web framework.

The second track was on the next day at Ruta N Complex. A day packed with amazing international and national speakers with highly technical topics. I quickly prepared my laptop for my talk Implementing Modern Web Pages in Java and got the chance to talk about the very origins of the Spring + Vaadin integration with its own creator Josh Long from Pivotal before heading to the auditorium.

During my talk, I implemented a simple "comment system" from scratch. Developers were amazed by how you are able to leverage the full potential of a Java IDE (I used IntelliJ IDEA) while coding the presentation layer of an application with Vaadin. It was marvelous to see "wow" reactions during my talk.

After a couple of silly jokes, refactorings, and fun with Java code, we continued having conversations with developers who, again, wanted to know more about Vaadin. They were curious about how to integrate web components, how to organize or modularize the code, and how a company that releases an open-source free product makes money.

I had a blast at the conference. Finally got to meet face-to-face Reza Rahman from Microsoft, and Josh Long and Mark Heckler from Pivotal. Plenty of “wow” reactions during my talks which was a nice reminder that we are developing a really cool technology at Vaadin. Thanks for the inspiring discussions to the people from Payara, IBM, and Jakarta EE and all the organizers of the event. I'm definitely looking forward to joining the 2020 edition!

Read More

Learning Microservices with a Practical Example

Although this example application is simplistic and no one should ever use microservices to implement an application like this one, it shows you how it feels to run this kind of applications and how to implement it using Spring Cloud.

If you only want to play around with a microservices application, follow this tutorial. If you want to code the full app using Java, Eureka, Spring Cloud Config, Spring Data Rest, Hystrix, Zuul, Spring Session, and Vaadin, follow the complete 9 steps tutorial.

You'd end up with several terminals where each terminal is running a specific service:

In real-world projects, you most likely wouldn't start microservices like this. You would probably use an orchestration tool such as Docker Swarm or Kubernetes. There's a Git branch in the repository for this example application that contains Docker files you could experiment with to learn more about how to deploy microservices in production environments.

In the following sections, I describe some guidelines to create a practice environment.

Setting up the Machines

Use VirtualBox to create a virtual machine and install Alpine Linux on it. Use a Bridged Adapter in the network configuration.

Set up static IPs for both machines. Edit the /etc/network/interfaces file to:

auto lo

iface lo inet loopback

auto eth0

iface eth0 inet static

address 192.168.1.150

        netmask 255.255.255.0

        gateway 192.168.1.1

Set up SSH so you can use your host machine to connect to the virtual machine from now on (something that would happen in a real-world scenario):

apk add openssh

You would need to add PermitRootLogin yes to the /etc/ssh/sshd_config file to make things easier for now (or you can create a new OS user and connect to the VM using its credentials). With this, you can connect to the VM using:

ssh root@192.168.1.150

To install Docker, first add the following repository to the /etc/apk/repositories file:

http://dl-cdn.alpinelinux.org/alpine/latest-stable/community

Then run:

apk update

apk add docker

To run Docker at startup, execute:

rc-update add docker boot

In VirtualBox, shut down the VM and clone it. Generate a new MAC address for the cloned VM in the network configuration. Start and connect to the cloned VM to configure a different IP address in the /etc/network/interfaces file. For example 192.168.1.151. Restart the cloned VM and start the original one. You should have now two VMs ready.

Running the Application with Docker Swarm

In the 192.168.1.150 machine, init a swarm:

docker swarm init --advertise-addr 192.168.1.150

This machine is now the master machine.

Copy the reported docker swarm join command and run it in the other machine (192.168.1.151). The command should look similar to this:

docker swarm join --token SWMTKN-1-2j6qifl5jbb7zmcbr1ti7xl3qthmhj87b853afjmh29i7f6voi-5az2apq6vq80sls2uvd1sjz1o --advertise-addr 192.168.1.151 192.168.1.150:2377

This machine is now a worker machine.

In the master machine (192.168.1.150), create a new docker-compose.yml file with the following contents:

version: '3'

services:
  discovery-server:
    image: alejandrodu/microservices-discovery-server
    ports:
      - "8001:8080"
    command: --spring.cloud.inetutils.preferredNetworks=10.0 --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

  config-server:
    image: alejandrodu/microservices-config-server
    ports:
      - "8101:8080"
    command: --spring.cloud.inetutils.preferredNetworks=10.0 --spring.cloud.config.server.git.default-label=docker --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

  biz-application:
    image: alejandrodu/microservices-biz-application
    ports:
      - "9001:8080"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    volumes:
      - ~/h2-databases:/root/h2-databases
    deploy:
      resources:
        limits:
          memory: 128M

  admin-application:
    image: alejandrodu/microservices-admin-application
    ports:
      - "9101:8080"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 256M

  news-application:
    image: alejandrodu/microservices-news-application
    ports:
      - "9201:8080"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

  website-application:
    image: alejandrodu/microservices-website-application
    ports:
      - "9301:8080"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

  proxy-server:
    image: alejandrodu/microservices-proxy-server
    ports:
      - "8080:8080"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

  monitor-application:
    image: alejandrodu/microservices-monitor-application
    ports:
      - "8201:8201"
    command: ---spring.cloud.inetutils.preferredNetworks=10.0 --eureka.client.serviceUrl.defaultZone=http://discovery-server:8080/eureka/ --logging.file=application.log
    deploy:
      resources:
        limits:
          memory: 128M

The main things to notice in the previous configuration are the usage of a preferred network when running a service, the shared volume in the biz-application, and the Git branch used by the config-server.

Run the stack by executing:

docker stack up -c docker-compose.yml microservices-demo

What's next?

The purpose of this article is not to explain all the concepts and details on Docker and Docker Swarm but rather give you some guidance on how to experiment and learn by yourself.

From here you can experiment with cloud providers several of which ease Docker-based deployments, replicating the Discovery and Config services to avoid having them as single points of failure; and setting up a database cluster for the same reason.

Read More

How to call a Java method from a JavaScript function in the browser

In this video I demonstrate how to call a Java method that runs in the server from a JavaScript function running in the web browser:

In short, you need a Java web application with the Vaadin dependencies (you can quickly create one here), a script file in the webapp/frontend/ directory, and a Java class with a method annotated with @ClientCallable that sends an Element to the JavaScript function. The JavaScript function can use the $server object in the Element instance to call the annotated Java method.

Here's the code:

MainView.java:

@JavaScript("frontend://script.js")
@Route
public class MainView extends Div {
    public MainView() {
        getElement().executeJavaScript(
                "someJavaScriptFunction($0)", getElement());
    }

    @ClientCallable
    public someJavaMethod(String message) {
        System.out.println(message);
    }
}

script.js:

function someJavaScriptFunction(element) {
    element.$server.someJavaMethod("Hello server!");
}

You can read the full step-by-step tutorial here.

Read More