Thursday, August 30, 2018

SLiMS - Getting Started - Holiday Configuration | #6 | Mukti911


A. Pendahuluan
Nah setelah ini kita akan menjalankan konfigurasi untuk mengatur penjadwalah hari libur. Nah kali ini aku akan membuat jadwal hari libur untuk perpustakaan.

B. Latar Belakang
Penjadawalan perpustakaan sangat penting sekali bagi managemen sikulasi dan inventarisasi.

C. Maksud & Tujuan
Agar dapat melakukan penjadwlan hari libur di SLiMS

D. Waktu Pelaksanaan

  • Tergantung individu masing masing

E. Pembahasan
Nah penjadwalah pada SLiMS sagat berguna sekali kenapa demikian karena penjadwalan juga berpengaruh pada perhitungan jumla hari peminjaman buku.

Pada konfigurasi ini digunakan untuk menentukan hari libur dari perpustakaan baik itu hari libur rutin atau hari libur nasional dan hari libur yang ditentukan. Berikut adalah cara konfigurasi setelan hari libur.


  • Klik menu sistem di menu side bar dan setelah terbuka menu lagi klik menu setelan hari libur.



  • Saat masuk ke menu setelan hari libur, terdapat beberapa tombol checklist dengan nama hari. Klik pada salah satu hari yang akan digunakan sebagai hari libur rutin. Kemudian klik Simpan Pengaturan.
  • Jika Perpustakaan ingin menetapkan hari libur khusus contohnya hari libur nasional, maka bisa tambahkan hari libur khusus dengan cara klik tombol tambah hari libur khusus. Setelah anda klik tombol tambah hari libur khusus, akan muncul sebuah tampilan untuk mengatur tanggal dari hari libur mulai dari tanggal berapa sampai tanggal berapa. Pada kolom pertama isi dengan tanggal pertama hari libur khusus tersebut dan pada kolom kedua diisi dengan tanggal berakhirnya libur khusus tersebut. Jika hari libur khusus itu hanya satu hari maka tinggal masukkan pada kedua kolom tersebut dengan tanggal yang sama.

  • Pada kolom keterangan hari libur isi sesuai dengan keterangan hari libur dalam rangka apa. Setelah mengisi semua informasi yang dibutuhkan maka klik tombol simpan. Setelah mengisi semua informasi untuk hari libur perpustakaan, klik tombol simpan pengaturan.


F. Hasil yang didapat

  • Dapat melakukan penjadwalan hari libur.

G. Kesimpulan
Penjadwalan hari libur di SLiMS dapat menpengaruhi perhitungan sirkulasi dan inventarisasi.

H. Referensi

  • -

Wednesday, August 29, 2018

SLiMS - Getting Started - Management Content | #5 | Mukti91


A. Pendahuluan
Setelah melakukan konfigurasi untuk tema. lanjut untuk managemen konten, nah managemen konten ini digunakan untuk menambahkan berita maupun informasi ke pengunjung perpustakaan.

B. Latar Belakang
Untuk melakukan managemen konten di SLiMS

C. Maksud & Tujuan
Agar dapat melakukan management konten di SLiMS

D. Waktu Pelaksanaan

  • Tergantung individu masing masing.

E. Pembahasan
Konfigurasi konten digunakan untuk mengubah informasi konten yang ada di SLiMS contohnya konten infomasi SLiMS, alamat perpustakaan dan lain sebagainya. Untuk mengubah konten tersebut bisa dilakukan dengan cara berikut.

  • Buka menu sistem lalu pilih pada menu konten. Untuk merubah isi konten yang telah ada, klik pada tombol berwarna hitam dan ada gambar pena. Jika anda ingin membuat sebuah konten baru klik pada tombol tambahkan data baru. Klik tombol tambahkan data baru untuk membuat sebuah konten baru.



  •  Pilih tombol  untuk mengubah isi konten. Masukkan judul dari konten yang akan digunakan untuk konten yang dibuat sesuai dengan konten yang diisi.
  • Klik pada salah satu pilihan radio yaitu pada pilihan ya atau tidak pada kolom ini berita untuk menjadikan konten ini sebagai berita atau tidak. Masukkan path yang unik dan berbeda dari konten lain agar setiap konten dapat diidentifikasi dan bisa diakses sesuai dengan path yang sudah ditentukan.
  • Isi deskripsi konten sesuai dengan deskripsi konten yang diinginkan pada kolom deskripsi konten. Klik tombol simpan untuk menyimpan konten yang sudah dibuat.


  • Berikut ini adalah contoh hasil dari konten.


H. Hasil yang didapat

  • Dapat menambahkan konten untuk berita.
I. Kesimpulan
jadi modul konten untuk menambahkan berita dan informasi.

J. Referensi

  • -

Tuesday, August 28, 2018

SLiMS - Getting Started - Configure Theme Preferences | #4 | Mukti911


A. Pendahuluan
Setelah selesai melakukan konfigurasi system nah kali ini kita akan menambahkan konfigurasi untuk menambahkan tema di SLiMS. Nah berikut ini adalah menambahkan dan mengubah tema di SLiMS.

B. Latar Belakang
Karena untuk mengubah tampilan dari SLiMS.

C. Maksud & Tujuan
Agar dapat mengubah dan menambahkan tema di SLiMS.

D. Waktu Pelaksanaan

  • Tergantung individu

E. Pembahasan
Nah sebelum melakukan konfigurasi untuk menganti tema pada SLiMS. Bahan apa saja yang diperlukan untuk melakukannya. Bahannya adalah seperti berikut ini :

  • Tema untuk SLiMS
  • SLiMS 

untuk temannya kalian bisa cari di Google atau di website miliknya SLiMS Kudus. www.slimskudus.web.id/ Kalian bisa cari cari disana atau download di Go SLiMS. Nah berikut ini adalah tema yang saya download di SLiMS Kudus.

Berikut ini adalah tema yang saya akan tambahkan. Download disini

onfigurasi tema digunakan untuk membuat tampilan OPAC dari SLiMS berbeda dari default. Tema bisa dirubah pada menu sistem lalu pilih tema kemudian klik activate tema yang akan digunakan untuk tampilan OPAC SLiMS.


Nah itu adalah cara mengati temanya sekarang bagaimana cara menambahkan tema baru. Pastikan sudah mendownload temanya dulu. Kemudian extract file tadi kemudian buka terminal masuk sebagai root menudian pindahkan file hasil extect-an tadi ke folder SLiMS


mukti@911-X453MA:/media/mukti/0218C90649777225$ su
Password:
root@911-X453MA:/media/mukti/0218C90649777225# mv desawarna_aperture /var/www/html/PerpustakaanOnline/template/
root@911-X453MA:/media/mukti/0218C90649777225# 
Setelah meindahkannya masuk ke browser kemudian akses masuk sebagai admin. kemudian masuk ke menu samping kiri yaitu sistem > themes. Kemudian scroll kemudian cari tema yang telah didownload kemudian klik active untuk menambahkannya.  



