Tampilkan postingan dengan label Pemograman. Tampilkan semua postingan
Tampilkan postingan dengan label Pemograman. Tampilkan semua postingan

Sabtu, 26 September 2015

SQL vs NoSQL: How to Choose


SQL databases:
    • store related data in tables
    • require a schema which defines tables prior to use
    • encourage normalization to reduce data redundancy
    • support table JOINs to retrieve related data from multiple tables in a single command
    • implement data integrity rules
    • provide transactions to guarantee two or more updates succeed or fail as an atomic unit
    • can be scaled (with some effort)
    • use a powerful declarative language for querying
    • offer plenty of support, expertise and tools.

NoSQL databases:
    • store related data in JSON-like, name-value documents
    • can store data without specifying a schema
    • must usually be denormalized so information about an item is contained in a single document
    • should not require JOINs (presuming denormalized documents are used)
    • permit any data to be saved anywhere at anytime without verification
    • guarantee updates to a single document — but not multiple documents
    • provide excellent performance and scalability
    • use JSON data objects for querying
    • are a newer, exciting technology.
SQL databases are ideal for projects where requirements can be determined and robust data integrity is essential. NoSQL databases are ideal for unrelated, indeterminate or evolving data requirements where speed and scalability are more important. In simpler terms:
    • SQL is digital. It works best for clearly defined, discrete items with exact specifications. Typical use cases are online stores and banking systems.
    • NoSQL is analog. It works best for organic data with fluid requirements. Typical use cases are social networks, customer management and web analytics systems.
Few projects will be an exact fit. Either option could be viable if you have shallower or naturally denormalized data. But please be aware these simplified example scenarios with sweeping generalizations! You know more about your project than I do, and I wouldn’t recommend switching from SQL to NoSQL or vice versa unless it offers considerable benefits. It’s your choice. Consider the pros and cons at the start of your project and you can’t go wrong.

Scenario One: a Contact List

Let’s re-invent the wheel and implement an SQL-based address book system. Our initial naive contact table is defined with the following fields:
    • id
    • title
    • firstname
    • lastname
    • gender
    • telephone
    • email
    • address1
    • address2
    • address3
    • city
    • region
    • zipcode
    • country
Problem one: few people have a single telephone number. We probably need at least three for land-line, mobile and workplace, but it doesn’t matter how many we allocate — someone, somewhere will want more. Let’s create a separate telephone table so contacts can have as many as they like. This also normalizes our data — we don’t need a NULL for contacts without a number:
  • contact_id
  • name (text such as land-line, work mobile, etc.)
  • number
Problem two: we have the same issue with email addresses, so let’s create a similar email table:
  • contact_id
  • name (text such as home email, work email, etc.)
  • address
Problem three: we may not wish to enter a (geographic) address, or we may want to enter multiple addresses for work, home, holiday homes, etc. We therefore need a new address table:
    • contact_id
    • name (text such as home, office, etc.)
    • address1
    • address2
    • address3
    • city
    • region
    • zipcode
    • country
Our original contact table has been reduced to:
    • id
    • title
    • firstname
    • lastname
    • gender

Great — we have a normalized database which can store any number of telephone numbers, email addresses and addresses for any contact. Unfortunately …

The schema is rigid
We’ve not considered the contact’s middle name(s), date of birth, company or job role. It doesn’t matter how many fields we add, we’ll soon receive update requests for notes, anniversaries, relationship statuses, social media accounts, inside leg measurements, favorite type of cheese etc. It’s impossible to foresee every option, so we’d possibly create an otherdata table with name-value pairs to cope.

The data is fragmented
It’s not easy to for developers or system administrators to examine the database. The program logic will also become slower and more complex, because it’s not practical to retrieve a contact’s data in a single SELECT statement with multiple JOIN clauses. (You could, but the result would contain every combination of telephone, email and address: if someone had three telephone numbers, five emails and two addresses, the SQL query would generate thirty results.)

Finally, full-text search is difficult. If someone enters the string “SitePoint”, we must check all four tables to see if it’s part of a contact name, telephone, email or address and rank the result accordingly. If you’ve ever used WordPress’s search, you’ll understand how frustrating that can be.

The NoSQL Alternative
Our contact data concerns people. They are unpredictable and have differing requirements at different times. The contact list would benefit from using a NoSQL database, which stores all data about an individual in a single document in the contacts collection:

