Aplikasi Peduli Diri UKK SMK 2022

Untuk memulai membuat aplikasi Peduli Diri, Pertama download lah area kerja Java Script dibawah ini:

Download File Zip >>  FILE ZIP JS UKK PEDULI DIRI <<
Download Folder Yang Telah Di Extract >> FOLDER AREA KERJA PEDULI LINDUNGI <<

Kemudian, ikuti langkah - langkah berikut:

1. Buatlah file-file baru pada area kerja yang telah di ektract dengan cara CTRL + N atau New File, dengan nama file sebagai berikut:

- catatan_perjalanan.php
- home.php
- index.php
- isi_data.php
- login.php
- navigasi.php

- style.css

dokpri

2. Ketikkan script coding pada file login.php seperti dibawah ini:

session_start();

$nik = @$_POST['nik'];

$nama = @$_POST['nama'];

$file = "file/" . $nik . "-" . $nama . "txt";

// jika di tekan tombol pengguna baru

if (isset($_POST['pengguna_baru'])) {

if (empty(file_exists($file))) {

$fh = fopen($file, "w");

fwrite($fh, "");

fclose($fh);

$alert = "

Anda berhasil bergabung

";

$_SESSION['nik'] = $nik;

$_SESSION['nama'] = $nama;

echo "";

} else {

$alert = "

Anda gagal bergabung

";

}

}

// jika di tekan tombol masuk

elseif (isset($_POST['masuk'])) {

if (!empty(file_exists($file))) {

$alert = "

Anda berhasil masuk

";

$_SESSION['nik'] = $nik;

$_SESSION['nama'] = $nama;

echo "";

} else {

$alert = "

Anda gagal masuk

";

}

}

?>

Document

PEDULI DIRI

CATATAN

PERJALANAN

Saya Pengguna Baru

Masuk

3. Ketikkan script coding pada file home.php seperti dibawah ini:

Selamat Datang di Aplikasi Peduli Diri

4. Ketikkan script coding pada file index.php seperti dibawah ini:

 

session_start();

$nik = $_SESSION['nik'];

$nama = $_SESSION['nama'];

$page = @$_GET['page'];

if (!empty($_SESSION['nik'])) {

?>

Document

if ($page == 'isi_data') {

include "isi_data.php";

} elseif ($page == 'home' || empty($page)) {

include 'home.php';

} elseif ($page == 'catatan_perjalanan') {

include 'catatan_perjalanan.php';

} elseif ($page == 'logout') {

unset($_SESSION['nik']);

unset($_SESSION['nama']);

header("location:login.php");

}

?>

} else {

header("location: login.php");

}

?>

5. Ketikkan script coding pada file navigasi.php seperti dibawah ini:

 

PEDULI DIRI

CATATAN PERJALANAN

} ?>">Home

} ?>">Catatan Perjalanan

} ?>">Isi Data

} ?>">Keluar

6. Ketikkan script coding pada file isi_data.php seperti dibawah ini:

if (isset($_POST['simpan'])) {

$tanggal = $_POST['tanggal'];

$jam = $_POST['jam'];

$lokasi = $_POST['lokasi'];

$suhu = $_POST['suhu'];

$file = "file/" . $nik . "-" . $nama . ".txt";

$fh = fopen($file, "a");

$cek_baris = fopen($file, "r");

$baris = fgets($cek_baris);

if ($baris) {

$isi_data = "\n" . $tanggal . "|" . $jam . "|" . $lokasi . " |" . $suhu;

} else {

$isi_data = $tanggal . "|" . $jam . "|" . $lokasi . "|" . $suhu;

}

fwrite($fh, $isi_data);

fclose($fh);

$alert = "

Anda berhasil menambah data catatan perjalanan

";

echo "";

}

?>

FORM TAMBAH DATA CATATAN PERJALANAN

Tanggal

Jam

Lokasi

Suhu Tubuh

Simpan

Reset

7. Ketikkan script coding pada file catatan_perjalanan.php seperti dibawah ini:

Data catatan perjalanan anda

$file = "file/" . $nik . "-" . $nama . ".txt";

$fh = fopen($file, "r");

while (!feof($fh)) {

$baris = fgets($fh);

if ($baris) {

$string_data = explode("|", $baris);

?>

} ?>

TanggalWaktuLokasiSuhu Tubuh

 8. Ketikkan script coding pada file style.css seperti dibawah ini:

 

.btn-a{

position: relative;

}

.btn-b{

position: absolute;

right: 0;

}

 

Silakan modifikasi aplikasi sesuai keinginan anda. Selama ujian jangan curang ya....hehehe!

Selamat Belajar!