Countdown App mit ChatGPT

Warum (einfache) Software kaufen oder nach Apps suchen, wenn man mit ChatGPT eine individuelle Softwarelösung in wenigen Schritten selbst erstellen kann?

Seit kurzem mache ich morgens Sport, 45 bis 60 Sekunden Bewegung und dann 15 Sekunden Pause. Dabei schaue ich jedes Mal auf die Uhr an der Wand.

Heute habe ich mir überlegt, dass ich mit ChatGPT ein kleines Programm programmieren kann, das mir nach Ablauf der Aktiv- und Ruhezeit einen kurzen Alarm gibt.

ChatGPT (o1) schafft ein solches Programm ohne Weiteres, siehe unten. Und ja, ich weiss, es gibt bestimmt schon 1000 solcher Countdown-Apps. Aber mir geht es um etwas anderes: Ich glaube, dass künstliche Intelligenz es schon heute möglich macht, individuelle Softwarelösungen einfach und ohne Programmierkenntnisse zu erstellen. Die Art und Weise, wie wir Software konsumieren, wird sich also in Zukunft verändern: Wir werden sie selbst spezifisch für unsere Bedürfnisse erstellen.

So sieht die App übrigens aus:

Hier ist mein Prompt, indem ich in natürlicher Sprache geschrieben habe, was ich brauche:

Und hier der html-Code:

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Aktivzeit und Ruhezeit Countdown</title>
<style>
    body {
        font-family: Arial, sans-serif;
        text-align: center;
        margin-top: 50px;
    }
    #timer {
        font-size: 48px;
        margin: 20px;
    }
    input {
        font-size: 24px;
        width: 100px;
        text-align: center;
    }
    button {
        font-size: 24px;
        margin: 10px;
    }
</style>
</head>
<body>

<h1>Aktivzeit und Ruhezeit Countdown</h1>

<div>
    <label>Aktive Zeit (Sekunden): </label>
    <input type="number" id="activeTime" value="60" min="1"><br><br>
    <label>Ruhezeit (Sekunden): </label>
    <input type="number" id="restTime" value="30" min="1">
</div>

<div id="timer">00:00</div>

<button id="startButton">Start</button>
<button id="endButton">End</button>

<audio id="beepSound">
    <source src="beep.mp3" type="audio/mpeg">
    <source src="beep.wav" type="audio/wav">
</audio>

<script>
    let timerElement = document.getElementById('timer');
    let activeTimeInput = document.getElementById('activeTime');
    let restTimeInput = document.getElementById('restTime');
    let startButton = document.getElementById('startButton');
    let endButton = document.getElementById('endButton');
    let beepSound = document.getElementById('beepSound');

    let countdownInterval;
    let currentTime;
    let isActivePhase = true;
    let isRunning = false;

    function startTimer() {
        if (isRunning) return;

        isRunning = true;
        isActivePhase = true;
        currentTime = parseInt(activeTimeInput.value);

        countdownInterval = setInterval(function() {
            timerElement.textContent = formatTime(currentTime);
            currentTime--;

            if (currentTime < 0) {
                beepSound.play();
                if (isActivePhase) {
                    isActivePhase = false;
                    currentTime = parseInt(restTimeInput.value);
                } else {
                    isActivePhase = true;
                    currentTime = parseInt(activeTimeInput.value);
                }
            }
        }, 1000);
    }

    function endTimer() {
        clearInterval(countdownInterval);
        timerElement.textContent = "00:00";
        isRunning = false;
    }

    function formatTime(seconds) {
        let mins = Math.floor(seconds / 60);
        let secs = seconds % 60;
        if (mins < 10) mins = '0' + mins;
        if (secs < 10) secs = '0' + secs;
        return mins + ':' + secs;
    }

    startButton.addEventListener('click', startTimer);
    endButton.addEventListener('click', endTimer);
</script>

</body>
</html>