{
  name: [
    "Billy", "Bob", "Jones"
  ],
  company: "Fake Goods Corp",
  jobtitle: "Vice President of Data Management",
  telephone: {
    home: "0123456789",
    mobile: "9876543210",
    work: "2244668800"
  },
  email: {
    personal: "bob@myhomeemail.net",
    work: "bob@myworkemail.com"
  },
  address: {
    home: {
      line1: "10 Non-Existent Street",
      city: "Nowhere",
      country: "Australia"
    }
  },
  birthdate: ISODate("1980-01-01T00:00:00.000Z"),
  twitter: '@bobsfakeaccount',
  note: "Don't trust this guy",
  weight: "200lb",
  photo: "52e86ad749e0b817d25c8892.jpg"
}

In this example, we haven’t stored the contact’s title or gender, and we’ve added data which need not apply to anyone else. It doesn’t matter — our NoSQL database won’t mind, and we can add or remove fields at will.

Because the contact’s data is contained in a single document, we can retrieve some or all information using a single query. A full-text search is also simpler; in MongoDB we can define an index on all contact text fields using:

db.contact.createIndex({ "$**": "text" });
then perform a full-text search using:
db.contact.find({
  $text: { $search: "something" }
});

Scenario Two: a Social Network

A social network may use similar contact data stores, but it expands on the feature set with options such as relationship links, status updates, messaging and “likes”. These facilities may be implemented and be dropped in response to user demand — it’s impossible to predict how they will evolve.

In addition:

Most data updates have a single point of origin: the user. It’s unlikely we’ll need to update two or more records at any one time, so transaction-like functionality is not required.
Despite what some users may think, a failed status update is unlikely to cause a global meltdown or financial loss. The application’s interface and performance take a higher priority than robust data integrity.

NoSQL appears to be a good fit. The database allows us to quickly implement features storing different types of data. For example, all the user’s dated status updates could be placed in a single document in the status collection:

{
  user_id: ObjectID("65f82bda42e7b8c76f5c1969"),
  update: [
    {
      date: ISODate("2015-09-18T10:02:47.620Z"),
      text: "feeling more positive today"
    },
    {
      date: ISODate("2015-09-17T13:14:20.789Z"),
      text: "spending far too much time here"
    }
    {
      date: ISODate("2015-09-17T12:33:02.132Z"),
      text: "considering my life choices"
    }
  ]
}

While this document could become long, we can fetch a subset of the array, such as the most recent update. The whole status history for every user can also be searched quickly.


Now presume we wanted to introduce an emoticon choice when posting an update. This would be a matter of adding a graphic reference to new entries in the update array. Unlike an SQL store, there’s no need to set previous message emoticons to NULL — our program logic can show a default or no image if an emoticon isn’t set.

Scenario Three: a Warehouse Management System

Consider a system which monitors warehoused goods. We need to record:

    • products arriving at the warehouse and being allocated to a specific location/bay
    • movements of goods within the warehouse, e.g. rearranging stock so the same products are in adjacent locations
    • orders and the subsequent removal of products from the warehouse for delivery.

Generic product information such as box quantities, dimensions and color can be stored, but it’s discrete data we can identify and apply to anything. We’re unlikely to be concerned with specifics, such as laptop processor speed or estimated smartphone battery life.

Our data requirements:

  1. It’s imperative to minimize mistakes. We can’t have products disappearing or being moved to a location where different products are already being stored.
  2. I hope these scenarios help, but every project is different and, ultimately, you need to make your own decision. (Although, we developers are adept at justifying our technological choices, regardless of how good they are!)
  3. In its simplest form, we’re recording the transfer of items from one physical area to another — or removing from location A and placing in location B. That’s two updates for the same action.
We need a robust store with enforced data integrity and transaction support. Only an SQL database will (currently) satisfy those requirements.


Source : http://www.sitepoint.com/sql-vs-nosql-choose/

Sabtu, 16 Agustus 2014

MEMBUAT WEB DENGAN MENGGUNAKAN BOOTSTRAP V.3

Sobat sekalian mungkin untuk orang yang sudah pernah membuat website sudah tidak asing lagi dengan Framework Bootstrap. Boostrap merupakan style web yang tinggal pake saja, jadi untuk memuat web yang responsive sekalipun gak usah pusing script css-nya gimana....hehehe.
Oh ya gw jelasin dulu apa itu yang namanya web responsive, web responsive merupakan web yang memiliki variasi tampilan untuk berbagai layar. Misalnya kita mau browsing di Desktop, Tablet, dan juga Mobile akan memiliki tampilan yang berbeda-beda. Mungkin orang yang masih awam akan bertanya kenapa kok bisa beda? Bukankah klo beda tampilan informasi jadi acak-acakan nanti? Jawabannya adalah perbedaan yang dimaksud disini adalah dari segi struktur tampilan informasi tetapi untuk informasi yang disampaikan tidak berkurang alias gunanya responsive adalah membuat tampilan di berbagai devisce lebih menarik.
Konsepnya seperti ini, kita punya berbagai device.
Layar Device

