#PART5 : Tutorial membuat web CV Dinamis menggunakan Laravel 5, Upload Photo Profile
Bismillah.. Assalaamualaikum..
Sekarang kita lanjut ke part 5.. Upload Photo Profile.
Part 5 ini sebetulnya adalah Part 4 yang tertinggal, karena ini masih masuk kedalam kategori manage Profile.
Langsung saja, langkah-langkah untuk upload photo profile adalah :
Pertama, kita akan tambahkan filed 'photo' pada table profile, cara untuk menambahkan nya, kita tidak langsung query ke table nya, tapi melalui file migration.
Buka cmd kalian, arahkan ke project direktori cv, kemudian ketikkan perintah ini :
Maka otomatis akan tercipta sebuah file migration baru yang berada di foler /database/migrations, untuk file migration yang baru saja dibuat biasanya berada di list yang paling bawah.
Buka file tersebut, kemudian modifikasi seperti dibawah ini :
Diatas kita menambahkan sebuah filed 'photo' dengan tipe data text, kenapa kita menggunakan tipe data text?
Karena field photo ini untuk menampung nama dari sebuah gambar, dan kita tidak bisa menebak berapa panjang karakter dari nama tersebut.
Setelah itu jalankan perintah ini :
Maka otomatis akan tercipta sebuah field baru pada table profile
Kemudian buat 2 buah route untuk upload photo, yang pertama menggunakan method get, dan yang kedua menggunakan method post, tambahkan seperti dibawah ini, ingat yaaa.. untuk semua route yang ada di admin, dibungkus kedalam middleware auth..
Diatas, kita mengarahkan nya ke Photo_controller yang ada di folder Admin.
Method get untuk mengarahkan ke file view nya, sedangkan method post untuk memproses upload photo nya.
Selanjutnya buat file controller yang bernama Photo_controller.php didalam folder /App/Http/Controllers/Admin
Buat 2 method, yaitu index dan store
Pada method index, kita hanya mendeklarasikan variabel title dan mengirim nya ke view phto_index.blade.php
Pada method store, seperti biasa, kita bungkus dengan try catch agar sistem tetap berjalan meskipun error.
$file->move($destinationPath,$file->getClientOriginalName()); <= ini adalah perintah untuk mengupload file nya ke dalam folder /public/uploads.
Jika kamu belum menambahkan folder uploads nya, silahkan di tambahkan/dibuat folder baru terlebih dahulu dan diletakkan di dalam folder /public.
Disana juga terdapat perintah untuk menyimpan nya ke dalam Database.
$pf = \DB::table('profile')->first(); Kita get data pertama dahulu yang ada di table profile, kita ambil id nya, kemudian update datanya dengan mengisi field photo dengan perintah berikut :
\DB::table('profile')->where('id',$pf->id)->update([
'photo'=>$file->getClientOriginalName()
]);
Tambahkan menu upload photo pada file /resources/views/layouts/sidebar.php
Sekarang coba buka menu upload photo nya, nnti pastikan akan muncul tampilan seperti ini :
Silahkan lakukan upload photo, jika berhasil akan muncul file baru di /public/uploads :
Dan di table profile. field photo akan terisi dengan nama file nya :
#PART6 : Tutorial membuat web CV Dinamis menggunakan Laravel 5, CRUD Pengalaman Kerja
#PART4 : Tutorial membuat web CV Dinamis menggunakan Laravel 5, Management Profile
Sekarang kita lanjut ke part 5.. Upload Photo Profile.
Part 5 ini sebetulnya adalah Part 4 yang tertinggal, karena ini masih masuk kedalam kategori manage Profile.
Langsung saja, langkah-langkah untuk upload photo profile adalah :
1. Alter Table profile dengan migration
Pertama, kita akan tambahkan filed 'photo' pada table profile, cara untuk menambahkan nya, kita tidak langsung query ke table nya, tapi melalui file migration.
Buka cmd kalian, arahkan ke project direktori cv, kemudian ketikkan perintah ini :
Maka otomatis akan tercipta sebuah file migration baru yang berada di foler /database/migrations, untuk file migration yang baru saja dibuat biasanya berada di list yang paling bawah.
Buka file tersebut, kemudian modifikasi seperti dibawah ini :
Diatas kita menambahkan sebuah filed 'photo' dengan tipe data text, kenapa kita menggunakan tipe data text?
Karena field photo ini untuk menampung nama dari sebuah gambar, dan kita tidak bisa menebak berapa panjang karakter dari nama tersebut.
Setelah itu jalankan perintah ini :
Maka otomatis akan tercipta sebuah field baru pada table profile
2. Buat route upload
Kemudian buat 2 buah route untuk upload photo, yang pertama menggunakan method get, dan yang kedua menggunakan method post, tambahkan seperti dibawah ini, ingat yaaa.. untuk semua route yang ada di admin, dibungkus kedalam middleware auth..
Diatas, kita mengarahkan nya ke Photo_controller yang ada di folder Admin.
Method get untuk mengarahkan ke file view nya, sedangkan method post untuk memproses upload photo nya.
3. Buat file Photo_controller.php
Selanjutnya buat file controller yang bernama Photo_controller.php didalam folder /App/Http/Controllers/Admin
Buat 2 method, yaitu index dan store
Pada method index, kita hanya mendeklarasikan variabel title dan mengirim nya ke view phto_index.blade.php
Pada method store, seperti biasa, kita bungkus dengan try catch agar sistem tetap berjalan meskipun error.
$file->move($destinationPath,$file->getClientOriginalName()); <= ini adalah perintah untuk mengupload file nya ke dalam folder /public/uploads.
Jika kamu belum menambahkan folder uploads nya, silahkan di tambahkan/dibuat folder baru terlebih dahulu dan diletakkan di dalam folder /public.
Disana juga terdapat perintah untuk menyimpan nya ke dalam Database.
$pf = \DB::table('profile')->first(); Kita get data pertama dahulu yang ada di table profile, kita ambil id nya, kemudian update datanya dengan mengisi field photo dengan perintah berikut :
\DB::table('profile')->where('id',$pf->id)->update([
'photo'=>$file->getClientOriginalName()
]);
4. Modifikasi file sidebar.php
Tambahkan menu upload photo pada file /resources/views/layouts/sidebar.php
Sekarang coba buka menu upload photo nya, nnti pastikan akan muncul tampilan seperti ini :
Dan di table profile. field photo akan terisi dengan nama file nya :
Part 5 selesai sampai disini.
Belum ada Komentar untuk "#PART5 : Tutorial membuat web CV Dinamis menggunakan Laravel 5, Upload Photo Profile"
Posting Komentar