Langkah-Langkah Membuat Kalkulator Sederhana dengan Servlet

Posted by Unknown



Sebelum memulai langkah-langkah pembuatannya, anda harus memastikan bahwa netbeans anda telah terinstall dan memiliki tomcat sebagai server-nya.


Langkah Pertama :
Buat Projek baru pada netbeans, dan pilih Java Web -> Web Application , kemudian klik next



Langkah Kedua :
Buat projek tersebut dengan nama KalkulatorServlet, kemudian klik next



Langkah Ketiga :
Pilih Apache Tomcat sebagai server yang akan digunakan dengan versi Java EE5, dan pastikan context path-nya sesuai dengan nama projek. Contoh : /KalkulatorServlet . Kemudian klik finish. 



Langkah Keempat :
Buat Servlet baru dengan cara, klik kanan pada projek KalkulatorServlet > New > Servlet , dan beri nama Kalkulator dengan package servlet





Langkah Kelima :
Pastikan URL Pattern pada servlet, sama dengan nama servlet. Contoh : /Kalkulator , klik finish.




Langkah keenam :
Buka servlet kalkulator, kemudian lihat method “ProcessRequest”. Di bagian tersebut, terdapat try{}. Blok seluruh kode komentar yang terdapat dalam blok try{}, dan ganti dengan kode di bawah ini : 



out.println("<html>");
out.println("<head>");
out.println("<title>Servlet Kalkulator</title>");
out.println("</head>");
out.println("<body bgcolor=Lightpink>");
out.println("<table border='0' width='800'>");

/** Judul Kalkulator **/
out.println("<tr align='center'><td><h1><font size='7'>Kalkulator Servlet</font></h1></td></tr>");
out.println("</table>");
out.println("");
out.println("<table border='0' width='800'>"+

/** Kalkulator Aritmatika **/
"<tr>"+
"<form method='post' action='hitung'><td width='350' bgcolor=Lightskyblue>"+
"<fieldset>"+
"<center><h2>Kalkulator Aritmatika</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan 1 : "+"<input type='text' name='first' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Bilangan 2 : "+"<input type='text' name='second' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='+' name='tambah'/></td>"+
"<td align='center'><input type='submit' value='-' name='kurang'/></td>"+
"<td align='center'><input type='submit' value='x' name='kali'/></td>"+
"<td align='center'><input type='submit' value='/' name='bagi'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='%' name='mod'/></td>"+
"<td align='center'><input type='submit' value='^' name='pangkat'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil' value=''/>"+"</br></br>" +
"</td></tr>"+
"</table>"+
"</fieldset></td></form>"+

/** Kalkulator Scientific **/
"<td width='100'>&nbsp;&nbsp;&nbsp;&nbsp;</td>"+
"<form method='post' action='hitung2'><td width='350' valign='top' bgcolor=Lightskyblue>"+
"<fieldset>" +
"<center><h2>Kalkulator Scientific</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan : "+"<input type='text' name='third' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='sin' name='sin'/></td>"+
"<td align='center'><input type='submit' value='cos' name='cos'/></td>"+
"<td align='center'><input type='submit' value='tan' name='tan'/></td>"+
"<td align='center'><input type='submit' value='akar' name='akar'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='log' name='log'/></td>"+
"<td align='center'><input type='submit' value='exp' name='exp'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil2' value=''/>"+
"</td></tr>"+
"<tr><td colspan='4'>&nbsp;</td></tr>"+
"</table>"+
"</fieldset></td></form></tr></table>");

//nama kelompok
out.println("<table border='0' width='800'>");
out.println("<tr align='center'><td><h3><br>KELOMPOK SERVLET KAMI </h3>"+
        "<font size='5' face='Comic Sans MS' color='Lightseagreen'><b>"+
        "10909100059 - Dwinda Faradita <br>"+
        "10909100069 - Ardini Fitria <br>"+
        "10909100073 - Anissa Siti Rahma <br>"+
        "10909100094 - Afifah Fauziah </b></font><br><br>"+"</td></tr>");
out.println("</table>");

out.println("</body>");
out.println("</html>");