Untuk membuat tampilan web di berbagai device ini kita tidak perlu koding untuk masing-masing device jika kita sudah bisa menggunakan yang namanya bootstrap yang saya maksud. Karena walaupun ukuran layar berbeda-beda bootstrap bisa handle semuanya tanpa mengurangi informasi. Dan pastinya yang gak jago CSS gw saranin pake yang satu ini nih....hehhee.
  1. Oke langkah pertama kalian download dulu bootstrapnya disini.
  2. Kemudian Download Jquery Download the compressed, production jQuery 1.11.1
  3. Setelah itu ekstrak boostrap yang sudah kalian download sehingga bentuknya seperti ini.
  4. Hasil Ekstraksi Bootstrap
  5. Setelah itu masukkan JQuery yang telah di download tadi ke folder js diatas, sehingga isinya seperti ini.
  6. Memasukkan file Jquery
  7. Kemudian kita coba membuat halaman simple dengan codingan seperti di bawah ini.
  8. Tuliskan script di bawah ini pada notepad/notepad++ dan simpan dengan nama index.html
  9. 1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    <html>
    <head>
    <title>Tutorial Pertama</title>
    <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    </head>
    <body>
    <div class="container">
    <nav class="navbar navbar-default" role="navigation">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">Brand</a>
      </div>
    
      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav">
          <li class="active"><a href="#">Link</a></li>
          <li><a href="#">Link</a></li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><a href="#">Action</a></li>
              <li><a href="#">Another action</a></li>
              <li><a href="#">Something else here</a></li>
              <li class="divider"></li>
              <li><a href="#">Separated link</a></li>
              <li class="divider"></li>
              <li><a href="#">One more separated link</a></li>
            </ul>
          </li>
        </ul>
        <form class="navbar-form navbar-left" role="search">
          <div class="form-group">
            <input type="text" class="form-control" placeholder="Search">
          </div>
          <button type="submit" class="btn btn-default">Submit</button>
        </form>
        <ul class="nav navbar-nav navbar-right">
          <li><a href="#">Link</a></li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><a href="#">Action</a></li>
              <li><a href="#">Another action</a></li>
              <li><a href="#">Something else here</a></li>
              <li class="divider"></li>
              <li><a href="#">Separated link</a></li>
            </ul>
          </li>
        </ul>
      </div><!-- /.navbar-collapse -->
    </nav>
    <div class="row">
    <div class="col-md-8 col-xs-8 col-sm-6">
    <h3>Bagian Content</h3>
    <br/>
    <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    </div>
    <div class="col-md-4 col-xs-4">
    <h4>Bagian Widget</h4>
    </div>
    
    
    </div>
    
    
    <div class="well well-sm text-center">Copyright &copy by Indra Tobing</div>
    </div>
    <script src="js/jquery-1.11.1.min.js" ></script>
    <script src="js/bootstrap.min.js" ></script>
    
    </body>
    
    </html>
    
  10. Jika kalian jalankan di web browser dengan cara double click pada index.html yang disimpan tadi.
  11. Hasilnya adalah seperti pada gambar  bawah ini.
Output
Untuk download source code bisa disini.
Untuk memudahkan kalian mempelajari bootstrap memasang Bootstrap Twitter Offline Docs pada Google Chrome  kalian yaitu di webstore

Senin, 20 Januari 2014

Membuat Upload Gambar dengan PHP

Pada postingan kali ini saya akan memberikan tutorial bagaimana melakukan upload gambar dengan menggunakan PHP, sebelum masuk ke tutorial ini ada baiknya teman-teman tau apa itu PHP dan untuk apa sebenarnya PHP itu. Pada upoad gambar yang saya maksud disini adalah file gambar yang akan kita upload nantinya akan disimpan di folder yang telah kita tentukan, darimanapun sumber gambar yang akan anda upload selama gambar tersebut memnuhi kriteria dari segi ekstensi dan ukuran maka akan terupload.
Untuk membuat file upload disini saya memberikan langkah-langkah yang perlu anda lakukan untuk membuat upload gambar disini.

  1. Terlebih dahulu buka aplikasi XAMPP anda dan start pada Apache. Hal ini dilakukan supaya php yang kita tulis nantinya bisa berjalan karena PHP bersifat server side artinya hanya bisa berjalan di server.
  2. Buka folder C:\xampp\htdocs\ dan buat folder baru dengan nama Upload dan didalamnya buat juga sebuah folder upload.
  3. Setelah buat sebuah file dengan nama index.php yang berisi kodingan sebagai berikut ini.
