Way back in October, 2022, Florin Pop tweeted this question:
He got 400 responses in 10 hours. Some were lighthearted: “I would use HTML.” Others went into some detail about a favorite webapp development stack. I came to the party late, but I thought it would be a fun thing to try.
There were no particular requirements or specifications beyond the phrase, “landing page.” So, I felt free to make a few assumptions:
- We don’t count the time required to install tools. We begin with all tools installed and working. This is an important point, because the process of getting the tools installed can be tedious and time-consuming. Every time there’s a new version of just about anything in your stack, everything breaks. Sometimes, even the tool installation procedure or script doesn’t work. So let’s not count that time for purposes of this exercise. That said: Even with various installation issues, the entire process only took about an hour, including all ten solutions. We’re well within the 24-hour time frame.
- A “landing page” is just the initial HTML document that shows up when you first access a website or webapp. So, I assumed anything that can be rendered in a Web browser counts as a “landing page” for purposes of this exercise. Obviously, that would not be a good assumption if our “landing page” were meant to be the starting point of a real application; but for purposes of this exercise, any kind of “Hello, world!” thing counts.
I worked on a clean Kubuntu desktop 20.04 instance running under VMware Workstation on a Microsoft Windows 10 host. That’s a Debian-based Linux distro. I did have to install tools, but I’m not counting that time as part of the exercise.
All ten landing pages were “developed” via the command line. No text editor or IDE was used. You’re going to say I cheated or took shortcuts. I would say my approach was like baking a cake from a mix rather than from scratch. It may be a form of cheating, but the cake still tastes okay.
Okay, let’s bake!
1. Minimalist
echo 'Landed!' > lander.html
firefox lander.html
To view:
file:///[path-to-file]/lander.html
2. React
npx create-react-app lander
cd lander
npm start
To view:
http://localhost:3000
3. Angular
git clone https://github.com/angular/quickstart.git angular
cd angular
npm intall
npm start
To view:
http://localhost:4200
4. Vue
npm init vue@latest
(enter project name 'vue' when prompted)
cd vue
npm install
npm run dev
To view:
http://localhost:5173
5. PHP
git clone https://github.com/Azure-Samples/php-docs-hello-world php
cd php
php -S localhost:8080
To view:
http://localhost:8080
6. Django
git clone https://github.com/rnevius/minimal-django.git
cd minimal-django
python3 minimal.py runserver
To view:
http://localhost:8000
7. Rails
gem install rails
rails new railslanding
cd railslanding
rails server
To view:
http://localhost:3000
8. Sinatra
gem install sinatra
gem install thin
mkdir sinatra
cd sinatra
echo "require 'sinatra'" > lander.rb
echo "get '/' do" >> lander.rb
echo ' Landed!"' >> lander.rb
echo 'end' >> lander.rb
ruby lander.rb
To view:
http://localhost:4567
9. SpringBoot
git clone https://github.com/spring-guides/gs-spring-boot.git
cd gs-spring-boot/complete
./gradlew bootRun
To view:
http://localhost:8080
10. .NET Core
dotnet new web --name lander
dotnet run
To view:
http://localhost:5001
Nothing useful there. Just fun and games.
11. A lagniappe, baked from scratch
I guess if you were really keen to bake the cake from scratch, you could write something like this:
while true; do { echo -ne "HTTP/1.0 200 OK\nContent-Length: $(wc -c<bashland.html)\n\n"; cat bashland.html; } | nc -l -p 8080 ; done
That’s a bash one-liner that functions as a simple Web server. It’s based on one of the numerous examples you can find online (although none of them worked on my system without some tweaking). Even if you bake from scratch, you need a recipe the first time – or at least you need to watch a video about baking a cake. This server can’t do anything except render the landing page – and that’s all that was required for this exercise. We’re taking the YAGNI principle to an extreme.
Don’t forget the icing:
echo '<!DOCTYPE html><html><body><h1>Landing page served by bash</h1></body></html>' > bashland.html
To view:
http://localhost:8080
…and you get all this fun output:
GET / HTTP/1.1
Host: localhost:8080
User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:103.0) Gecko/20100101 Firefox/103.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: none
Sec-Fetch-User: ?1