Tuesday, March 27, 2018

TUTORIAL MEMBUAT HALAMAN LOGIN DARI AWAL SAMPE AKHIR

  Author : taufikdian17     No comments
8:52 PM

Spesial buat postingan kali ini akan di bahas dari awal sampe akhir guys masalah membuat halaman login. Semoga postingan ini bisa membantu kalian dalam pembuatan halaman login yang baik standar industri guys.. langsung saja, pertama kalian harus memiliki tool dan bahan-bahan nya guys.
1. Bacalah doa terlebih dahulu
2. instal Neatbens versi berapapun
3. Instal XAMPP klo bisa versi terbaru
4. kalian harus punya web browser
5. bahan-bahan nya Guys. bisa download disini.

Contoh halaman Login

Pertama-tama kalian klik buka Neatbens
1. buat projek baru => pilih php => beri nama projek mu dan pilih PHP versi tertinggi => kemudian next sampai akhir.
2. jalankan XAMPP nya. pilih start pada Apache dan MySQL, sampai muncul tulisan Stop

3. kalian masuk ke Neatbens nya. kemudian kalian klik pada index.php karena nanti kita kan berfokus di situ untuk membuat login nya.
4. membuat folder assets : pilih Source File => New => Folder => berinama assets
5.  di dalam folder assets terdapat folder lagi yaitu js. images. css. kalian buat dulu folder tersebut dalam folder asset cara nya sama seperti di atas klik kanan di folder assets => New => Folder => berinama.

Posted by
Read More

TUTORIAL MEMBUAT MODAL (Alert dan Dialog) di WEB

  Author : taufikdian17     No comments
5:32 AM



Hay guys.. kali ini masih di form login yaa. tapi beda dari yang kemaren sekarang kita akan belajar bagaimana ketika kita salah memasukan username dan password kemudian password

Cara Memberi Gagal Login Setelah 3 Kali Salah Password

pastikan kalian sudah mengikuti tutorial ini dari awal yaa guys..
buat lah file PHP nya dulu cara nya
 klik panda Source file -> new -> PHP file.
 Nah setelah kalian buat PHP file nya sekarang masukan Source Code seperti dibawagh ini



ini yang sangat penting guys.. pada $user dan $pass harus sama pada name kolom username dan password nya. seperti dibawah ini.


1.      Nah langkah yang terahir tinggal uji coba

Cara Membuat Modal dan Alert

Sekarang dilanjutin lagi bagaimana shi membuat modal Boss.. Cara nya gampang bangt Guys.. Langsung aja. Ketikan Dulu  Source code dibawah ini guys di bawah </form>


Setelah kalian Menulis Source code nya Kemudian Kalian Lanjut membuat Button Untuk Modal Di bawah Login yaa.


Sekarang Tinggal Membuat Alert nya yaa
Pertama kalian membuat fungtion nya terlebih dahulu


Sekarang membuat Alert nya guys.. seperti di bawah ini

Sekarang kalian coba Hasilnyaa..
Gimna guys mudah kan. Semoga tutorial kali ini bermanfaat ya guys. seperti biasa bias ajika ada pertanya atau permasalah bisa komen langsung dibawah yaa.. Seee Youuuu….



ALGORITMA
  1. User Login dengan Username dan Password.
  2. Simtem akan mengecek User salah atau benar.
  3. jika benar akan masuk ke halaman utama.
  4. jika gagal maka anakan muncul peringatan 1.
  5. login ke dua Maka akan muncul peringatan sudah salah 2 kali.
  6. login ke tiga jika masih gagal maka akan muncul bahwa akun anda sudah terblokir.

PSEODOCODE

-          User à Inemail
-          pass à inpass
-          dbuser  à admin@gmail.com
-          dbpass à 1234567
-          if à user = admin@gmail.com dan pass= inpass , $_SESSION["gagal"] = 0 ,  masuk ke index.php.
-          else        à If SESSION gagal maka  SESSION  gagal ++
-                          à else SESSION gagal = 1
-                          à Location index.php
-          if à SESSION gagal >= 3

-          Echo “AKUN TERBLOKIR”



FLOWCHART



Posted by
Read More

Wednesday, March 14, 2018

TUTORIAL MEMBERI ALERT PADA HALAMAN LOGIN MENGGUNAKAN JAVA SCRIPT

  Author : taufikdian17     No comments
4:13 AM



halloo gays. kembali lagi di tutorial WEB. ayo mari kita belajar Bersama-sama. supaya pintar Bersama-sama, dan sukses Bersama-sama. tutorial ini melanjutkan tutorial yang kemaren yaa guys. jika kalian waktu membuka browser langsung ketemu halaman ini sebaiknya kalian cari dulu tutorial dari saya seblum ini. yaitu membuat halaman login. nah dari halaman login yang kemaren,  akan saya tambahin bagaimana memberi alert dengan java scrip. pernah kan kalian saat login suatu website apa aja dan kalian s memasukan username dan password halaman web tersebut memberi peringatan seperti “Selamat datang exemple@ml.com “.