<html>
<body>
<form action="upload_file.php" enctype="multipart/form-data" method="post">
<label for="file">Filename:</label>
<input id="file" name="file" type="file" />
<input name="submit" type="submit" value="Submit" />
</form>
</body>
</html>
</pre>
  1. Setelah itu buat kembali file dengan nama upload_file.php dengan kodingan sebagi berikut ini.
<?php
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["file"]["name"]);
$extension = end($temp);
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/pjpeg")
|| ($_FILES["file"]["type"] == "image/x-png")
|| ($_FILES["file"]["type"] == "image/png"))
&& ($_FILES["file"]["size"] < 2000000)
&& in_array($extension, $allowedExts))
  {
  if ($_FILES["file"]["error"] > 0)
    {
    echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
    }
  else
    {
    echo "Upload: " . $_FILES["file"]["name"] . "<br>";
    echo "Type: " . $_FILES["file"]["type"] . "<br>";
    echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
    echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br>";

    if (file_exists("upload/" . $_FILES["file"]["name"]))
      {
      echo $_FILES["file"]["name"] . " already exists. ";
      }
    else
      {
      move_uploaded_file($_FILES["file"]["tmp_name"],
      "upload/" . $_FILES["file"]["name"]);
      echo "Stored in: " . "upload/" . $_FILES["file"]["name"];
      }
    }
  }
else
  {
  echo "Invalid file/ maximaze image 1mb";
  }
?>
  1. Simpan kedua file pada C:\xampp\htdocs\Upload kemudian jalankan pada web browser anda dengan mengetikkan localhost/upload/index.php.
  2. Jika pada saat dijalankan gambar yang diupload invalid maka anda boleh memperbesar ukuran dari maximize upload menjadi 2000000 pada kodingan upload_file.
Ref :http://www.w3schools.com/php/php_file_upload.asp

Kamis, 19 Desember 2013

Jaringan Komputer Lanjut

LATIHAN SOAL


1.    Menentukan operasi-operasi primitif dan layanan layer yang berada di bawahnya
a.    Entitas                                            c. Peer Entity
b.    Peer process                                 d. Interface

2.    Protokol yang menggunakan algoritma routing flooding dalam pengiriman paket-paket routing-nya adalah :
a.    OSPF                                              c. RIPv2
b.    RIPv1                                              d. Jawaban a, b, dan c benar

3.    Relay yang bekerja pada lapisan keempat adalah :
a.    Gateway                                         c. Protocol Converter
b.    Bridge                                             d. Repeater

4.    Memiliki kelebihan sekali dipakai maka ia transparan dan relatif tanpa delay :
a.    Jaringan switching
b.    Jaringan circuit switching
c.    Jaringan packet switching – virtual circuit
d.    Jaringan packet switching – datagram

5.    Mengenai jaringan packet switching datagram, pernyataan yang benar adalah :
a.    Membutuhkan waktu penguraian alamat yang lebih lama daripada rangkaian virtual
b.    Aliran data umumnya berkesinambungan dan tidak putus-putus
c.    Membutuhkan pemakaian ruang memori yang lebih besar daripada rangkaian virtual
d.    Jawaban a, b, dan c benar semua
6.    Pernyataan berikut yang benar adalah :
a.    Pada routing optimal, sink tree harus unik dan hanya satu-satunya
b.    Pada routing terisolasi, router saling bertukar informasi dengan router-router tetangganya
c.    Pada routing keadaan-link, dalam mengukur biaya saluran dapat pula dengan mengukur maupun tidak mengukur faktor beban
d.    Routing multilintasan menggenerasi sejumlah paket duplikat

7.    Pernyataan berikut benar, kecuali :
a.    Keberhasilan fungsi layer atas bergantung pada keberhasilan operasi lapisan bawah
b.    Arsitektur jaringan adalah himpunan protokol dan entitas-entitas yang menerapkannya
c.    Salah satu fungsi protokol adalah enkapsulasi
d.    Sebenarnya tidak ada data yang dipindahkan secara langsung dari layer n suatu mesin ke layer n mesin lainnya

