CRUD PHP MySQLi Berpadu dengan Bootstrap ( PART 1 )

Hallo sob, sesuai dengan rencana kita kemarin, kita akan membuat sebuah projek sederhana yaitu membuat Data Karyawan dengan menggunakan CRUD PHP MySQLi dan kita percantik dengan Bootstrap. Untuk sahabat yang belum mengerti langkah dan tujuan dalam pembuatan project ini, bisa anda baca di postingan sebelumnya atau bisa anda lihat disini.

Pada tutorial part pertama ini, kita tetap akan berpegangan pada sususan step yang kita rencanakan di pengenalan project. Pertama- tama kita akan membuat Database dan juga mempersiapkan hal - hal yang nantinya akan membantu dalam pemercantik tampilan.

Alat dan Bahan :

1. Laptop / PC ( Sudah terinstall Web Server ).
2. Koneksi Internet.
3. Text Editor.
4. Library Bootstrap.

Langkah - langkah :

1. Untuk anda para Linuxer, buat folder latmysqli pada  directory /var/www/html dan beri hak akses agar bisa dibuka di web browser. Untuk pengguna Windows buat di htdoct.
2. Kemudian buat folder di dalam latmysqli seperti di gambar.
   
3.  Setelah itu, kita download semua lib bootstrap disini. Lalu anda tata seperti di gambar.
   
    *CSS
   
   
    *FONT
   
   
    *JS
4. Jika semuanya sudah, kita buat database di PHP My Admin, seperti gambar dibawah.
   
5. Semua langkah di step ini sudah kita lakukan, teliti kembali pekerjaan anda, jangan sampai di tengah jalan nanti anda akan menjumpai error.

Untuk anda yang ingin mendownload script tutor diatas. Silahkan masukan email anda di kolom komentar.

Selamat Belajar dan Semoga Bermanfaat !!!

CRUD PHP MySQLi Berpadu dengan Bootstrap ( Pengenalan Projek )

Hallo sahabat, sebelumnya saya minta maaf karena beberapa minggu belakangan saya tidak menulis kembali ilmu yang saya miliki ke sahabat semua. Tetapi kali ini saya akan langsung berikan tutorial panjang dan bertahap mengenai CRUD PHP yang akan kita padukan dengan Bootstrap. Nah, penasaran bukan hasilnya seperti apa? Trus Scriptnya bagaimana sob? jangan berfikiran ke teknis dulu, yang terpenting adalah logika kita bisa bermain dalam proses pembuatan projek kali ini. Karena untuk script nantinya akan saya berikan semua beserta keterangannya. Jadi saya minta agar teman - teman untuk lebih memahami langkah demi langkah yang kita buat. JANGAN PUAS HANYA SEKEDAR BISA DAN JADI!!!.

Tujuan :

1. Melatih dan Mengulangi kembali materi yang sudah pernah dikerjakan agar lebih memahami materi ini ( Dalam hal ini CRUD MySQLi ).
2. Membuat tampilan projek lebih menarik menggunakan Bootstrap.
3. Mengembangkan logika da pola pikir yang baik dan benar.

Sebelum kita melangkah lebih jauh ke sana, saya akan menjelaskan langkah - langkah untuk membuat projek ini.

1. Membuat Data Base dan Template Bootstrapnya.
2. Membuat Koneksi dan Menampilkan data.
3. Menambahkan data dan Menghapus data.
4. Mengedit data dan mengubah password.

Langkah atau tahapan diatas akan kita bahas per posting, tujuannya agar sahabat nantinya akan lebih memahami tentang CRUD menggunakan MySQLi dan juga dengan Bootstrapnya.

Dan untuk tahap pertama akan kita bahas dalam waktu dekat.

Terima Kasih !!!

Tutuorial CRUD Phalcon ( Part 4 )

Hallo sobat !!!, sekarang kita sudah masuk ke tahap terakhir dalam Tutorial CRUD Phalcon ini. Sebelumnya saya mohon maaf, karena saya tidak meneruskan tutorial ini dalam beberapa hari terakhir karena banyaknya hal yang harus saya prioritaskan terlebih dahulu. Pada tutorial kali ini, kita akan membuat Delete, butuh ketelitian lebih dari pada tutorial sebelum-sebelumnya.

Dalam sesi terakhir ini, kita tidak banyak memasukan script tetapi akan sangat membingungkan jika anda tidak teliti. Untuk meneruskan ke tahap ini, anda harus sudah menyelesaikan tahap di part 1, 2 dan 3.

Alat dan Bahan :

1. PC / Laptop
2. Project part 1, 2 dan 3

Tahapan :

1. Buka file viewData.volt, edit filenya menjadi seperti digambar.
   
2. Sekarang kita tambahkan script ini untuk di UserControllernya.
   
3. Sekarang kita coba tambahkan data.
   
   
   
   
   
   
   
4. Tampilkan data
   
5. Sekarang kita coba hapus data
   
   
   
   

Hapus data telah berhasil

Semoga Bermanfaat !!!

Tutuorial CRUD Phalcon ( Part 3 )

Hallo sobat, pada tutorial bagian ke tiga ini kita sudah memasuki tahap ke 4. Pada tutorial bagian pertama dan kedua, kita sudah berhasil membuat data base, membuat form dan juga menambahkan data serta menampilkan data yang kita buat. Nah, kali ini kita akan melakukan update data.