kemudian lihat kasilnya pada home page SLiMS jika sudah berubah penambahan tema di SLiMS berhasil dilakukan. 



H. Hasil yang didapat
dapat melakukan konfigurasi untuk menambahkan tema baru dam menganti template tema dari SLiMS.


I. Kesimpulan
Jadi untuk mengubah template SLiMS sangatlah mudah sekali kita tingal menambahkannya kita juga bisa membuatnya sendiri.

J. Referensi

  • -

Monday, August 27, 2018

SLiMS - Getting Started - Configuration System | #3 | Mukti911


A. Pendahuluan
Setelah melakukan installasi hal yang pertama apakah yang perlu dilakukan untuk mengoptimalkan kinerja SLiMS. Nah kali ini aku akan menjelaskan hal hal yang perlu dilakukan setelah selesai melakukan installasi.

B. Latar Belakang
Karena SLiMS akan digunakan untuk membuat sistem managemen perpustakaan dan bisa digunakan untuk menginformasikan tentang perpustakaan.

C. Maksud & Tujuan
Agar dapat mengoptimalkan kinerja SLiMS.

D. Waktu Pelaksanaan

  • Tengantung individu.

E. Pembahasan
Yang perlu dilakukan adalah mengkonfigurasi sistem informasi SLiMS. Nah berikut ini adalah konfigurasi awal :