8.    Routing protokol yang mungkin terjadi loop :
a.    OSPF          b. RIP             c. BGP            d. Jawaban a, b, dan c benar
9.    Bridge yang memiliki ciri routing-nya suboptimal adalah :
a.    Bridge transparan                                  c. Jawaban a, dan b benar
b.    Bridge routing sumber                             d. Jawaban a, dan b salah

10. Berfungsi untuk menyediakan jalur sinyal yang jelas di antara sepasang perangkat yang terpasang :
a.    Switch digital                               c. Unit control
b.    Interface jaringan                         d. Stasiun

11. Standar yang dipergunakan untuk mengantarmukakan sistem host dengan jaringan packet switching :
a.    Protocol X.75                                 c. Protocol TCP
b.    Protokol IP                                     d. Protokol X.25

12. Informasi yang perlu diketahui dalam routing berdasarkan arus adalah, kecuali:
a.    Matriks kapasitas jalur                 c. Matriks lalu lintas
b.    Algoritma routing sementara      d. delay setiap jalur

13. Dalam layanan connection-oriented, sinyal entity yang dipanggil dinyatakan dengan :
a.    CONNECT.response                   c. CONNECT.indication
b.    CONNECT.request                      d. CONNECT.confirm

14. Routing protocol yang menggunakan metrik tunggal adalah :
a.    OSPF, RIPv1                                 c. RIPv1,RIPv2
b.    OSPF, RIPv2                                 d. OSPF, RIPv1, RIPv2

15. Standar protokol X.75 digunakan untuk :
a.    Gateway tanpa koneksi               c. Interior router
b.    Exterior router                               d. Gateway berorientasi koneksi

16. Data switch merupakan contoh dari :
a.    Jaringan packet switching – datagram
b.    Jaringan circuit switching
c.    Jaringan packet switching – virtual circuit
d.    Jawaban a, b, dan c tidak ada yang tepat

17. Dengan layanan tanpa koneksi, jaringan hanya setuju untuk menangani paket-paket secara terpisah dan berusaha sebaik-baiknya dalam pengiriman :
a.    External VC service                     c. External datagram service
b.    Internal VC operation                  d. Internal datagram operation

18. Routing yang memiliki kelemahan meningkatnya panjang lintasan :
a.    Routing multilintasan                  c. Routing terdistribusi
b.    Routing hirarkis                       d. Routing hot potato

19. Layanan acknowledgement datagram merupakan contoh jenis layanan :
a.    Reliable connection-oriented
b.    Unreliable connection-oriented
c.    Reliable connectionless
d.    Unreliabe connectionless

20. Bila perangkat relay ini dipasang di antara jaringan maka frame yang dikirim oleh suatu host akan terdengar oleh semua host lainnya :
a.    Bridge                                            c. Repeater               
b.    Router                                            d. Protocol Converter

21. Gateway keluar harus mengetahui kapan ia telah menerima semua frame. Ini harus dipenuhi dalam :
a.    Fragmentasi transparan                       c. Fragmentasi
b.    Fragmentasi non transparan                 d. Fragmen elementer

22. Yang menjadi kekurangan dari space-division switch bertahap adalah kecuali :
a.    Memerlukan skema kontrol yang lebih kompleks
b.    Jumlah titik persimpangan berkembang seiring perkembangan jumlah stasiun yang terpasang
c.    Hilangnya titik persimpangan menghalangi koneksi antara dua stasiun yang jalurnya di titik persimpangan itu
d.    Titik persimpangan tidak dapat digunakan dengan efisien

23. Kelebihan jaringan packet switching dibandingkan dengan jaringan circuit switching :
a.    Diberlakukan skala prioritas
b.    Mampu menampilkan konversi laju data
c.    Efisiensi pemakaian jalur
d.    Jawaban a, b, dan c benar

24. Algoritma routing ini konsepnya adalah ada beberapa lintasan antara pasangan simpul yang sama baiknya :
a.    Routing broadcast                        c. Routing hirarkis
b.    Routing multicast                         d. Routing multilintasan

25. Layanan yang diberikan network layer kepada transport layer adalah juga menentukan layanan yang diberikan oleh :
a.    Subnet kepada host
b.    Jaringan pembawa kepada pemakainya
c.    Jawaban a, dan b benar
d.    Jawaban a dan b salah






Selasa, 05 November 2013

SQL (Structure Query Language)

Jenis SQL

1. Interactive yaitu langsung dapat dioperasikan pada konsol.
2. Embedded yaitu perintah SQL disipkan ke dalam sebuah program.

Pengelompokan Statement SQL