Mengapa kita memerlukan Update? Karena jika dalam memasukan data ada suatu kesalahan atau data yang kita masukan belum valid, maka kita bisa merubahnya dengan satu perintah, tidak perlu berbelit-belit masuk ke phpmyadmin, menghapus data dan juga membuatnya kembali.

Alat dan Bahan :

1. PC / Laptop.
2. Projek tutorial part 1 dan 2.
3. Text Editor.

Tahapan :

1. Masuk ke directory views/User. Buat file dengan nama edit.volt
2. Masukan scriptnya.
   
3. Seperti biasa, karena kita memakai phalcon, kita tambahkan controllernya di UserController.
   
4. Karena kita melakukan aksi yaitu di update, maka kita juga perlu controller, letakan script ini dibawah EditAction.
   
5. Hasil dari UserController.
   
6. Sekarang kita lihat hasilnya.
   
   
   
   
   
7. Kita cek di phpmyadmin, apakah data akan terupdate atau tidak.
   

Data telah ter update.

Semoga Bermanfaat !!!

Tutuorial CRUD Phalcon ( Part 2 )

Hallo Sobat, sekarang kita akan menampilkan data yang sudah ada di database atau data yang sudah kita buat di project kita. Pada part 1, kita sudah membuat projek, membuat database dan juga memasukan data. Saya harap untuk anda yang baru mengikuti tutorial ini, alangkah lebih baiknya jika anda mencoba project pertama terlebih dahulu.

Pada Part 2 ini, kita tidak akan melakukan banyak step, dan juga kita hanya butuh sedikit tambahan dari file yang sudah kita buat di part 1. Hanya saja pada step ini kita butuh pemahaman dengan cara kerja Mvc atau framework phalcon.

Alat dan Bahan :

1. Laptop / PC ( sudah terinstall webserver )
2. Project part1
3. Text editor.

Tahapan :

1. Buat file baru di folder User. Beri nama viewData.volt
2. Masukan scriptnya.
   
3.  Kemudian kita tambahkan controllernya.
   
4. Sekarang kita cek di web broser. Buka projek kita dan inilah hasilnya.
   
   
   
   

Semoga Bermanfaat !!!

Tutuorial CRUD Phalcon ( Part 1 )

Hallo sobat, tidak terasa sudah 1 minggu ini saya tidak membagikan tutorial mengenai framework Phalcon. Pada kesempatan yang lalu kita sudah memadukan phalcon dengan bootstrap, kita sudah membuat template nya juga dengan bootstrap dan hasilnya responsive. 

Sekarang kita akan belajar CRUD phalcon dari awal, untuk sahabat yang belum memahami tentang framework phalcon dan juga cara kerja dari phalcon, alangkah lebih baiknya jika anda memahami tentang framework yang satu ini. 

Tahapan yang akan kita kerjakan antara lain :

1. Pembuatan Projek.
2. Memasukan data ke Database.
3. Menampilkan data.
4. Update data ( Edit Data ).
5. Delete.

Alat dan Bahan :

1. PC / Laptop ( Sudah terinstall Webserver dan framework phalcon ).
2. Text Editor

Tahapan :

1. Kita buat projek terlebih dahulu. Beri nama "phalcon_project" (tanpa petik).
   
2. Beri hak akses pada projek. "chown -R www-data:www-data phalcon_project".
3. Sekarang kita buat database, beri nama test_phalcon.
4. Buat table seperti di gambar.
   
5. Edit koneksinya di app/config/config.php. Isikan password sesuai password anda.
   
6. Setelah itu buat folder User di views
7. Buat file index.volt. Isikan Scriptnya
   
8. Buat controllernya. Beri nama UserController.
   
9. Cek ke web  browser, buka projek kita. Ini lah hasilnya
   
10. Kemudian tambahkan script ini pada controller. Fungsinya untuk menambahakan data yang kita masukan ke dalam database kita.
    
11. Kita coba tambahkan data.
    
    
    
    
12. Cek di data base kita. 
    

Semoga Bermanfaat !!!

Membuat Portal SMK Negeri 1 Sawit Kab. Boyolali

Hallo guys, kemarin kita sudah membuat portal menggunakan CSS dan HTML untuk SMK Negeri 1 Sawit Kab.Boyolali. Sekarang saya akan membagikan kepada sahabat, tutorial membuat portal menggunakan Bootstrap. Pada kesempatan kali ini kita akan membutuhkan koneksi internet untuk download library bootstrap.

Untuk referensi anda agar mengetahui lebih lanjut mengenai bootstrap saya akan membagikan situs - situs yang menurut saya sangat membantu dalam membuat website, khususnya jika menggunakan Bootstrap. Salah satu keuntungan mendasar menggunakan bootstrap, web yang anda buat akan berupa responsive atau dapat menyesuaikan sesuai dengan media pembukanya.

Ini adalah referensi website untuk belajar Bootstrap :

• W3school
• GetBootstrap
• LayoutIt

Alat dan Bahan :

1. PC / Laptop
2. Koneksi Internet
3. Text Editor

Tahapan :

1. Buat folder terlebih dahulu, beri nama portal.
2. Download library di GetBootstrap .
3. Extrak hasil download dan masukan di folder portal.
4. Kemudian buat file index.html pada folder portal.
5. Masukan scriptnya
   
   
   
   
   
   
6. Jika sudah kita buka web browser. Hasilnya akan menjadi seperti gambar dibawah.
   

Semoga Bermanfaat !!!