Anders Tornblad

All about the code

"Hello, World!" in HTML

How to do "Hello, World!" in HTML5.

<!doctype html> <title>Hello, World!</title> <p>Hello, World!

Most of the structure of an HTML document, including the html, head and body elements, can be left out without invalidating the document. Also, most block-level elements are self-closing. For instance, the segment <p>Hello<div>World is perfectly equivalent to <p>Hello</p><div>World</div>, which sometimes can be unintuitive, especially in combination with CSS or the querySelector function.

For more "Hello, World!" examples, go to the Hello World category.

"Hello, World!" in JavaScript

How to do "Hello, World!" in JavaScript.

'use strict'; console.log('Hello, World!')

JavaScript has really matured over the last years. Though it started out as a browser-only language, giving grey hairs to web developers everywhere, it is now a competent language in its own right. Combined with initiatives such as node.js, it performs on par with all other system languages. The code above works in your browser (printing to the developer console) as well as in node.js (printing to your terminal output). And yes, you should always go for strict mode.

For more "Hello, World!" examples, go to the Hello World category.

A simple hamburger button

There are lots of tutorials, pens and fiddles out there describing how to create the perfect hamburger button, as well as a few bloggers telling us to stop using it. Me, I kind of like it, actually. It has become a household item – most people know what it is and what it should do. Also, it has been around for almost 40 years. Check out this history of widgets until 1990

A simple layout

I like trying to keep things as simple as possible, so instead of going all in with SVG, JavaScript, animations and complicated transitions, the HTML markup for my hamburger button is simple:

<button class="hamburger"> <hr> <hr> <hr> </button>

The CSS is almost as simple:

button.hamburger { display: flex; flex-direction: column; justify-content: space-around; align-items: stretch; width: 6vw; height: 6vw; box-sizing: border-box; padding: 1vw; border-raius: 0.8vw; background: #195024; cursor: pointer; } button.hamburger hr { display: block; border: 0; height: 0.5vw; background: white; }

Always some browser issue

This worked like a charm until I tested in Firefox. Even though the button element has justify-content: space-around, the hr elements get lumped together in the middle. Even IE got it right. But just for Firefox, I had to add this to my CSS:

button.hamburger hr + hr { margin-top: 0.5vw; }

"Hello, World!" in PHP

How to do "Hello, World!" in PHP.

<?php echo 'Hello, World!'; ?>

Even though PHP is mostly used for adding server-side functionality to web pages, PHP is actually a self-containing language that can be run on a lot of different platforms, both in a web server and completely stand-alone. When PHP is run inside a web server, the echo function renders output to the response of an HTTP request. When PHP is run from the command line, it prints to the console.

For more "Hello, World!" examples, go to the Hello World category.

"Hello, World!" in Java

How to do "Hello, World!" in Java.

public class Program { public static void main(String[] args) { System.out.println("Hello, World!"); } }

I have never really gotten into the Java world. I wrote some Java code in Notepad back in the 1990s and liked the language, but then I had the misfortune of having to use Eclipse at work a few times, and hated the whole experience, from installation to debugging.

For more "Hello, World!" examples, go to the Hello World category.

"Hello, World!" in C#

How to do "Hello, World!" in C#.

class Program { static void Main() { System.Console.WriteLine("Hello, World!"); } }

For writing desktop and server applications, C# has been my language of choice for over ten years now, both for work and for side projects. I really like PHP too, but I don't think it can measure up to the maturity of C#, even though PHP7 looks really nice. The size of the .NET Framework and all the Open Source NuGet packages available really help focusing on what to do, instead of how to do it.

For more "Hello, World!" examples, go to the Hello World category.

"Hello, World!" in C++

How to do "Hello, World!" in C++.

#include <iostream> int main() { std::cout << "Hello, World!" << std::endl; return 0; }

About ten years after the birth of the C language, object oriented paradigms were added to form the C++ language. The latest version of the C++ standard is often called C++14.

For more "Hello, World!" examples, go to the Hello World category.

"Hello, World!" in C

How to do "Hello, World!" in C.

#include <stdio.h> int main() { puts("Hello, World!"); return 0; }

The C language is father and grandfather of a whole range of modern languages, like C++, PHP, C#, Java, Objective C, Swift, JavaScript and others. Development of the language is continuing, and the latest version, from December of 2011, is usually called C11. C is still in heavy use, mostly for embedded systems, realtime applications and operating systems on small devices.

For more "Hello, World!" examples, go to the Hello World category.