1. Data Defenition Language (DDL)

    Yaitu perintah yang digunakan untuk mendefenisikan struktur pada tabel.
     Perintah-perintah DDL :
  • CREATE TABLE
  • CREATE DATABASE
  • CREATE INDEX
  • CREATE VIEW
  • DROP TABLE
  • ALTER TABLE
Contoh penggunaan DDL :
  • Membuat Database
CREATE DATABASE MAHASISWA;
  • Membuat tabel MHS
CREATE TABLE MHS(NPM CHAR(8),NAMA VARCHAR(30),KELAS VARCHAR(5));
  • Membuat View
CREATE VIEW KELAS AS(SELECT * FROM MHS);
  • Menghapus Tabel
DROP TABLE MHS;
  • Menambahkan field STATUS pada tabel MHS
ALTER TABLE MHS ADD STATUS VARCHAR(10);
  • Menghapus Field KELAS Pada table MHS
ALTER TABLE MHS DROP COLUMN KELAS;

2. Data Manipulation Language (DML)

DML digunakan untuk memanipulasi tabel yang telah kita defenisikan, seperti memasukkan record, menghapus record, memperbaharui record maupun menampilkan record.
Perintah-perintah DML :
  • INSERT
  • UPDATE
  • SELECT
  • DELETE
Contoh penggunaan perintah DML :
  • Memasukkan record ke table MHS
INSERT INTO MHS(NPM,NAMA,KELAS) VALUES('59410282', 'INDRA', '3IA03');
  • Melakukan Update terhadap record pada tabel MHS
UPDATE MHS SET NAMA=' MICHAEL' WHERE NPM='59410282';
  • Menampilkan isi tabel MHS
SELECT * FROM MHS;
SELECT NPM,KELAS FROM MHS;
  • Menghapus record pada tabel MHS
DELETE FROM MHS WHERE NAMA='INDRA';

3. Data Access

Yaitu perintah yang digunakan untuk mengontrol hak akses pada suatu database.
Perintah Data Control Language (DCL) :
  • GRANT
  • REVOKE
Contoh penggunaan perintah DCL :
  • Memberikan hak akses UPDATE pada tabel MHS terhadap user INDRA
GRANT UPDATE ON MHS TO INDRA;
  • Mencabut Hak Akses UPDATE pada tabel MHS dari user INDRA
REVOKE UPDATE ON MHS FROM INDRA;

4. Recover Tabel

Yaitu perintah yang digunakan untuk mengembalikan data sebelum terjadi kerusakan.
Perintah Recover Tabel
  • RECOVER TABLE
Contoh penggunaan perintah recover table
  • Kembalikan keadaan data mahasiswa seperti pada saat sebelum terjadi kerusakan
RECOVER TABLE MHS;

5. Auxiliary

Perintah yang digunakan untuk mengubah data maupun kolom pada tabel.
Perintah Auxiliary :
  • UNLOAD
  • LOAD
  • RENAME
Contoh penggunaan Perintah Auxiliary :
  • Ubah semua data mahasiswa ke bentuk ASCII dan disimpak ke file text di directory /home/indra/
UNLOAD TO "home/indra" DELIMITER "|" SELECT * FROM MHS;
  • Merubah file text ke tabel MHS_2 di directory home/indra;
LOAD FROM "home/indra" DELIMITER "|" INSERT INTO MHS_2;
  • Merubah nama tabel MHS menjadi KELAS
RENAME TABLE MHS TO KELAS;


Jumat, 11 Oktober 2013

Fitur-fitur pada HTML5

           Kehadiran HTML5 dinilai cukup membantu dengan penambahan beberapa fitur baru. Pada postingan kali ini saya akan menjelaskan apa saja fitur baru yang dimaksud dan bagaimana penggunaan untuk setiap fitur baru tersebut. Pada HTML5 terdapat beberapa penambahan diantaranya sebagai berikut.
- Elemen Canvas
- Elemen Media
- Elemen Form
- Elemen Semantik / Struktural

1. Canvas
Elemen canvas digunakan untuk draw atau menggambar. Canvas hanya saja disini bukan alat untuk menggambar tapi hanya sebagai media pendukung untuk menggambar. Untuk menggambar dengan grafik disini biasanya dengan menggunakan javascript.
Contoh penggunaan Canvas.

<canvas id="myCanvas"></canvas><!--canvas yang akan digambar-->
<script type="text/javascript">//Scipt untuk menggambar-->
var canvas=document.getElementById('myCanvas');//fungsi untuk menggambar canvas
var ctx=canvas.getContext('2d');//gambar bujursangkar pertama
ctx.fillStyle='#FF0000';//memberikan warna pada bagian canvas
ctx.fillRect(0,0,80,100);//memberikan parameter titik koordinat
</script>//mengakhiri script canvas