Pada saat membuka tampilan admin SLiMS, terdapat sebuah menu yang berada di pinggir kiri yang berisi menu menu untuk konfigurasi dari SLiMS. Sebagai Administrator, ubahlah terlebih dahulu sistem yang ada di SLiMS dengan masuk klik menu System lalu pilih System Configuration.
  • Masukkan nama perpustakaan pada kolom name sesuai dengan nama perpustakaan.


  • Pada kolom nama tambahan bisa diisi dengan nama alamat atau nama yang sesuai dengan perpustakaan. Bahasa aplikasi bisa diubah dengan bahasa Indonesia maupun tetap menggunakan bahasa Inggris atau menggunakan bahasa selain bahasa Indonesia dan bahasa Inggris sesuai dengan bahasa yang didukung oleh SLiMS. Pilih jumlah koleksi katalog atau buku yang ditampilkan saat user mencari sebuah buku yang ada pada database ke OPAC SLiMS sesuai dengan jumlah yang telah ditentukan oleh sistem. Ubah pada kolom Tampilkan judul terpilih di laman OPAC dengan klik centang untukk menampilkan judul terpilih dan tidak usah berikan centang untuk tidak menampilkan judul terpilih pada laman OPAC.

  • Pada kolom pengembalian kilat digunakan untuk mengatur SLiMS menerima pengembalian barang perpustakaan secara langsung tanpa menunggu sampai tempo waktu yang sudah ditentukan secara otomatis oleh sistem. Pada kolom cetak bukti sirkulasi pilih sesuai dengan sistem yang diinginkan yaitu apakah ingin mencetak bukti peminjaman atau pengembalian barang perpustakaan atau tidak. Masukkan sebuah pilihan untuk pustakawan maupun admin bisa mengubah waktu peminjaman dan jatuh tempo secara manual dengan opsi tidak mungkin atau dimungkinkan. Kolom mengabaikan batas pinjam memungkinkan user untuk meminjam barang perpustakaan tanpa adanya batas waktu atau jatuh tempo sesuai dengan waktu jatuh tempo yang ditentukan oleh sistem. Kolom abaikan perhitungan denda kala libur memungkinkan user untuk tidak mendapat tambahan waktu jatuh tempo pada saat meminja sebuah barang perpustakaan. Detil XML OPAC berfungsi untuk menunjukkan detil dari XML sebuah buku atau media lain dalam format XML dan detil ini bisa dilihat saat mengakses sebuah buku atau media yang ada di OPAC. Hasil XML OPAC berfungsi untuk menampilkan hasil XML dari buku atau media dari katalog yang diakses. Kolom aktifkan pemeriksaan ejaan berfungsi untuk menjalankan pemeriksaan ejaan secara otomatis saat melakukan pencarian buku atau media di OPAC SLiMS.

    • Izinkan pengunduhan berkas OPAC memungkinkan user untuk diperbolehkan atau tidak diperbolehkan untuk mendownoad file lampiran pada sebuah katalaog dengan mengubah opsi menjadi diijinkan atau tidak diijinkan. Pada sesi masuk berakhir digunakan untuk membatasi waktu login dengan batas waktu dalam hitungan detik. Penyandian barkod digunakan untuk memilih jenis penyandian barkod yang akan dicetak sesuai dengan opsi yang diberikan. Visitor limitation digunkan untuk membatasi jumlah pengunjung yang masuk ke SLiMS. Time visitor limitation digunakan untuk membuat sebuah batasan waktu masuk seorang user dalam satuan waktu menit. Setelah memasukkan informasi yang sesuai, klik tombol simpan pengaturan untuk menyimpan pengaturan yang sudah dimasukkan.


    • Hasilnya :


    H. Hasil yang didapat

    • Dapat menlakukan konfigurasi perngaturan sistem

    I. Kesimpulan
    Jadi hal pertama yang perlu di konfigurasi adalah penguran informasi system di SLiMS.

    J. Referensi

    • -

    Apa Sebenarnya Server ? Seluas Apakah Server..


    A. Pendahuluan
    Nah Guys disini aku akan menbahas hal baru yaitu Server? Dari Tutorial Ku dahulu aku hanya menjalasakan beberapa jenis server. Dan ternyata serever itu sendiri apa sebenarnya. 

    B. Latar Belakang
    Agar lebih tau apa itu sebenarnya server.

    C. Maksud & Tujuan
    Agar dapat menglasifikasi jenis jenis server.

    D. Pembahasan
    Nah jadi apa sebenarnya Server itu ?. Dalam komputasi, server adalah program komputer atau perangkat yang menyediakan fungsionalitas untuk program atau perangkat lain, yang disebut "klien". Arsitektur ini disebut model client-server, dan satu komputasi keseluruhan didistribusikan di beberapa proses atau perangkat. Server dapat menyediakan berbagai fungsi, sering disebut "layanan", seperti berbagi data atau sumber daya di antara beberapa klien, atau melakukan perhitungan untuk klien. 

    Satu server dapat melayani beberapa klien, dan satu klien dapat menggunakan beberapa server. Proses klien dapat berjalan di perangkat yang sama atau dapat terhubung melalui jaringan ke server pada perangkat yang berbeda. Server umum adalah server basis data, server file, server email, server cetak, server web, server game, dan server aplikasi.


    Sistem client-server saat ini paling sering diimplementasikan oleh (dan sering diidentifikasi dengan) model request-response: klien mengirim permintaan ke server, yang melakukan beberapa tindakan dan mengirim tanggapan kembali ke klien, biasanya dengan hasil atau pengakuan . Menunjuk komputer sebagai perangkat keras kelas server" menyiratkan bahwa itu khusus untuk menjalankan server di atasnya. 

    Ini sering menyiratkan bahwa itu lebih kuat dan dapat diandalkan daripada komputer pribadi standar, tetapi alternatifnya, kelompok komputasi besar dapat terdiri dari banyak komponen server yang relatif sederhana dan dapat diganti.

    Operasi

    Jaringan yang didasarkan pada model client-server di mana beberapa klien individu meminta layanan dan sumber daya dari server terpusat Tegasnya, istilah server mengacu pada program atau proses komputer (menjalankan program). Melalui metonymy, ini merujuk pada perangkat yang digunakan untuk (atau perangkat yang didedikasikan untuk) menjalankan satu atau beberapa program server. Pada jaringan, perangkat semacam itu disebut host. Selain server, kata-kata melayani dan layanan (sebagai kata benda dan kata kerja) sering digunakan, meskipun pelayan dan pelayan tidak. Layanan kata (kata benda) dapat merujuk ke bentuk abstrak fungsionalitas, misalnya Layanan web. Atau, itu bisa merujuk ke program komputer yang mengubah komputer menjadi server, mis. 

    Layanan Windows. Awalnya digunakan sebagai "server melayani pengguna" (dan "pengguna menggunakan server"), dalam arti "mematuhi", hari ini orang sering mengatakan bahwa "server melayani data", dalam arti yang sama seperti "memberi". Sebagai contoh, server web "melayani halaman web ke pengguna" atau "melayani permintaan mereka".

    Server adalah bagian dari model client-server; dalam model ini, server menyajikan data untuk klien. Sifat komunikasi antara klien dan server adalah permintaan dan respons. Hal ini berbeda dengan model peer-to-peer di mana hubungan adalah timbal balik sesuai permintaan. Pada prinsipnya, setiap proses komputerisasi yang dapat digunakan atau dipanggil oleh proses lain (terutama dari jarak jauh, terutama untuk berbagi sumber daya) adalah server, dan proses atau proses pemanggilan adalah klien. 

    Dengan demikian komputer tujuan umum yang terhubung ke jaringan dapat meng-host server. Misalnya, jika file di perangkat dibagi oleh beberapa proses, proses itu adalah file server. Demikian pula, perangkat lunak server web dapat berjalan di komputer apa pun yang mampu, sehingga laptop atau komputer pribadi dapat menghosting server web.

    Sementara request-response adalah desain client-server yang paling umum, ada yang lain, seperti pola publish-subscribe. Dalam pola publikasi-langganan, klien mendaftar dengan server pub-sub, berlangganan jenis pesan tertentu; pendaftaran awal ini dapat dilakukan dengan permintaan-respons. Setelah itu, server pub-sub meneruskan pesan yang cocok ke klien tanpa permintaan lebih lanjut: server mendorong pesan ke klien, daripada klien menarik pesan dari server seperti dalam permintaan-respons.

    Tujuan dari server adalah untuk berbagi data serta untuk berbagi sumber daya dan mendistribusikan pekerjaan. Komputer server dapat melayani program komputernya sendiri juga; tergantung pada skenario, ini bisa menjadi bagian dari transaksi quid pro quo, atau hanya kemungkinan teknis. Tabel berikut menunjukkan beberapa skenario di mana server digunakan.

    Jenis server Tujuan Klien
    • Server aplikasi Menyelenggarakan aplikasi web (program komputer yang berjalan di dalam browser web) yang memungkinkan pengguna di jaringan untuk menjalankan dan menggunakannya, tanpa harus menginstal salinan di komputer mereka sendiri. 
    • Server katalog Menjaga indeks atau daftar isi informasi yang dapat ditemukan di jaringan terdistribusi besar, seperti komputer, pengguna, file yang dibagikan di server file, dan aplikasi web. Server direktori dan server nama adalah contoh server katalog. 
    • Server komunikasi Menjaga lingkungan yang dibutuhkan untuk satu titik akhir komunikasi (pengguna atau perangkat) untuk menemukan titik akhir lain dan berkomunikasi dengan mereka. 
    • Server komputasi Menghasilkan sejumlah besar sumber daya komputasi, terutama CPU dan memori akses acak, melalui jaringan. 
    • Server database Menjaga dan berbagi segala bentuk basis data (kumpulan data terorganisasi dengan properti yang telah ditentukan yang dapat ditampilkan dalam tabel) melalui jaringan. 
    • Server faks Membagi satu atau lebih mesin faks melalui jaringan, sehingga menghilangkan kerumitan akses fisik Setiap pengirim atau penerima faks
    • File server Membagi file dan folder, ruang penyimpanan untuk menyimpan file dan folder, atau keduanya, melalui jaringan Jaringan komputer adalah klien yang dituju, meskipun program lokal dapat menjadi klien
    • Server permainan Mengaktifkan beberapa komputer atau perangkat game untuk memainkan game multi-pemain Komputer pribadi atau konsol game
    • Server email Membuat komunikasi email mungkin dengan cara yang sama seperti kantor pos membuat komunikasi surat siput mungkin Pengirim dan penerima email
    • Server media Berbagi video digital atau audio digital melalui jaringan melalui streaming media (mentransmisikan konten dengan cara yang diterima bagian dapat ditonton atau didengarkan ketika mereka tiba, sebagai lawan mengunduh seluruh file dan kemudian menggunakannya) Komputer pribadi yang dihadiri pengguna dilengkapi dengan monitor dan pembicara
    • Server cetak Membagi satu atau lebih printer melalui jaringan, sehingga menghilangkan kerumitan akses fisik Komputer membutuhkan pencetakan sesuatu
    • Server suara Mengaktifkan program komputer untuk memutar dan merekam suara, secara individu atau secara bersama-sama Program komputer dari komputer dan klien jaringan yang sama.
    • Server proxy Berfungsi sebagai perantara antara klien dan server, menerima lalu lintas masuk dari klien dan mengirimnya ke server. Alasan untuk melakukannya termasuk kontrol konten dan penyaringan, meningkatkan kinerja lalu lintas, mencegah akses jaringan tidak sah atau hanya merutekan lalu lintas melalui jaringan yang besar dan kompleks. Komputer jaringan apa pun
    • Server virtual Membagi perangkat keras dan sumber daya perangkat lunak dengan server virtual lainnya. Itu hanya ada sebagaimana didefinisikan dalam perangkat lunak khusus yang disebut hypervisor. Hypervisor menghadirkan perangkat keras virtual ke server seolah-olah itu adalah perangkat fisik nyata. Virtualisasi server memungkinkan untuk infrastruktur yang lebih efisien. Komputer jaringan apa pun
    • Server web Menghosting halaman web. Server web adalah yang memungkinkan World Wide Web. Setiap situs web memiliki satu atau lebih server web. Komputer dengan browser web
    • Hampir seluruh struktur Internet didasarkan pada model client-server. 
    Server nama tingkat akar, DNS, dan router tingkat tinggi mengarahkan lalu lintas di internet. 

    E. Kesimpulan
    Jadi jenis server itu didsasarkan pada klasifikasi service yang ada di server tersebut.


    F. Referensi

    • https://whatis.techtarget.com/definition/server
    • https://www.lifewire.com/servers-in-computer-networking-817380
    • https://www.techopedia.com/definition/2282/server
    • https://www.webopedia.com/TERM/S/server.html

    Sunday, August 26, 2018

    DailyLife86 | ORARI | Event Special Call ORARI Lokal Klaten | Mukti911 | #2


    Assalamualaikum Wr. Wb.
    A. Pendahuluan
    Nah kali ini aku akan share pengalamanku ikut menjadi tim IT di Event Special Call ORARI Local Klaten. Berikut ini adalah sekilas kegiatanku.

    B. Waktu Pelaksanaan

    • 10:00 - Selesai

    C. Hal Yang Disampaikan
    Nah hari ini adalah hari yang cerah dipagi harinya ternyata Didaerah sekitar runahnya pak narwanto lagi ada kegiatan sepeda santai. Nah dipagi harinya saya disuruh jalan jaln dulu untuk refeshing agar lebih maksimal saat menglogger CallSign.

    CallSign kali ini berada di meter Band 40 dan 80 Band.  Nah ditu seperti dihari kemarin saya menglog dimulai jam 10 Kurang hingga Jam 11 Malam. Nah distu kami ngelog sampai kelelahan higga kami disuruh istirahat dulu dan smapai belum Mengirimkan Catatan Log ke Mas Risky untuk di Cross Cek.

    Nah seperti yang saya janjikan kemarin saya akan menjelaskan aplikasi yang saya gunakan untuk Logger di Linux. Nah aplikasinya dalah CQRLOG. QRLOG adalah logger radio ham canggih berdasarkan pada database MySQL. Menyediakan kontrol radio berdasarkan pustaka hamlib (saat ini mendukung 140+ jenis dan model radio), koneksi klaster DX, buku telepon online, grayliner, dukungan manajer basis data QSL internal dan algoritma berbasis negara yang paling akurat pada tabel negara yang dikembangkan oleh OK1RR. 

    CQRLOG ditujukan untuk pencatatan umum harian kontak HF, CW & SSB dan sangat terfokus untuk pengoperasian dan pemeliharaan yang mudah. Lebih detail di Tentang bagian. Anda dapat menulis ulasan Anda sendiri tentang CQRLOG untuk Linux di eHam.net.

    CQRLOG 2.3.0 telah dirilis. Setelah hampir setengah tahun, kami memiliki rilis baru! Changelog sangat panjang, sebagian besar perubahan dilakukan oleh Saku, OH1KH. Kami juga memiliki kontributor baru - Jonas, SM2VSD yang memperbaiki beberapa bug dan menambahkan beberapa fitur baru. Saku melakukan banyak perbaikan untuk antarmuka WSJT, kontrol TRX dan klaster DX. Saya menambahkan dukungan satelit bersama dengan mode propagasi dan pembaruan otomatis untuk file keanggotaan.

    CQRLOG

    CQRLOG

    D. Penutup
    Nah sekian pengalaman saya , saya hanya bisa menjelaskan sedikit. (-_-)

    Waalaikumsalam Wr. Wb. 

    Saturday, August 25, 2018

    DayliLife85 | ORARI | Event Special Call ORARI Lokal Klaten | Mukti911 | #1


    Assalamualaikum Wr. Wb.
    A. Pendahuluan
    Nah kali ini aku akan share pengalamanku ikut menjadi tim IT di Event Special Call ORARI Local Klaten. Berikut ini adalah sekilas kegiatanku.

    B. Waktu Pelaksanaan

    • 18:00 - Selesai

    C. Hal Yang Disampaikan
    Nah Hari ini saya menjadi logger di Event Sepecial Call ORARI Local Klaten dimana seperti yang dirapatkan dihari kemarin di Hari Kamis. Nah Di Artikel sebelumnya yang berkalian dengan ORARI aku menjelaskan bahwa aku mengunakan aplikasi untuk Logger.

    Ini kau akan Menjelaskan kegiatanku hari ini, Aku hari ini sudah mempersiakan diri untuk ikut Event. Seperti yang di jadwalkan kemarin Tim IT di bagi menjadi 2 Tim dimana Tim 1 yaitu Saya Firmanysah Mukti Wijaya , Achmad Afdholul Faathin, dan Didan Layung Sena sedangkan Tim 2 Yaitu Mas Risky , Nanda Fajar Setiawan, Choirul Septiono. Nah kami datang ke masing masing station dengan transportasi dari Pak Narwanto selaku Ketua Pelaksana Event.

    Nah 2 Tim in dikirim ke masing masing Station dan ternyaa saya berada di Station miliknya Pak Narwanto, Nah sesampainya disana kami di brefeing dahulu bagaimana nantinya untuk peng og annya. Lalu Event dibuka sekitar jam setengah 8 kurang. Disitu kami ngelog sampai malam kira kira sampai jam 11 Malam. Kami bertiga saat itu mengelog semua jadi dari kami banyak yang agak paham nah lalu kali diajak Pergi ke station yang ada Tim 2nya disana kami CroosCek untuk dat log apakah ada yang salah.

     Disana saya mendengarkan perbincangan untuk pengaturan event yanga kan dilanjutkan di hari esok. Nah disaat itu aku tidak sadar ternyata kami juga mendapatkan atribut Tim Event Special Call ORARI Lokal Klaten. Setelah Crosscek jadi kami langsung foto dokumentasi lalu pulang ke Station Pak Nurwanto Lagi.

    D. Penutup
    Sekian pengalaman yang saya lakukan selama hari ini. untuk aplikasi Loggernya akan saya jelaskan di artikel selanjutnya.


    Waalaikumsalam Wr. Wb. 

    Python Again > Ha l yang perlu diperhatikan di Python ? | #Part2 |Mukti911


    A. Pendahuluan
    Mungkin dari kalian udah ada yag baca artikel sebelumnya milik saya memang benar Python adalah bahasa pemroraman yang sangat sederhana. Setelah mempersiapkan segala perlengkapan untuk coding python dan mengetahui cara membuat program python, selanjutnya mari kita pelajari tentang aturan-aturan penulisan sintaks Python yang harus dipatuhi.

    B. Latar Belakang
    Python memang sangat simple tapi juga gak sesimple itu maka dari itu ada yang perlu diperhatikan di koding Pythin.

    C. Maksud & Tujuan
    Agar dapat mengetahui dan memahami hal yang perlu diperhatikan di Python.

    D. Pembahasan
    “Bagaimana kalau tidak dipathui?” Resikonya bisa terjadi error. Pada artikel ini, saya akan membahas beberapa aturan dasar penulisan sintaks Python yang harus diketahui. Agar nanti mudah dalam menulis program. Apa saja aturan-aturannya?

    Penulisan Statement Python. Statement adalah sebuah intruksi atau kalimat perintah yang akan dieksekusi oleh komputer.
    Contoh:
    print("Hello World!")
    nama = "Mukti911"
    Penulisan satu statement tidak diakhiri dengan tanda titik-koma. Sedangkan, bila kita ingin menulis lebih dari satu statement dalam satu baris, maka kita harus memisahnya dengan titik-koma.
    Contoh:
    print("Hello"); print("World"); print("Tutorial Python untuk Pemula")
    nama_depan = "Mukti"; nama_belakang = "911"
    Tapi… Menurut beberapa style guide python, tidak dianjurkan menulis lebih dari satu statement dalam satu baris. Karena akan sulit dibaca.

    Penulisan String pada Python. String adalah teks atau kumpulan dari karakter. String dalam pemrograman biasanya ditulis dengan dibungkus menggunakan tanda petik. Bisa menggunakan tanda petik tunggal maupun ganda.
    Contoh:
    judul = "Belajar Pemrograman Python sampai Bisa"
    penulis = 'Mukti911'
     Atau kita juga bisa menggunakan triple tanda petik.
    Contoh:
    judul = """Belajar Python dengan Cepat"""
    penulis = '''Mukti911'''
    Penuilsan Case pada Python. Sintak Python bersifat case sensitive, artinya teksini dengna TeksIni dibedakan.
    Contoh:
    judul = "Belajar Dasa-dasar Python"
    Judul = "Belajar Membuat Program Python"
    Antara variabel judul dengan Judul itu dibedakan…
    Case Style Menurut rekomendasi style guide Google, berikut ini contoh penulisan case yang disarankan:
    ## Snake Case digunakan pada:
    module_name, package_name, method_name, function_name, , global_var_name, instance_var_name, function_parameter_name, local_var_name.
    ## CamelCase digunakan Pada:
    ClassName, ExceptionName
    ## ALL CAPS digunakan Pada:
    GLOBAL_CONSTANT_NAME
    Penulisan Blok Program Python Blok program adalah kumpulan dari beberpaa statement yang digabungkan dalam satu blok. Penulisan blok program harus ditambahkan indentasi (tab atau spasi 2x/4x). Blok Program

    Contoh yang benar:
    # blok percabangan if
    if username == 'petanikode':
        print("Selamat Datang Admin")
        print("Silahkan ambil tempat duduk")
    # blok percabangan for
    for i in range(10):
        print i
    Contoh yang salah:
    # blok percabangan if
    if username == 'petanikode':
    print("Selamat Datang Admin")
    print("Silahkan ambil tempat duduk")
    # blok percabangan for
    for i in range(10):
    print i
    Ada beberapa macam blok program:

    • Blok Percabangan
    • Blok Perulangan
    • Blok Fungsi
    • Blok Class
    • Blok Exception
    • Blok With

    E. Kesimpulan
    Nah jadi tiu adalah beberapa hal yang perlu diperhatikan dalam penulisan kode Python.

    F. Referensi

    • -

    Friday, August 24, 2018

    Python Again > Apa itu Python ? | #Part1 |Mukti911


    A. Pendahuluan
    Nah kali ini aku kan membahas tentang Python, tapi mungkin kalian binggung apa itu Python. Nah Python ini bukan yang ular itu tapi ini bahasa pemrograman. Mungkin dari kalian banyak yang bertanya tanya. 

    B. Latar Belakang
    Karena Python adalah bahasa pemrograman yang populer saat ini yang code programnya samgat simple sekali.

    C. Maksud & Tujuan
    Agar dapat memahami dan mengimplementasian kode python untuk pembuatan aplikasi nantinya.

    D. Pembahasan
    Python merupakan bahasa pemrograman tingkat tinggi yang diracik oleh Guido van Rossum. Python banyak digunakan untuk membuat berbagai macam program, seperti: program CLI, Program GUI (desktop), Aplikasi Mobile, Web, IoT, Game, Program untuk Hacking, dsb. Python juga dikenal dengan bahasa pemrograman yang mudah dipelajari, karena struktur sintaknya rapi dan mudah dipahami. (Python bagus untuk pemula yang belum pernah coding)

    Nah yang membuat Python banyak disukai ya karena ython memang sangat sederhana dibandingkan bahasa yang lainnya. Tidak perlu ini dan itu untuk membuat program. Bahkan tagline di websitenya menjelaskan, kalau python akan membuatmu bekerja lebih cepat dan efektif.

    Jadi kenapa kita harus belajar Python ya kerena Python adalah bahasa pemrograman yang trbaik untuk orang awam sekalipun. Persiapan Alat untuk Belajar Pemrograman Python Apa saja alat-alat yang harus dipersiapkan untuk belajar pemrograman python? Python: Interpreter yang menerjemahkan bahasa python ke bahasa mesin, sehingga program bisa dijalankan. Teks Editor/IDE: Program yang digunakan untuk menulis kode. Bagaiaman cara install Python? Bagi pengguna Linux, Python tidak perlu diinstal. Karena Sebagian besar distro Linux sudah menyediakannya secara default. Untuk mengeceknya, silahkan ketik perintah python --version di terminal.

    Mengenal Mode Interaktif Python, Mode interaktif merupakan fasilitas/fitur yang disediakan oleh Python sebagai tempat menulis kode secara interaktif. Fitur ini dikenal juga dengan Shell, Console, REPL (Read–Eval–Print Loop), interpreter, dsb. Cara membuka mode interaktif adalah dengan mengetik perintah python pada terminal.

    Tanda >>>, artinya python siap menerima perintah. `Terdapat juga tanda ... yang berarti secondary prompt atau sub prompt, biasanya muncul saat membuat blok kode dan menulis perintah tunggal dalam beberapa baris. Mari kita coba memberikan perintah print, perintah ini berfungsi untuk mencetak teks ke layar. Cobalah tulis print "Hello World" kemudian tekan Enter.
    mukti@911-X453MA:~$ python
    Python 2.7.15rc1 (default, Apr 15 2018, 21:51:34)
    [GCC 7.3.0] on linux2
    Type "help", "copyright", "credits" or "license" for more information.
    >>> print("Hello, World")
    Hello, World
    >>> 
    Perintah yang kita tulis langsung dieksekusi dan ditampilkan hasilnya. Inilah mode interaktif, setiap kode atau perintah yang diketik akan direspon langsung oleh python. Kita bisa memanfaatkan mode interaktif ini untuk: Uji coba suatu fungsi; Eksperimen modul tertentu; Kalkulator; Mencari bantuan tentang fungsi tertentu; dll. Hal yang perlu kita coba adalah mencari bantuan tentang fungsi tertentu, karena akan membantu sekali dalam mempelajari python.

    E. Kesimpulan
    Python adalah bahasa pemrograman yang sangat simple dan sangat rekomendasi sekali bagi orang yang masih awam di Coding.

    F. Referensi

    • -

    Thursday, August 23, 2018

    How To | Membuat System Login Dengan PHP dan MySQLi | Mukti911 | Part4

    A. Pendahuluan
    pada kali ini aku akan membuat sebuah artikel yaitu tentang Login System dengan PHP dan Mysqli. Nah Berikut ini adalah artikel tentang Membuat Login System dengan PHP dan Mysqli.

    B. Latar Belakang
    Karena untuk membangun suatu system login dengan coding web.

    C. Maksud & Tujuan
    Agar dapat membuat sebuah login system dengan coding web.

    D. Waktu Pelaksanaan

    • Tergantung Individu

    E. Pembahasan
    Melajutkan tutorial dihari kemarin saya akn memulainya dengan membuat laman Admin. Membuat Halaman Admin Seperti yang kalian lihat pada syntax sebelumnya. saat melakukan pengecekan, jika username dan password benar, maka halaman akan kita alihkan ke halaman admin yang berada dalam folder admin. jadi sekarang kita buat sebuah folder baru dengan nama ‘admin’.

    setelah membuat folder admin, buat sebuah le baru lagi dengan nama index.php. pada index.php ini kita akan membuat halaman sederhana untuk admin. admin/index.php.
    <?php
    session_start();
    if ($_SESSION['Status'] !=="login") {
    header("Location:../index.php?info=notlogin");
    }
    ?>
    <!DOCTYPE html>
    <html>
    <head>
    <title>Mukti911 - Tutorial</title>
    <style type="text/css">
    body {
    background-image: linear-gradient(to right top, #161616, #623954, #c95863, #ff9c3f, #ffff00);
    min-height: 676px;
    margin: 0px;
    font-family: arial;
    }
    .all {
    width: 1200px;
    height: 500px;
    position: relative;
    top: 100px;
    margin: 0 auto;
    }
    .img {
    width: 200px;
    height: 200px;
    background-color: #fff;
    margin: 0 auto;
    border-radius: 50%;
    }
    .inf {
    width: 1200px;
    height: 300px;
    padding: 20px 0px;
    }
    .pro {
    width: 600px;
    height: 150px;
    background-color: #758;
    margin: 0 auto;
    border-radius: 10px;
    }
    .success {
    width: 1200px;
    height: 100px;
    margin: 40px 0px;
    }
    .success h1 {
    text-align: center;
    font-size: 60px;
    padding: 10px;
    }
    table {
    width: 400px;
    height: 150px;
    padding: 30px 20px;
    float: left;
    }
    td {
    color: #fff;
    }
    a {
    float: right;
    width: 100px;
    background-color: #fff;
    font-size: 30px;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    border-radius: 10px;
    position: relative;
    top: 100px;
    }
    </style>
    </head>
    <body>
    <div class="all">
    <div class="img"></div>
    <div class="inf">
    <div class="pro">
    <table>
    <tr>
    <td>Fullname</td>
    <td>:</td>
    <td><?php echo $_SESSION['FullName']; ?></td>
    </tr>
    <tr>
    <td>Username</td>
    <td>:</td>
    <td><?php echo $_SESSION['Username']; ?></td>
    </tr>
    <tr>
    <td>Password</td>
    <td> :</td>
    <td><?php echo $_SESSION['Password']; ?></td>
    </tr>
    <tr>
    <td>Date Time Of Login</td>
    <td> :</td>
    <td><?php echo $_SESSION['Date']; ?></td>
    </tr>
    </table>
    <a href="logout.php">Logout</a>
    </div>
    <div class="success">
    <h1>Login Successfully</h1>
    </div>
    </div>
    </div>
    </body>
    </html>
    • Logout

    <?php
    session_start();
    session_destroy();
    header("location:../index.php?info=logout");
    ?>
    Jika dicoba nantinya kan terlihat seperti berikut :

    F. Hasil yang didapat

    • Dapat membuat sebuah system login sederhana.

    G. Kesimpulan
    Jadi sebenarnya simple sekali cara pembuatannya untuk login system namun yan perlu diingat bagian yang penting adalah pada bagian form session databse dan kondisi.

    H. Referensi

    • -

    Wednesday, August 22, 2018

    How To | Membuat System Login Dengan PHP dan MySQLi | Mukti911 | Part3


    A. Pendahuluan
    pada kali ini aku akan membuat sebuah artikel yaitu tentang Login System dengan PHP dan Mysqli. Nah Berikut ini adalah artikel tentang Membuat Login System dengan PHP dan Mysqli.
    B. Latar Belakang
    Karena untuk membangun suatu system login dengan coding web.

    C. Maksud & Tujuan
    Agar dapat membuat sebuah login system dengan coding web.

    D. Waktu Pelaksanaan

    • Tergantung Individu

    E. Pembahasan
    Pada tutorial Part 1 dan 2 kita telah sampai pada cara membuat koneksi database nya. sekarang kita akan melanjutkannya dengan membuat halaman login sederhana untuk admin. selanjutnya akan di jelaskan secara bertahap agar lebih mudah untuk kalian pahami. buat sebuah le baru lagi dengan nama index.php.
    Kalian hanya perlu menambahkan kodingan seperti berikut pada file Index.php itu
    • Tambahkan Kodingan di paling atas.

    <?php
    if(isset($_GET['info'])){
    if($_GET['info'] == "failed"){
    $Info =  "Login Gagal! Username Password Salah. (-_-)";
    }else if($_GET['info'] == "logout"){
    $info =  "Anda telah berhasil logout. (-_-)";
    }else if($_GET['info'] == "notlogin"){
    $info = "Anda harus login untuk mengakses halaman admin. (-_-)";
    }
    else {
    $info = "Silahkan Login Gan !!!. (-_-)";
    }
    }
    else {
    $info = "Silahkan Login Gan !!!. (-_-)";
    }
    ?>
    • Tambahkan pada bagian body dengan ketentuan seperti berikut ini :

    <body>
    <div class="s">
    <h1>Login System</h1>
    <h4>Mukti911 - Tutorial</h4>
    <h5><?php echo $info; ?></h5>
    </div>
    <div class="a">
    <div></div>
    <form method="post" action="log.php">
    <input type="text" name="" placeholder="Username">
    <input type="password" name=""placeholder="Password">
    <button>LOGIN</button>
    </form>
    </div>
    </body>
    • Lalu tambahkan style pada h5

    h5 {
    font-size: 20px;
    }
    nah di file index.php ini kita membuat halaman login sederhana untuk admin.  kita lanjutkan lagi dengan membuat file yang akan mengelola data yang di kirim dari form login dari index.php. pada le index.php yang membuat halaman login di atas kita telah menetapkan aksi dari form ini adalah ‘log.php’ dengan method ‘post’ untuk jenis pengiriman datanya. buat sebuah le baru lagi dengan nama log.php.

    <?php
    session_start();
    include_once 'connect.php';
    $Username =  $_POST['Username'];
    $Password =  $_POST['Password'];
    $sql "SELECT * FROM user WHRE Username='$Username' AND Password='$Password'";
    $query = mysqli_query($Connect,$sql);
    $Check = mysqli_num_rows($query);
    if ($cek > 0) {
    $_SESSION['Username'];
    $_SESSION['Info'];
    header("Location:admin/index.php");
    }
    else {
    header("Location:index.php?info=failed");
    }
    ?>
    Perhatikan baik baik pada bagian session. kita aktifkan dulu session php. karena kita menggunakan session sebagai penanda status pengguna yang akan login.  kita mengaktifkan session php dengan syntax berikut kemudian jangan lupa juga untuk menghubungkannya dengan le koneksi database yang sudah kita buat.kemudian menangkap data yang dikirim dari form login.

    kemudian kita seleksi data admin yang memiliki username dan password yang sesuai dengan yang di input pada form login. selanjutnya kita hitung jumlah record yang sesuai (yang sesuai dengan username dan password yang di input).

    jika data username dan password admin di temukan di tabel ‘user’, maka nilai dari variabel $Cheack adalah jumlah dari record yang di temukan. berarti variabel $cek bernilai 1 jika username dan password yang di input sesuai dengan yang ada di database. karena fungsi mysqli_num_rows() berfungsi untuk menghitung jumlah record hasil dari query yang ada dalam parameter si fungsi mysqli_num_rows() ini.

    selanjutnya kita cek dengan if else jika variabel $cek lebih besar dari nol (berarti username dan password yang di input sesuai), maka kita buat session username dan session status seperti pada syntax berikut. kemudian kita alihkan ke folder admin/index.php. jika tidak maka kita alihkan halamannya kembali ke halaman login (index.php) sambil mengirimkan data pesan (?info=failed). tu sebabnya di le index.php (halaman login) kita membuat pengecekan seperti berikut (perhatikan pada le index.php)ini untuk memeriksa pesan yang di kirim. 

    karena tadi jika username dan password tidak di temukan, akan dikirimkan pesan “gagal”. pada pengecekan noti kasi ini kita akan menampilkan pesan notikasi “Login gagal! username dan password salah!” jika username dan password gagal. begitu juga seterusnya dengan pesan logout dan belum_login yang akan kita buat pengalihannya sebentar lagi.

    F. Hasil yang didapat

    • Dapat mengetahui proses SESSION terjadi di Login System

    G. Kesimpulan
    Jadi element penting dari Login System Sederhana yaitu If Else / Kondisi lalu Session dan Yang apstinya Form.

    H. Referensi

    • -

    Monday, August 20, 2018

    How To | Membuat System Login Dengan PHP dan MySQLi | Mukti911 | Part2


    A. Pendahuluan
    pada kali ini aku akan membuat sebuah artikel yaitu tentang Login System dengan PHP dan Mysqli. Nah Berikut ini adalah artikel tentang Membuat Login System dengan PHP dan Mysqli.

    B. Latar Belakang
    Karena untuk membangun suatu system login dengan coding web.

    C. Maksud & Tujuan
    Agar dapat membuat sebuah login system dengan coding web.

    D. Waktu Pelaksanaan
    • Tergantung Individu
    E. Pembahasan
    Dalam pembuatan suatu login system mengunakan coding hml. Hal yang pertama harus di siapkan yaitu membuat suatu Tampilan Layout dengan HTML dan CSS. Nah ditutorial sebelumnya kan saya sudah membuat interface untuk Halaman Loginnya. Untuk memulai tutorial dan project membuat login dengan PHP dan MySQLi seperti di contoh ini, silahkan buat sebuah folder baru dengan nama login pada direktori localhost kalian.
    • Buat sebuah database baru dengan nama loginsystem. kemudian buat sebuah tabel baru dengan nama user. isi dari tabel admin yaitu Num, Username, Password dan FullName. Dimana Num bertipe int, pilih primary dan centang auto_increment nya. Username, Password dan FullName sama-sama bertipe varchar dengan nilai sesuka kalian.
    Create New Database
    Create New Table in Database

    Content Table

    Hasil Dari Create Content Table
    selanjutnya isikan data admin. untuk data contoh saja. untuk contoh akun admin yang akan login. isikan username nya ‘Mukti’, dan password nya ‘123456’ dan FullName Firmansyah Mukti Wijaya.

    Insert Data
    Hasil Insert Data

    persiapan di database selesai.

    Langkah selanjutnya dalah Membuat Konesi ke database. tujuannya agar Project PHP yang kita buat bisa terhubung dengan database.Untuk cara membuat koneksi database dengan PHP dan MySQL, saya telah membahas nya. Buat sebuah le baru dengan nama koneksi.php dan simpan pada folder login yang telah kita buat.

    • koneksi.php

    <?php
    $servername = "localhost";
    $username = "mukti911";
    $password = "password";
    $database = "password";
    $conn = mysqli_connect($servername, $username, $password, $database);
    if (!$conn) {
        die("Connection failed: " . mysqli_connect_error());
    }
    echo "Connected successfully";
    ?>
    sampai di sini koneksi database php dan mysqli telah selesai kita buat. Selanjutnya akan kita buat halaman login sederhana untuk tempat admin memasukkan username dan password. kemudian di alihkan ke halaman admin.

    H. Hasil yang didapat

    • Dapat membuat sebuah koneksi ke database untuk membuat system login

    I. Kesimpulan
    Jadi untuk membuat sebuah System Login dibutuhkan sebuah database untuk user yang akan login lalu membuat sebuah jalur koneksi ke database.

    J. Referensi

    • -

    Sunday, August 19, 2018

    How To | Membuat Interface System Login Dengan HTML dan CSS | Mukti911 | Part1


    A. Pendahuluan
    pada kali ini aku akan membuat sebuah artikel yaitu tentang membuat sebuah tampilan untuk Login System. Nah nantinya diharapkan Interface ini dapat digunakan Sebagai Interface Login System yang akan dibangun dengan PHP dan Mysqli. Nah Berikut ini adalah artikel tentang cara membuat Interface Login System.

    B. Latar Belakang
    Karena suatu system login membutuhkan antarmuka untuk User dan System.

    C. Maksud & Tujuan
    Agar nantinya Interface ini dapat menjadi Penghubung antara System Login dan User.

    D. Waktu Pelaksanaan

    • Tergantung Individu.

    E. Pembahasan

    Dalam pembuatan suatu login system mengunakan coding. Hal yang pertama harus di siapkan yaitu membuat suatu Tampilan Layout dengan HTML dan CSS. Nah berikut ini adalah contoh Cara pembuatan Antarmukanya.

    Pertama buat file baru dengan nama index.html. Lalu tulis kan Coding Seperti berikut :
    <!DOCTYPE html>
    <html>
    <head>
    <title>Mukti911 - Tutorial</title>
    <style type="text/css">
    body {
    background-image: linear-gradient(to right top, #00ff37, #00e1b6, #00baff, #0087ff, #2100ff);
    min-height: 675px;
    margin: 0px;
    }
    div.s {
    width: 800px;
    height: 200px;
    float: left;
    position: relative;
    top: 100px;
    left: 100px;
    padding: 150px 0px;
    }
    div.a {
    position: relative;
    border-radius: 20px;
    top: 100px;
    float: right;
    right: 100px;
    width: 300px;
    height: 500px;
    background-color: #000000aa;
    }
    div.a div {
    width: 150px;
    height: 150px;
    background-color: #fff;
    margin: 70px auto 0px auto;
    border-radius: 50%;
    }
    h1 {
    font-size: 120px;
    font-family: arial;
    margin: 0px;
    }
    h4 {
    font-size: 50px;
    font-family: arial;
    margin: 0px;
    }
    form {
    width: 250px;
    margin: 20px 25px 100px 25px;
    height: auto;
    }
    form input[type=text], form input[type=password]{
    width: 200px;
    padding:20px 25px;
    background-color: transparent;
    border: none;
    text-align: center;
    font-size: 20px;
    color: #fff;
    }
    button {
    width: 250px;
    border-radius: 10px;
    color: #000;
    padding:20px 25px;
    margin: 0px auto;
    background-color: #fff;
    border: none;
    text-align: center;
    font-size: 20px;
    font-family: arial;
    }
    </style>
    </head>
    <body>
    <div class="s">
    <h1>Login System</h1>
    <h4>Mukti911 - Tutorial</h4>
    </div>
    <div class="a">
    <div></div>
    <form>
    <input type="text" name="" placeholder="Username">
    <input type="password" name=""placeholder="Password">
    <button>LOGIN</button>
    </form>
    </div>
    </body>
    </html>
    Codingan Tersebut akan menghasilkan tampilan seperti berikut :

    Nah berikut ini adalah penjelasannya :
    <!DOCTYPE html>
    <html>
    <head>
    <title>Mukti911 - Tutorial</title>
    </head>
    <body>
    <div class="s">
    <h1>Login System</h1>
    <h4>Mukti911 - Tutorial</h4>
    </div>
    <div class="a">
    <div></div>
    <form>
    <input type="text" name="" placeholder="Username">
    <input type="password" name=""placeholder="Password">
    <button>LOGIN</button>
    </form>
    </div>
    </body>
    </html>
    Pada bagian codingan diatas Seperti yang terlihat Codingan ini mengunakan HTML. Berikut adalah penjelasan tag tag nya dan atributnya :

    • <html> untuk memulai membuat codingan HTML.
    • <title> untuk menambahkan informasi nama dari Halaman File Jika File ini nantinya akan dibuka di Browser.
    • <head> untuk mendefinisikan beberapa informasi kepala yang ada di halaman ini.
    • <body> adalah tempat untuk menaruh suatu tatanan Layout dari Login System Tadi.
    • <div> adalah suatu tag yang tidak memiliki style default namun div dapat diberi style dengan atribut dan CSS.
    • <h1> dan <h4> adalah tag yang digunakan untuk header.
    • <form> form adalah suatu tag yang dimana untuk merepresentasikan sebuah form isian.
    • <input> digunakan untuk membuat kolom isian di form.
    • <button> digunakan untuk membuat sebuah tombol.
    Lalu untuk Codingan yang Bagian ini untuk menampung style style untuk Halaman :
    <style type="text/css">
    body {
    background-image: linear-gradient(to right top, #00ff37, #00e1b6, #00baff, #0087ff, #2100ff);
    min-height: 675px;
    margin: 0px;
    }
    div.s {
    width: 800px;
    height: 200px;
    float: left;
    position: relative;
    top: 100px;
    left: 100px;
    padding: 150px 0px;
    }
    div.a {
    position: relative;
    border-radius: 20px;
    top: 100px;
    float: right;
    right: 100px;
    width: 300px;
    height: 500px;
    background-color: #000000aa;
    }
    div.a div {
    width: 150px;
    height: 150px;
    background-color: #fff;
    margin: 70px auto 0px auto;
    border-radius: 50%;
    }
    h1 {
    font-size: 120px;
    font-family: arial;
    margin: 0px;
    }
    h4 {
    font-size: 50px;
    font-family: arial;
    margin: 0px;
    }
    form {
    width: 250px;
    margin: 20px 25px 100px 25px;
    height: auto;
    }
    form input[type=text], form input[type=password]{
    width: 200px;
    padding:20px 25px;
    background-color: transparent;
    border: none;
    text-align: center;
    font-size: 20px;
    color: #fff;
    }
    button {
    width: 250px;
    border-radius: 10px;
    color: #000;
    padding:20px 25px;
    margin: 0px auto;
    background-color: #fff;
    border: none;
    text-align: center;
    font-size: 20px;
    font-family: arial;
    }
    </style>

    Nah kodingan diatas adalah kodingan yang mengubah tampilan yang sebelumnya flat di HTML menjadi lebih baik. Nah berikut ini adalah beberapa penjelasannya :
    • background-image: linear-gradient(to right top, #00ff37, #00e1b6, #00baff, #0087ff, #2100ff);. Codigan ini digunakan untuk menambahkan backgrountd pada tag yang ada.
    • width dan height digunakan untuk memberikan ukuran panjang dan lebar.
    • margin dan padding : digunakan untuk memberikan jarak content dari luar dan dalam.
    • float yaitu untuk membuat sebuah perataan dari tag yang diberi kodingan ini.
    • position yaitu digunakan untuk mengatur posisi dari tag.
    • top, bottom, left, right digunakan untuk memindahkan tag dari beberapa sisi tersebut.
    • border-radius digunakan untuk mengatur sudut dari tag.
    • font-size mengatur unturan font
    • font-family mengatur bentuk dari tulisan
    • text-align untuk mengatur perataan text.
    Nah berikut adalah contoh pembuatan Interface Login System.
     
    I. Kesimpulan

    • Interface Login Juga tetap bisa dibuat menarik meskipun hanya dengan HTML CSS

    J. Referensi

    • -