1. sudah memliki halaman login, jika belumm anda bisa klik disini, dan coba anda pelajari terlebh dahulu halaman tersebut.

2. disini saya menggunakan Xampp buat web server local.

3. dan jangan lupa saya juga menggunakan aplikasi dari netbean.

4. taro script di dalam< head>

5. tambahkan onclick di button nya

6. Save dan reload, dan buka di browser


Terima kasih yang sudah membaca tutorial kali ini semoga bermanfaat. jika kalian masih kesulitan atau kurang paham silahkan komen di bawah aja, atau mungkin mau sayang bahas tutorial yang lain. sangat bisa.. See you guys.......


Posted by
Read More

Tuesday, March 6, 2018

Cara Membuat Halaman Login

  Author : taufikdian17     No comments
7:47 AM

Masih di Sini untuk belajar Web. kali ini kita akan belajar bagai mana membuat halaman login yang menarik. jangan lupa saya membuat halaman login ini dengan aplikasi Netbean.

Seperti Contoh Gambar halaman login :


1. cara pertama anda harus memiliki bahan-bahas terlebih dahulu:
download disini
2. Paste Bahan di seperti dibawah ini:


3. Copy Paste source code
Nah cara membuat table seperti di atas sangat mudah banget guys. kalian bisa amati source code di bawah ini :

<!DOCTYPE html>

<html>
     <head>
        <meta charset="UTF-8">
        <title>Tugas Web</title>
        <link rel="icon" href="assets/images/login-11.ico">
        <link rel="stylesheet" href="assets/css/bootstrap.css">
        <link rel="stylesheet" href="assets/css/floating-labels.css">
    </head>
    <body>
     
        <form class="form-signin">
            <div class="text-center mb-4">
                <img class="mb-1" src="assets/images/login-11.ico" width="75" height="75">
            <h1 style="color: blue">WELCOME</h1>
            </div>
            <div class="form-label-group">
                <input class="form-control" type="email" id="inputEmail" placeholder="Email Address" autofocus="yes"
                   autocomplete="no" required="yes">
                <label for="inputEmail">Email Address</label>
            </div>
            <div class="form-label-group">
                <input class="form-control" type="password" id="inputpassword" placeholder="Password" required="yes">
                <label for="inputpassword">Password</label>
                </div>
            <div class="checkbox mb-3">
                <label>
            <input type="checkbox"> Remeber Me ?
                </label>
            </div>
            <button type="submit" class="btn btn-lg btn-primary btn-block">SIGN IN</button>
            <p style="text-align: center"><a href="google.com">Lupa Password</p></a>
        </form>
    </body>
</html>




Semoga Postingan ini bermanfaat bagi anda yang sedang belajar Web..
kalo anda bingung silahkan coment dibawah ini..

Posted by
Read More

Belajar Membuat table di Html5

  Author : taufikdian17     No comments
6:57 AM

Belajar Table di HTML5

Kali ini kita akan belajar Bagaimana membuat table di HTML5 dengan guys.
contoh dari gambar nya di bawah ini : 

Nah cara membuat table seperti di atas sangat mudah banget guys. kalian bisa amati source code di bawah ini :

<!DOCTYPE html>
<html>
<head>
<style>
table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) {
    background-color: #dddddd;
}
</style>
</head>
<body>

<h2 style= "text-align : center"> Belajar HTML5 Table By Taufik Ismail</h2>

<table>
  <tr>
    <th style= "text-align : center">NIM</th>
    <th style= "text-align : center">NAMA</th>
    <th style= "text-align : center">JURUSAN</th>
  </tr>
  <tr>
    <td>5150411070</td>
    <td>Taufik Ismail</td>
    <td>Informatika</td>
  </tr>
  <tr>
    <td>5150411089</td>
    <td>Muhammad Rizki Perdana</td>
    <td>Informatika</td>
  </tr>
  <tr>
    <td>5150411071</td>
    <td>Febri Purnomo</td>
    <td>informatika</td>
  </tr>
  <tr>
    <td>5150411112</td>
    <td>Dwiki Likuisa</td>
    <td>Informatika</td>
  </tr>
  <tr>
    <td>5150411074</td>
    <td>Irvan Ali Nurdin</td>
    <td>Informatika</td>
  </tr>
  <tr>
    <td>5150411077</td>
    <td>Danang Sucahyo</td>
    <td>Informatika</td>
  </tr>
</table>
</body>
</html



Semoga postingan kali ini bermanfaat bagi anda yang ingin belajar membuat table dengan HTML5

Posted by
Read More
Subscribe to: Posts ( Atom )

Tentang admin