Selasa, 15 November 2016

Instalasi XAMPP phpmyadmin di Raspberry PI

Kursus hari2 Materi1

Menginstall paket untuk lingkungan pengenbangan web di Raspberry sangatlah mudah, kita bisa menggunakan paketan yang telah ada seperti LAMP atau dapat pula menginstall one-by-one paket-paket server dan modul untuk pengembangan web agar lebih efisien.

Jika di Windows kita memakai XAMPP yang berisikan web server Apache, kemudian database server MySQL, modul bahasa scripting PHP5, FTP Server dan kawan-kawannya, maka di Raspberry PI juga ada versinya yang bernama LAMP.

Lamp berisikan paket-paket software seperti yang disebutkan diatas, namun jika langsung menggunakan LAMP (sudo apt-get install LAMP) biasanya paket-paket yang dibundle agak kurang up to date, jadi sangat disarankan untuk menginstal satu persatu paket-paket yang akan kita gunakan untuk membangun web dinamis:

1. Menginstall web server Apache 2

$ sudo apt-get install apache2 libapache2-mod-php5
$ sudo service apache2 restart atau /etc/init.d/apache2 restart 

Untuk direktori webroot terletak di /var/www sama seperti Linux pada umumnya, jika di Windows biasanya di C:\XAMPP\htdoc

2. Menginstall modul PHP5

$ sudo apt-get install php5 php5-mysql php-imagick

Untuk melihat daftar paket lengkap, gunakan perintah:

$ sudo apt-cache search php

maka akan muncul semua paket PHP yang mungkin dibutuhkan.

3. Menginstall MySQL Server 

Cara menginstall MySQL di Raspberry juga sangat mudah, versi server dan client dapat diinstall dengan perintah berikut:

$ sudo apt-get install mysql-server mysql-client

4. Menginstall PHPMyAdmin

Seperti XAMPP, kita biasanya bisa dengan mudah memanipulasi database melalui antarmuka web menggunakan PHPMyAdmin, begitupula di Linux dan Raspberry Pi PHPMyAdmin sudah pasti tersedia, caranya install:

$ sudo apt-get install phpmyadmin

Lakukan sedikit konfigurasi khususnya akun database ketika installasi, setelah selesai dapat diakses melalui http://127.0.0.1/phpmyadmin atau ganti IP lokalhost dengan IP Raspberry Pi di jaringan.
http://192.168.0.100/phpmyadmin



Reff: Install phpmyadmin



Contoh web .html

mystyle.css
body {
  padding-left: 11em;
  font-family: Georgia, "Times New Roman",
        Times, serif;
  color: purple;
  background-color: #d8da3d }
ul.navbar {
  list-style-type: none;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 2em;
  left: 1em;
  width: 9em }
h1 {
  font-family: Helvetica, Geneva, Arial,
        SunSans-Regular, sans-serif }
ul.navbar li {
  background: white;
  margin: 0.5em 0;
  padding: 0.3em;
  border-right: 1em solid black }
ul.navbar a {
  text-decoration: none }
a:link {
  color: blue }
a:visited {
  color: purple }
address {
  margin-top: 1em;
  padding-top: 1em;
  border-top: thin dotted }

index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
  <title>My first styled page</title>
  <link rel="stylesheet" href="mystyle.css">
</head>

<body>


<!-- Site navigation menu -->
<ul class="navbar">
  <li><a href="index.html">Home page</a>
  <li><a href="http://www.lp2maray.com">Profile</a>
  <li><a href="http://www.lp2maray.com">Addrees</a>
  <li><a href="http://www.lp2maray.com">Contact</a>
</ul>

<!-- Main content -->
<h1>Welcome to lp2maray</h1>

<p>Welcome to my styled page!

<p>It lacks images, but at least it has style.
And it has links, even if they don't go
anywhere&hellip;

<p>There should be more here, but I don't know
what yet.


<address>Made 2 Mei 2016<br>by myself.</address>

</body>
</html>
Simpan dalam satu folder misalkan "webku" di /var/www


ATAU


Juga tambahkan code sbb untuk autorefresh aplikasi:

<script type="text/javascript">
function Ajax(){
var $http,$self = arguments.callee;

if (window.XMLHttpRequest) {$http = new XMLHttpRequest();} 
else if (window.ActiveXObject) {
try {$http = new ActiveXObject('Msxml2.XMLHTTP');} 
catch(e) {$http = new ActiveXObject('Microsoft.XMLHTTP');}
}

if ($http) {
$http.onreadystatechange = function(){
if (/4|^complete$/.test($http.readyState)) {
document.getElementById('ReloadThis').innerHTML = $http.responseText;
setTimeout(function(){$self();}, 1000);
}
};
$http.open('GET', 'timer.php' + '?' + new Date().getTime(), true);
$http.send(null);
}
}
</script>
<script type="text/javascript">setTimeout(function() {Ajax();}, 1000);</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body></body>
</html>
<hr />HTTP://www.LP2M-ARAY: <div id="ReloadThis">Default text</div>




Auto refresh sangat diperlukan untuk aplikasi yang membutuhkan data ditampilkan secara realtime via web server.....

Selamat Mencoba

Tidak ada komentar:

Posting Komentar