Output :
Canvas diatas juga bisa diatur ukurannya dengan memasukkan attribut height dan weight pada tag canvas dengan cara <canvas id=”mycanvas” height=”300px” weight=”300px”></canvas>.

2. Audio
Untuk memasukkan suara pada html bisa menggunakan tag <audio>.  Format suara yang telah didukung hingga saat ini adalah MP3, Ogg dan WAP.  Untuk dukungan pada web browser bisa dilihat pada tabel berikut ini.

Browser
MP3
Wav
Ogg
Internet Explorer
YES
NO
NO
Chrome
YES
YES
YES
Firefox
NO
Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP3
YES
YES
Safari
YES
YES
NO
Opera
NO
YES
YES
Dan untuk MIME-nya adalah sebagai berikut ini.
Format
MIME-type
MP3
audio/mpeg
Ogg
audio/ogg
Wav
audio/wav
Untuk attribut audio diatas adalah seperti tabel berikut ini.
Attributes
Attribut
Value
Deskripsi
autoplay
autoplay
Untuk memulai audio secara otomatis pada web terbuka
controls
controls
Untuk menampilkan kontrol seperti volome, seek audio, dan juga tombol untuk memulai/pause
loop
Untuk mengulang audio kembali setelah pemutaran awal selesai
muted
Untuk mematikan suara
auto
metadata
none
Untuk memuat ulang audio ketika halaman dimuat ulang
URL
Untuk memberikan alamat web audio ketika diklik.
Contoh Script :
<audio controls> <--memasukkan media audio-->
  <source src="horse.ogg" type="audio/ogg"><-- mengambil path audio-->
  <source src="horse.mp3" type="audio/mpeg"><-- mengambil path audio-->
  Your browser does not support the audio tag.
</audio><-- menutup tag audio-->

3. Video
Sama halnya dengan audio, hanya saja untuk video kita gunakan tag <video> dan menutupnya kembali dengan </video>. Untuk format yang didukung saat ini ada 3 yaitu MP4, Ogg dan WebM.

Browser
MP4
WebM
Ogg
Internet Explorer
YES
NO
NO
Chrome
YES
YES
YES
Firefox
NO
Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP4
YES
YES
Safari
YES
NO
NO
Opera
NO
YES
YES
Untuk MIME-nya sendiri menggunakan seperti tabel beikut ini.
Format
MIME-type
MP4
video/mp4
WebM
video/webm
Ogg
video/ogg
Untuk attribut yang bisa digunakan pada tag video adlah sebagai berikut ini.
Attribute
Value
Deskripsi
autoplay
Memulai secara otomatis video
controls
Untuk menampilkan control video
height
pixels
Untuk mengatur tinggi frame video
loop
Memutar video secara berulang-ulang
muted
Untuk mematikan fungsi suara pada video
URL
Untuk memunculkan poster/gambar pada saat video buffer atau diunduh.
auto
metadata
none
Untuk memuat ulang video
URL
Untuk memberikan link video
pixels
Untuk mengatur lebar frame video
4. Source
Source digunakan disini sama halnya untuk keperluan video dan audio, hanya saja pada <source> akan kita gunakan jika kita memberikan 2 sumber dimana file tersebut memiliki isi yang sama tetapi format yang berbeda. Tujuannya disini adalah web browser akan memilih memutar yang mana  nantinya sesuai dengan format yang didukung oleh web browser.
Contoh penggunaan <Source> </source> :
<audio controls>
  <source src="horse.ogg" type="audio/ogg"> <--sumber audio 1 ekstensi ogg-->
  <source src="horse.mp3" type="audio/mpeg"><--sumber audio 2 ekstensi mp3-->
Your browser does not support the audio element.
</audio>

Attribut 
Attribute
Value
Deskripsi
media
media_query
Format dari media yang digunakan
src
URL
Untuk memberikan link sumber media
type
MIME_type
Untuk mendefenisikan tipe MIME

5. Embed
      Embed digunakan untuk melampirkan file dari eksternal seperti *.swf dan lain-lain.