Langkah ketujuh :
Buat servlet baru seperti langkah-langkah sebelumnya (langkah 4 s/d langkah 6) ,namun perlu di perhatikan :  
nama servlet “Hitung” 
URL Pattern nya . > /hitung , klik finish.
Pada method “ProcessRequest”. Sebelum blok try{} tambahkan 

String first = request.getParameter("first");
String second = request.getParameter("second");


Blok seluruh kode komentar yang terdapat dalam blok try{}, dan ganti dengan kode di bawah ini :



out.println("<html>");
out.println("<head>");
out.println("<title>Servlet Kalkulator</title>");
out.println("</head>");
out.println("<body bgcolor=Lightpink>");
out.println("<table border='0' width='800'>");
out.println("<tr align='center'><td><h1>Kalkulator Servlet</h1></td></tr>");
out.println("</table>");
out.println("");
out.println("<table border='0' width='800'>"+
"<tr>"+
"<form method='post' action='hitung'><td width='350' bgcolor=Lightskyblue>"+
"<fieldset>"+
"<center><h2>Kalkulator Aritmatika</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan 1 : "+"<input type='text' name='first' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Bilangan 2 : "+"<input type='text' name='second' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='+' name='tambah'/></td>"+
"<td align='center'><input type='submit' value='-' name='kurang'/></td>"+
"<td align='center'><input type='submit' value='x' name='kali'/></td>"+
"<td align='center'><input type='submit' value='/' name='bagi'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='%' name='mod'/></td>"+
"<td align='center'><input type='submit' value='^' name='pangkat'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil' value='"+result+"'/>"+"</br></br>" +
"</td></tr>"+
"</table>"+
"</fieldset></td></form>"+
"<td width='100'>&nbsp;&nbsp;&nbsp;&nbsp;</td>"+
"<form method='post' action='hitung2'><td width='350' bgcolor=Lightskyblue>"+


"<fieldset>" +


"<center><h2>Kalkulator Scientific</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan : "+"<input type='text' name='third' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='sin' name='sin'/></td>"+
"<td align='center'><input type='submit' value='cos' name='cos'/></td>"+
"<td align='center'><input type='submit' value='tan' name='tan'/></td>"+
"<td align='center'><input type='submit' value='akar' name='akar'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='log' name='log'/></td>"+
"<td align='center'><input type='submit' value='exp' name='exp'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil2' value=''/>"+
"</td></tr>"+
"<tr><td colspan='4'>&nbsp;</td></tr>"+
"</table>"+
"</fieldset></td></form></tr></table>");


//nama kelompok
out.println("<table border='0' width='800'>");
out.println("<tr align='center'><td><h3><br>KELOMPOK SERVLET KAMI </h3>"+
        "<font size='5' face='Comic Sans MS' color='Lightseagreen'><b>"+
        "10909100059 - Dwinda Faradita <br>"+
        "10909100069 - Ardini Fitria <br>"+
        "10909100073 - Anissa Siti Rahma <br>"+
        "10909100094 - Afifah Fauziah </b></font><br><br>"+"</td></tr>");
out.println("</table>");


out.println("</body>");
out.println("</html>");



Langkah kedelapan :
Buat servlet baru seperti langkah-langkah sebelumnya (langkah 4 s/d langkah 6) ,namun perlu di perhatikan :  
  • nama servlet “Hitung2” 
  • URL Pattern nya .  /hitung2 , klik finish.
  • Pada method “ProcessRequest”. Sebelum blok try{} tambahkan 
                                          String third = request.getParameter("third");
  • Blok seluruh kode komentar yang terdapat dalam blok try{}, dan ganti dengan kode di bawah ini :
double thirdn = Double.parseDouble(third);
double result2 = 0;


if(request.getParameter("sin") != null) {
//    thirdn = Degrees(Radians(thirdn));
result2 = Math.sin(thirdn);
}
else if(request.getParameter("cos") != null) {
result2 = Math.cos(thirdn);
}
else if(request.getParameter("tan") != null) {
result2 = Math.tan(thirdn);
}
else if(request.getParameter("akar") != null) {
result2 = Math.sqrt(thirdn);
}
else if(request.getParameter("log") != null) {
result2 = Math.log(thirdn);
}
else if(request.getParameter("exp") != null) {
result2 = Math.exp(thirdn);
}


