Pembelajaran Coding : Membuat Aplikasi Hitung Rumus Fisika Berbantuan (IA)

Pada Artikel sebelumnya... di sini

Pembelajaran Coding : Membuat Aplikasi Berbantuan Artificial Intelligence (IA)

Salam Ingin membuat artikel tentang judul di atas.... mo ngetik ... maless... nyari2artikel... males... akhirnya nanya ke chatGPT dengan prompt Buatkan artikeltentang, Pembelajaran Coding : Membuat Aplikasi Berbantuan ArtificialIntelligence (IA)? > Prompt dalam AI adalah instruksi atau masukan…

Jejak MediaHary Tri

Sebetulnya inginnya membuat sebuah aplikasi, misalnya aplikasi berbasis Web, untuk menghitung sebuah rumus fisika, apakah bisa?

Menggunakan Meta AI yang menyatu dalam Aplikasi WA... dengan prompt "Bisa tolong buatkan kode program berbasis html, css, dan javascript untuk menghitung hukum newton ddngan rumus f = m.a, dengan m adalah massa, a adalah perceatan dan f adalah gaya, dengan input m dan a. Hasil yang dihitung adalah f?

Diberikan Code Berikut

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hukum Newton</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>Hukum Newton</h1>
    <form id="form-newton">
        <label for="massa">Massa (m) :</label>
        <input type="number" id="massa" required>

        <label for="percepatan">Percepatan (a) :</label>
        <input type="number" id="percepatan" required>

        <button id="hitung">Hitung</button>
    </form>

    <p id="hasil"></p>

    <script src="script.js"></script>
</body>
</html>

body {
    font-family: Arial, sans-serif;
}

#form-newton {
    width: 300px;
    margin: 20px auto;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

label {
    display: block;
    margin-bottom: 10px;
}

input[type="number"] {
    width: 100%;
    height: 30px;
    margin-bottom: 20px;
    padding: 10px;
    border: 1px solid #ccc;
}

button[type="button"] {
    width: 100%;
    height: 40px;
    background-color: #4CAF50;
    color: #fff;
    padding: 10px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

button[type="button"]:hover {
    background-color: #3e8e41;
}

#hasil {
    font-size: 24px;
    font-weight: bold;
    margin-top: 20px;
}

const formNewton = document.getElementById('form-newton');
const hasil = document.getElementById('hasil');

formNewton.addEventListener('submit', (e) => {
    e.preventDefault();

    const massa = parseFloat(document.getElementById('massa').value);
    const percepatan = parseFloat(document.getElementById('percepatan').value);

    if (isNaN(massa) || isNaN(percepatan)) {
        hasil.textContent = 'Masukkan nilai yang valid!';
        return;
    }

    const gaya = massa * percepatan;
    hasil.textContent = `Gaya (F) = ${gaya} N`;
});

Cara menggunakan

1. Buat file baru dengan nama index.html dan salin kode HTML ke dalamnya.
2. Buat file baru dengan nama style.css dan salin kode CSS ke dalamnya.
3. Buat file baru dengan nama script.js dan salin kode JavaScript ke dalamnya.
4. Buka file index.html di browser untuk menjalankan aplikasi.
5. Masukkan nilai massa dan percepatan, lalu klik tombol "Hitung" untuk melihat hasilnya.

Hasilnya adalah

Begitu mudahnya ya sekarang membuat sebuah aplikasi berbantuan AI

Test di codepen

kunjungi website

https://blog.jejakmedia.link

https://kb.jejakmedia.link

Youtube Playlist https://www.youtube.com/@jejakmedia7912/playlists