Untuk contoh penggunaannya adalah sebagai berikut ini.
<embed src="helloworld.swf"><--Melampirkan file flash-->
Untuk attribut penggunaan embed bisa ditambahkan pada tag tersebut attribut seperti pada tabel berikut ini.
Attributes
Attribute
Value
Description
height
pixels
Untuk mendefenisikan ukuran tinggi frame media.
src
URL
Untuk memberikan sumber media yang dilampirkan
type
MIME_type
Untuk menspesifikasikan tipe dari MIME
width
pixels
Untuk mengatur lebar dari frame media pada saat program dijalankan di browser.
6. Track
Track disini digunakan untuk melampirkan seperti subtitle text pada media. Contoh penggunaanya adalah sebagai berikut ini.
<video width="320" height="240" controls>
  <source src="forrest_gump.mp4" type="video/mp4">
  <source src="forrest_gump.ogg" type="video/ogg">
  <track src="subtitles_en.vtt" kind="subtitles" srclang="en"
  label="English"><--Merupakan subtitle yang dilampirkan pada video-->
  <track src="subtitles_no.vtt" kind="subtitles" srclang="no"
  label="Norwegian">
</video>

Attribut yang bisa digunakan padatag track ini adalah sebagai berikut ini.
Attribute
Value
Deskripsi
default
default
Memberikan text default/subtitle pada video
kind
captions
chapters
descriptions
metadata
subtitles
Menspesifikasikan format dari text yang akan dimunculkan pada layar
label
text
Memberikan labael pada subtitle
src
URL
Merupakan suatu keharusan jika kita ingin melampirkan file
srclang
language_code
Menspesifikasikan tipe dari file lampiran seperti jenisnya (required if kind="subtitles")
7. SVG
SVG (Scalable Vector Graphics) merupakan tag yang digunakan untuk menggambar selain yang sebelumnya kita gunakan seperti canvas. SVG didefenisikan dengan format XML. Setiap elemen dari SVG dapat dianimasikan. Kelebihan dari SVG ini adalah tidak mengurangi kualitas darigambar jika diperbesar karena berbasis vektor sehingga SVG juga direkomendasikan oleh W3C.
Keuntungan SVG
- Gambar SVG dapat dibuat dan diubah dengan menggunakan banyak text editor  biasa
- Gambar SVG dapat dicari, diindex, dimasukkan ke script dan juga di kompres
- Gambar pada SVG dapat diubah ukurannya
- Gambar SVG dapat dicetak dengan kualitas tinggi pada resolusi berapapun
- Gambar SVG dapat diperbesar tampa mengurangi kualitas gambar

Contoh penggunaan SVG :
<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
  <polygon points="100,10 40,180 190,60 10,60 160,180"
  style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;">
</svg>

</body>
</html>

Hasil











Perbedaan antara SVG dan Canvas
- SVG adalah sebuah bahasa untuk mendeskripsikan grafik 2D dalam XML
- Canvas menggambar grafik 2D (dengan bantuan javascript)
- SVG adlah dasar XML yang artinya bahwa setiap elemen tersedian utuk SVG DOM  dan juga kita dapat menambahkan javaScript untuk elemen.
- Dalam SVG, setiap gambar yang dibentuk direkomendasikan menjadi sebuah objek. Jika objek SVG diubah maka browser secara otomatis membentuk ulang.
- Canvas mengubah/menterjemahkan berdasarkan pixel dan jika posisi berubah maka kita harus menggambar ulang.

8. Drag and Drop
Drag and Drop adalah sebuah fitur umum. Dengan fitur ini memukinkan untuk memindahkan objek ke lokasi lainnya.
Contoh Program :
<img draggable="true"><-- Memukinkan untuk bisa memindahkan gambar-->

9. Geolocation
Geolocation digunakan untuk mengecek posisi si pengguna jika memukinkan.
Contoh Program :
<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
//Jika navigator mendukung pada web browser atau perangkat yang digunaka
    {
    navigator.geolocation.getCurrentPosition(showPosition);
//Mendapatkan posisi terbaru dari si pengguna
    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}
<--Jika perangkat yang digunakan tidak mendukung geolocation
  }
function showPosition(position)
//nama fungsi
  {
  x.innerHTML="Latitude: " + position.coords.latitude + 
  "<br>Longitude: " + position.coords.longitude; 
  }
</script>

10. Input Types
Input tipe pada form yang baru digunakan pada HTML5 trdapat tipe yang baru. Hanya saja tidak semua tipe didukung oleh web browser.
Tag tersebut diataranya adalah sebagai berikut.
color
date
datetime
datetime-local
email
month
number
range
search
tel
time
url
week
Untuk format penggunaan input type tersebut sama hanya dengan input tipe yang digunakan pada form di HTML4 yaitu sebagai berikut ini.
Birthday (date and time): <input type="datetime" name="bdaytime">

Definisi HTML5
Perkembangan HTML5
Kelebihan dan Kekurangan HTML5

Ref :