out.println("<html>");
out.println("<head>");
out.println("<title>Servlet Kalkulator</title>");
out.println("</head>");
out.println("<body bgcolor=Lightpink>");
out.println("<table border='0' width='800'>");
out.println("<tr align='center'><td><h1>Kalkulator Servlet</h1></td></tr>");
out.println("</table>");
out.println("");
out.println("<table border='0' width='800'>"+
"<tr>"+
"<form method='post' action='hitung'><td width='350' bgcolor=Lightskyblue>"+
"<fieldset>"+
"<center><h2>Kalkulator Aritmatika</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan 1 : "+"<input type='text' name='first' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Bilangan 2 : "+"<input type='text' name='second' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='+' name='tambah'/></td>"+
"<td align='center'><input type='submit' value='-' name='kurang'/></td>"+
"<td align='center'><input type='submit' value='x' name='kali'/></td>"+
"<td align='center'><input type='submit' value='/' name='bagi'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='%' name='mod'/></td>"+
"<td align='center'><input type='submit' value='^' name='pangkat'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil' value=''/>"+"</br></br>" +
"</td></tr>"+
"</table>"+
"</fieldset></td></form>"+
"<td width='100'>&nbsp;&nbsp;&nbsp;&nbsp;</td>"+
"<form method='post' action='hitung2'><td width='350' bgcolor=Lightskyblue>"+
"<fieldset>" +


"<center><h2>Kalkulator Scientific</h2></center>"+
"<table border='0' align='center'>"+
"<tr><td colspan='4'>"+
"Bilangan : "+"<input type='text' name='third' value='0'/>"+
"</td></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td align='center'><input type='submit' value='sin' name='sin'/></td>"+
"<td align='center'><input type='submit' value='cos' name='cos'/></td>"+
"<td align='center'><input type='submit' value='tan' name='tan'/></td>"+
"<td align='center'><input type='submit' value='akar' name='akar'/></td>"+
"</tr></tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr>"+
"<td></td>"+
"<td align='center'><input type='submit' value='log' name='log'/></td>"+
"<td align='center'><input type='submit' value='exp' name='exp'/></td>"+
"<td></td>"+
"</tr><tr><td colspan='4'>&nbsp;</td></tr>"+
"<tr><td colspan='4'>"+
"Hasil : "+"<input type='text' name='hasil2' value='"+result2+"'/>"+
"</td></tr>"+
"<tr><td colspan='4'>&nbsp;</td></tr>"+
"</table>"+
"</fieldset></td></form></tr></table>");


//nama kelompok
out.println("<table border='0' width='800'>");
out.println("<tr align='center'><td><h3><br>KELOMPOK SERVLET KAMI </h3>"+
        "<font size='5' face='Comic Sans MS' color='Lightseagreen'><b>"+
        "10909100059 - Dwinda Faradita <br>"+
        "10909100069 - Ardini Fitria <br>"+
        "10909100073 - Anissa Siti Rahma <br>"+
        "10909100094 - Afifah Fauziah </b></font><br><br>"+"</td></tr>");
out.println("</table>");


out.println("</body>");
out.println("</html>");





Langkah sembilan :
Buka “WEB-INF” di dalam folder “WEB Pages” pada Projek KalkulatorServlet  double klik pada web.xml , maka akan muncul tampilan sebagai berikut :


Kemudian ubahlah kolom “Welcome Files” menjadi Kalkulator . seperti di bawah ini : 




Cara Menjalankan Kalkulator Servlet :
Langkah pertama :


1. Build Projek KalkulatorServlet dengan cara klik kanan pada project, kemudian klik build agar kalkulator tersebut dapat dijalankan. Seperti pada gambar dibawah ini




2. Langkah Kedua : Kemudian jalankan program tersebut dengan mengklik Run 


3. Output yang dihasilkan, seperti gambar di bawah ini :



sekian , semoga bermanfaat :)








0 komentar:

Posting Komentar