temanlomba-blog

[temanlomba-blog]

[Sprint#3.2-Fam] I’ll push on

Berikut hal-hal yang telah saya lakukan

15 Mei 2017 saya pertama membuat test untuk melihat apakah page berhasil menampilkan post application yang sudah kita daftar $post = factory(\App\Post::class)->create();        $jobpost = factory(\App\JobPost::class)->create(["post_id" =>$post->id]);        $applicant = factory(\App\Applicant::class)->create(["post_job_id" =>$jobpost->id]);        $post->author = $user->id;        $post->save();        $jobpost->save();        $applicant->save(); .... $title = $post->title;        $response->assertSee($title) ; waktu(5 jam) 17 Mei 2017 kemudidan saya membuat controller untuk dapatkan query builder untuk post yang kita daftar adapun  flownya User->applicant(get by user_id)->jobpost(get by applicant.job_post_id)->post(get by jobpost.post_id) adapun query buildernya:

$postsApp = DB::table('jobs_post')            ->join('applicant', 'applicant.post_job_id', '=', 'jobs_post.id')            ->join('posts','posts.id','=','jobs_post.post_id')            ->select('title')->where('posts.author', $user->id)            ->get(); waktu (7 jam)

[temanlomba-blog]

[Sprint#3.2-IRF] I’ll push on

Berikut hal-hal yang telah saya lakukan

7 Mei 2017

Kali ini saya mendapatkan pekerjaan user story melihat recruitment yang telah dibuat pada laman manage post, pertama-tama saya mencoba untuk membuat testnya terlebih dahulu. Test yang ingin saya buat ada 3, pertama apakah rute tersebut ada, lalu apabila membuat post apakah muncul di manage post, yang terakhir apabila tidak membuat post apakah ada notice yang memberitahukan tidak ada apa-apa? Karena ada beberapa aspek dari unit testing dan controller yang belum saya mengerti oleh karena itu saya pelajari terlebih dahulu 

[5 Jam]

9 Mei 2017

Hari ini saya melanjutkan kembali membuat testing, akhirnya testingnya pn telah selesai, berikut salah satu test yang saya buat;

Setelah saya coba jalankan tesnya dan tidak ada error lagi saya push ke branch manage post dengan tag red, tapi ternyata hasil tes passed, akhirnya saya lihat kembali. Ternyata saya salah menempatkan test pada folder yang benar jadi testnnya tidak berjalan, akhirnya saya benarkan lagi dan lanjut untuk membuat front-endnya. Setelah mock-up manage post sudah dibuat saya push dahulu. Kemudian saatnya untuk membuat fiturnya, pertama-tama saya buat dahulu controllernya. Setelah mempelajari dari beberapa controller yang dibuat oleh rekan-rekan dan dari internet saya bisa membuatnya dengan cukup lancar, Berikut salah satu fungsi controller yang saya buat 

Pada controller ini intinya akan mengambil post yang telah di buat oleh user, bisa dilihat dari bagian pengambilan data dari tabel yang tertulis where(’author’m$user->id) . Seteah itu diintegrasikan dengan front-end di manage post, hasilnya sebagai berikut.

[Total alokasi waktu 7 jam]

12 Mei 2017

Hari ini saya mengerjakan kembali frontend-frontend untuk user story lainnya, salah satunya adalah di branch see_applied_recruits yang hampir mirip dari yang saya kerjakan, namun melihat semua recruitment yang user daftarkan. Tadinya akan dibuat seperti tab yang saya telah buat di frontend untuk my_recruits namun setelah diperhatikan kembali sudah ditetapkan kemarin untuk langsung menampilkan ke2-2nya akhirnya inilah yang saya hasilkan.

Selain itu saya mengedit juga tampilan dari view post, namun karena masih tidak terlalu suka dengan hasil akhir, pembuatan dilanjutkan di lain hari.

[Alokasi Waktu 4 jam]

14 Mei 2017

Hari ini saya tidak terlalu melakukan aktifikas yang berhubungan dengan mengoding, melainkan kebanyakan mereview yang sudah dikerjakan dan mempelajari beberapa hal. 

16 Mei 2017

Hari ini saya membenahi front-end yang ada di branc applying recruits, salah satunya di page recruitment tersebut, ada beberapa modifikasi-modifikasi yang dibuat di page, salah satunya sekarang konten ada background colornya, ada nama pembuat tidak ada tulisan authornya, label status dari post tersebut kini ada dibawah profile picture pembuatnya. Kemudian saya ubah juga sedikit untuk tampilan Available jobs yang ada, Hasilnya sebagai berikut.

Ketika saya mengerjakan ini saya menyadari sesuatu bahwa pada pembuatan jobs ada detail yang bisa diisi namun tidak ditampilkan, sehabis itu sama mengkonsultasikan hal tersebut dengan yang mengurusi user-story tersebut.

Setelah selesai membenahi recruitment page, saya mulai membenarkan front end yang ada di dashboard, sekarang jika dikecilkan foto profil dan option akan berdampingan, hal ini bisa diselesaikan dengan menambah class col di bootsrap. Sekarang navbarnya juga sudah dibenahi, jika dikecilkan sekarang option berupa link ke profil dan logout berubah bisa collapse.Navbar ini dibuat kembali dari awal menggunakan komponen yang ada dari bootsrap. 

[Alokasi Waktu 9 jam]

[temanlomba-blog]

[Sprint#3.2-SD] Karena PPL tidak hanya programming

WBreath in... Breath out...

5 Mei 2017

Saya memutuskan untuk mengambil user story baru dari backlog, yaitu applying recruitment. Inti dari user story ini adalah supaya pengguna dapat apply pekerjaan di post yang ada.

Pertama, saya membuat test case dahulu (obviously), push, red, lanjut kerjain programnya. Hari itu kira-kira back-end-nya sudah jadi, front-end-nya belum.

Intinya yang dilakukan di sini adalah mengambil data yang diperlukan dari database dan menampilkannya di front-end.

Tidak ada library baru yang digunakan dalam pengerjaan ini.

Waktu pengerjaan: 4 jam

9 Mei 2017

Saatnya menyelesaikan front end! Front end dikerjakan berdasarkan yang ada di balsamiq.

Setelah push, green. Lalu merge develop, up-to-date. Request merge ke develop, now we wait.

Waktu pengerjaan: 3 jam

11 Mei 2017

Berhubung belum ada komplain mengenai code saya sebelumnya, saya memutuskan untuk mempelajari hal-hal yang dirasa berhubungan dengan PPL.

RESTful API

Untuk mempermudah komunikasi antar perangkat lunak, dibuat sebuah konvensi API berdasarkan REST. Method-methodnya adalah get, post, put/patch, destroy.

Get digunakan untuk mengambil data dalam database atau mengambil form untuk method yang lain. Bisa digunakan untuk semua item (get index) atau satu item saja.

Post digunakan untuk membuat entry baru dalam database.

Put/patch digunakan untuk mengubah entry. Perbedaan put dan patch adalah put menghapus entry yang lama dan membuat entry yang baru sedangkan patch hanya mengganti dari entry yang lama.

Destroy digunakan untuk menghapus entry.

RESTful API bersesuaian dengan CRUD.

Contoh penggunaan di aplikasi kami:

Waktu pembelajaran: 4 jam.

14 Mei 2017

Ada sedikit masalah pada code saya sebelumnya. User dapat request apply tanpa memilih job (walaupun tidak mengubah isi database). Saya memutuskan untuk memberi error message untuk perlakuan tersebut.

Kemudian masalah lainnya user dapat apply job yang sama dua kali. Untuk mengatasinya, saya memutuskan untuk disable job yang sudah di-apply.

Waktu pengerjaan: 3 jam

16 Mei 2017

Masalah baru muncul lagi. User dapat membuat beberapa job yang sama di suatu post, jadinya di tampilan apply akan muncul job yang sama.

Saya memutuskan untuk mengatasinya dengan membuat satu checkbox dapat meng-apply job-job yang sama.

Misalnya seperti ini:

Dalam post 1 dibutuhkan tiga job 1 (Web Developer). Request untuk post_job_id akan berupa “1,2,3″, yang mana akan di-handle di ApplyController untuk dimasukkan ke database applicant.

(catatan: value dari input checkbox di html tidak menerima array, sehingga saya memutuskan untuk meng-implode-nya)

Setelah di-submit:

Waktu pengerjaan: 5 jam

[temanlomba-blog]

[Sprint#3.2-TYB] Recommend me some methods to manage time, please

Prakata

Pekan sprint ini adalah pekan yang sangat hectic. 24 jam dalam sehari serasa tidak cukup. Mengorbankan waktu pribadi dan tidur pun masih belum cukup. Tugas ini, tugas itu, banyak sekali. Setiap hari selalu saja ada deadline. Alokasi waktu untuk PPL akhirnya lagi-lagi belum bisa optimal. Padahal sudah janji pada diri sendiri untuk 3 jam sehari untuk PPL.

2017-05-08 (월) Alokasi waktu: 5 jam

Hari ini saya memulai membuat branch baru untuk backlog recommended recruitments. Seperti biasa, dimulakan dengan membuat unit test terlebih dahulu. Karena pada implementasi recommender system ini saya hanya menggunakan sebuah fungsi, maka saya cukup membuat sebuah test untuk fungsi tersebut saja. Setelah fase RED dalam membuat tes, kini saatnya membuat agar menjadi GREEN. Sebagai langkah awal, saya membuat fungsi kosong dari recommender system tersebut.

Selain itu saya juga memperbaiki front-end dan membuat migration untuk relasi skill ke job.

[Knowledge Sharing - jQuery]

jQuery adalah sebuah library JavaScript kaya fitur yang biasa digunakan untuk manipulasi DOM dan lainnya. jQuery semacam mempermudah penulisan JavaScript karena API-nya yang simpel dan lebih mudah daripada JavaScript.

Pada gambar gif di atas, saya menggunakan jQuery untuk mengganti tab dari Newest Recommendations ke Recommended Recommendations.

Awalnya, sebenarnya keduanya sudah ada pada laman tersebut, dengan jQuery, terdapat method .hide() yang dapat menyembunyikan suatu elemen serta .show() yang dapat memunculkan elemen. Keduanya memiliki sintaks yang mirip yaitu:

$( ".namaClass" ).hide(); dan $( ".namaClass" ).show();

Ketika tombol RECOMMENDED ditekan, maka jQuery memanggil fungsi .hide() untuk menyembunyikan Newest Recruitments dan .show() untuk memunculkan Recommended Recruitments.

Selain itu, saya juga menggunakan method .addClass() dan .removeClass(). Dari gambar di atas, bisa dilihat bahwa ketika menekan tab, maka tab yang aktif akan menjadi warna biru, warna tersebut muncl karena adanya class “active” pada elemen tersebut. Untuk menambah atu menghapus class pada DOM, dengan jQuery dapat dilakukan kedua method tersebut.

Berikut sintaksnya:

$( "#idElemen" ).addClass("namaClass"); dan $( "#idElemen" ).removeClass("namaClass");

Masih banyak fungsi dari jQuery yang menarik. Untuk lebih lengkapnya dapat dipelajari lagi di http://api.jquery.com/

2017-05-09 (화) Alokasi waktu: 5 jam

Hari ini adalah hari utama saya mengerjakan fitur saya. Hari ini saya melakukan implementasi dari fitur recommended recruitments. Simpel saja, berikut alur algoritma saya:

Sangat sederhana namun cukup bisa merekomendasikan suatu job kepada user dengan skill tertentu.

[Knowledge Sharing - Recommender System]

Recommender System adalah suatu sistem untuk memprediksi suatu ketertarikan user pada suatu item tertentu.

Terdapat beberapa pendekatan yang dapat dilakukan: 1. Collaborative filtering 2. Content-based filtering 3. Hybrid

Collaborative filtering adalah suatu pendekatan yang menggunakan data yang sangat besar dari behaviour banyak users. Biasanya melihat kemiripan antara satu user dengan user lain. Kecenderungan suatu user memiliki preferensi yang sama dengan user lain, maka item yang direkomendasikan akan mirip pula. Hal ini dapat dilakukan sebaliknya dengan melihat kemiripan pada satu item dengan item lain.

Content-based filtering adalah pendekatan dengan melihat deskripsi item dan mencocokkannya dengan preferensi user. Biasanya pada sistem yang seperti ini menggunakan keyword untuk mendeskripsikan item dan user profile untuk melihat apa yang user tersebut tertarik.

Hybrid merupakan gabungan dari keduanya.

Pada TemanLomba, kami menggunakan pendekatan content-based filtering. Dengan item adalah post recruitment, untuk mendeskripsikannya, kami menggunakan job. Kemudian user bisa mengisi skill yang dimilikinya pada profile-nya. Dari kedua data tersebut, kami mencocokkan skill apa terhubung pada job apa.

Lebih lanjut: slide kuliah DSA

2017-05-10 (수) Alokasi waktu: 4 jam

Hari ini saya menyempurnakan algoritma sistem rekomendasi yang saya buat kemarin. Dimulai dari tidak memunculkan recruitments buatan sendiri, meningkatkan efisiensi kode, dan memperbaiki bug-bug lain.

Selain itu, saya juga membuat seeder database yang digunakan untuk melakukan listing semua skill yang mungkin, job yang mungkin, serta mencocokkan skill mana ke job mana. Data awal dibuat secara manual pada dokumen Excel. Kemudian disimpan ke dalam bentuk csv. Lalu dibuat seeder dengan menggunakan file csv tersebut. Untuk melakukan ini, diperlukan library tambahan yaitu csv seder dari flynsarmy (https://github.com/Flynsarmy/laravel-csv-seeder).

[Knowledge Sharing - Laravel CSV Seeder]

Library ini akan memasukkan semua data dalam bentuk csv ke dalam database secara otomatis.

Untuk memasangnya pada proyek Laravel, jalankan perintah:

composer require "flynsarmy/csv-seeder:1.*" composer install

Untuk penggunaannya, harus memiliki file CSV dengan baris paling atas adalah nama kolomyang sesuai dengan yang ada pada database. Sebagai contoh, jika ingin mengimport csv dengan kolom id dan name pada database, maka file csv-nya seperti berikut:

id,name 1,Foo 2,Bar

Kemudian buat class yang mengextends Flynsarmy\CsvSeeder\CsvSeeder, definisikan nama table di database dan path ke file csv pada constructor, buat method run yang juga memanggil parent::run() seperti:

Setelah itu, letakkan file csv-nya di /database/seeds/csvs/your_csv.csv atau mana pun sesuai dengan path yang telah dituliskan di constructor.

Jalankan php artisan migrate --seed. Maka kemudian data pada csv sudah masuk ke dalam database.

Lebih lanjut: https://github.com/Flynsarmy/laravel-csv-seeder

2017-05-12 (금) Alokasi waktu: 3 jam

Hari ini saya mencoba melakukan merge ke branch develop. Namun ditemukan beberapa conflict.

Format file csv saya kurang tepat, saya memasukkan id pada file csv padahal jangan karena itu akan merusak auto increment pada database postgre. Kemudian adanya class yang sama, mengimplementasi method yang sama, namun isinya sedikit berbeda dan nama methodnya berbeda. Di sini saya melakukan refactoring untuk memperbaiki kodingan luar yang menggunakan method tersebut agar hanya cukup menggunakan satu method yang dipilih saja (karena maksud dari methodnya sama, hanya saja implementasinya sedikit berbeda).

[temanlomba-blog]

[Sprint#3.2-DZ] Quite busy aren’t we?

Beberapa minggu terakhir ini, sangat sulit untuk meluangkan waktu untuk mengerjakan sebuah fitur ditambah dengan blog yang harus memenuhi aspek pembelajaran luar dan dalam; dikarenakan mata kuliah lain yang memiliki deadline rutin setiap Jumat hingga Senin... namun kami tetap berjuang... 

2017/05/03 [3 jam]

Pada minggu awal sprint ini, saya tidak kebagian fitur MVP yang harus segera dikerjakan. Maka dari itu setelah minggu kemarin membuat semua coldfix, saya melanjutkan untuk mereview fitur yang telah ada. Pada bagian dashboard, Shandy telah membuat recruitment yang muncul berupa snippet sehingga tidak semua isi recruitment muncul pada dashboard.

Namun terdapat masalah yang cukup signifikan:

Snippet yang dibuat menggunakan cara .substring() dari data yang diambil dari database. Hal tersebut tidak apa-apa jika hanya teks biasa, namun karena menggunakan editor .summernote() yang notabene WYSIWYG, maka memungkinkan tag html tidak tertutup dengan benar.

Penyelesaian:

Dapat diselesaikan dengan membatasi secara visual recruitment yang panjang, memberikan 'height: {some value}' pada tampilan kemudian memberikan atribut 'overflow: hidden' sehingga element yang keluar dari batas dibuat tidak terlihat.

2017/05/08 [8 jam]

Hari ini, Thoyib yang membuat salah satu fitur MVP (Recommended Recruitments) menyampaikan bahwa ada fitur pendukung yang belum dibuat. Kemudian saya yang sedang tidak mengerjakan fitur mengambil pekerjaan tersebut. Fitur tersebut adalah "Adding required jobs dynamically to a recruitment". Seketika terpikir untuk membuat fitur tersebut menggunakan jQuery, dan saya juga cukup mahir dalam menggunakannya. Berikut fitur yang telah dibuat:

Pembuatan fitur tersebut dapat dirangkum sbb:

Membuat 1 tampilan form untuk sebuah entitas job

Untuk membuat dynamic, berikan akses untuk menambahkan entitas baru

Dengan menggunakan fungsi jQuery .clone(), maka kita dapat menggandakan entitas yang sudah ada

Tambahkan entitas baru tadi ke dalam parent yang mengandung entitas tersebut dengan fungsi .append().

Tambahkan pula akses untuk menghapus entitas yang sudah ada setiap kali entitas baru muncul dengan .remove().

Untuk pengambilan data, berikan atribut name pada input dengan format array e.g. name = 'jobs[]'

Kemudian untuk front-endnya:

Kesulitan yang ditemukan saat membuat fitur tersebut:

Fitur yang dibuat dinamis mengandung framework yang harus diatur sejak loading page: Semantic dropdown.  Penyelesaian: setiap kali penambahan entitas, perlu untuk reformat dengan $(selector).dropdown().

Terdapat lebih dari 1 element menggunakan framework yang sama, sehingga reformat mengefek pada element lain. Penyelesaian: pemilihan $(selector) spesifik untuk element yang harus di-reformat.

Selebihnya ada beberapa kesulitan untuk mencari fungsi jQuery yang tepat; Penyelesaian: .clone() untuk menggandakan entitas, dan .closest('selector') untuk mencari parent terdekat yang spesifik.

2017/05/09 [2 jam]

Hari ini saya bertemu dengan Thoyib dan membicarakan tentang sistem rekomendasi recruitment yang algoritmanya sudah mencakup 80% penyelesaian. Karena kemarin saya telah membuat fitur pendukung yang diminta, maka kami segera menyatukan fitur-fitur tersebut.

Setelah digabungkan, fitur tersebut bekerja seperti layaknya yang diinginkan:

User yang memiliki skill x maka direkomendasikan untuk recruitment dengan job yang berhubungan dengan skill x. Namun algoritma yang telah dibuat Thoyib dapat menimbulkan error pada fungsi php: array_unique yang digunakan untuk menghindari rekomendasi recruitment yang sama. Pada fungsi array_unique($array), $array harus memiliki element berupa string sedang algoritma memungkinkan adanya objek Eloquent Collection Post.

Hal tersebut akhirnya dapat kami selesaikan dengan trik yang cukup mudah, yaitu memberikan argumen kedua pada fungsi sehingga: array_unique($array, SORT_REGULAR) sehingga dapat melakukan komparasi objek regular.

2017/05/16-17 [15 jam]

Hari ini saya membuat beberapa hal yang cukup rumit namun belum bisa menuangkannya dalam tulisan, maka dari itu beberapa cuplikan akan diberikan sebisa mungkin sehingga diharapkan dapat membantu yang lain:

Predefined Dynamic Seeder

Seeder dinamis yang dirancang agar item yang terbuat sesuai yang diinginkan dan tidak melanggar duplicate key constraint dengan prinsip pigeon hole.

Kemudian pada seeder:

Joined Multiple Form Valued Table

Join yang terdiri lebih dari 3 table untuk diagregasi valuenya. Value tersebut harus dikirim kan pada table yang memiliki fungsi independen pada setiap row-nya sehingga memerlukan banyak form untuk requestnya.

Kemudian ada bagian viewnya

Berikut hasil beserta tampilannya

[temanlomba-blog]

[Sprint #3.1-FAM] Sprint 3 preparation

[Pra sprint 3] 26 april 2017 -Membuat test untuk edit post

Yang dites adalah : 1) bila kita ingin mengedit post yang tidak kita bikin akan redirect 2) bila mengedit post buatan kita maka akan menuju edit page

3) test apakah setelah di edit database terupdate

-mengerjakan validator form untuk edit page dan validasi user untuk edit page

waktu pengerjaan 12 jam [After develop] 27 -  April 2017 mendesign database untuk fitur post aplication menenetukan deadline waktu 2 jam

[temanlomba-blog]

[Sprint #3.1-SD] Before and After Deployment

Berhubung dua minggu kemarin banyak tugas dari mata kuliah lain, tidak banyak yang saya kerjakan.

25 April 2017

Malam sebelum deployment, saya dan tim memutuskan untuk melakukan jam. Tujuan dari jam ini adalah untuk memastikan bahwa tidak ada masalah pada jam esoknya.

Hal-hal yang dilakukan:

Mengganti input calendar dari jQuery UI menjadi semantic

Alasan penggantian: estetika

Before:

After:

Implementasinya cukup mudah. Kami menggunakan Laravel jadi kami mengunduh file js dan css secara manual dari:

https://github.com/mdehoog/Semantic-UI-Calendar/tree/master/dist

Kemudian untuk front-end nya:

Kami tidak menemui masalah ketika mengerjakan ini.

Implementasi edit post page

Edit post dimodifikasi dari create post, perbedaannya adalah pada edit post, input yang ada sebelumnya dimunculkan lagi

var code akan menyimpan content sebelumnya, lalu di-paste ke summernote dengan metode pasteHTML

tag sebelumnya dimunculkan melalui semantic dengan metode set selected dengan input berupa array.

Waktu pengerjaan: 8 jam

3 Mei 2017

Saya memperbaiki beberapa hal di dalam coldfix, di antaranya:

Post tidak muncul dengan benar di dashboard

Content tersimpan dengan format HTML, untuk menampilkan dengan benar di Laravel Blade, perlu menggunakan “{{! !}}”, bukan “{!! !!}”

(merah berarti code yang salah, hijau berarti code yang benar)

Summernote tidak menampilkan content jika content terlalu panjang

Untuk menyimpan text yang panjang pada JavaScript, perlu mengunakan ` (pada keyboard QWERTY, tombol terdapat di sebelah kiri tombol 1), bukan “

Edit post menambahkan tag p pada content

Default setting pada summernote akan menambahkan tag p untuk setiap text yang akan disimpan, terutama jika dimunculkan dengan pasteHTML. Ganti fungsi dengan code.

Munculkan hanya snippet content di dashboard

Laravel memiliki fungsi strlimit(string, length). Fungsi ini akan memotong string sepanjang length.

Waktu pengerjaan: 2 jam

[temanlomba-blog]

[Sprint #3.1-TYB]

2017-04-30 Alokasi waktu: 3 jam

Hari ini kami sekelompok berkumpul untuk membahas backlog untuk pada Sprint ketiga. Selain itu, kami juga sudah mencoba untuk membagi-bagikan pekerjaan ke tiap-tiap anggota tim pengembang.

Di sini menariknya kami menemukan suatu fitur yang cukup rumit, yaitu Recommender System. Pada aplikasi kami, user memiliki skill, dan recruitment memilki job. Kami ingin bagaimana job tertentu dapat muncul direkomendasikan pada user yang memiliki job tertentu.

2017-04-31 Alokasi waktu: 1 jam

Hari ini kami melakukan sprint planning dengan scrum master. Dari hasil diskusi, kami memangkas beberapa fitur menjadi MVP kami. Dengan begitu, fokus utama kami cukup pada MVP tersebut saja dahulu. Selain itu, kami juga sudah mulai memasukkan backlog pada Pivotal Tracker.

2017-05-01 Alokasi waktu: 3 jam

Hari ini saya melakukan pencarian mengenai sistem rekomendasi. Meskipun sebelumnya sudah dikatakan bahwa kami akan membuat data manual untuk rekomendasi sistem ini, namun saya penasaran.

Saya menemukan library sistem rekomendasi bernama Recombee.

Pada Recombee, terdapat tiga komponen utama, yaitu User, Item, dan Interaksi User-Item. Recombee kemudian mengasumsikan bahwa ada katalog item yang tersedia untuk user, kemudian dapat melakukan interaksi: - Purchase (dapat diganti dengan apply pada sistem kami) - Rate - Bookmark - View detail - Add to cart

Implementasi dari Recombee juga cukup mudah. Berikut contohnya dari situs Recombee:

Pertama, klien dibuat. Kemudian ketika user melakukan purchase, maka kirimkan data interaksi tersebut ke Recombee client.

Dari data-data yang dikirimkan tersebut, Recombee sudah langsung dapat mengembalikan item rekomendasi. (dari contoh tersebut mengembalikan 5 item dengan melihat kemiripan user)

2017-05-03 Alokasi waktu: 1 jam

Saat ini saya melakukan coldfix untuk fitur login saya. Login saya tidak bisa menerima user yang tidak memiliki NPM (seperti staf atau dosen).

Sementara saya baru melakukan kondisi yang memiliki NPM yang bisa masuk saja. Selain itu saya berikan error.

[temanlomba-blog]

[Sprint #3.1-IRF] This one’s cold

Berikut hal-hal yang telah saya lakukan.

25 April 2017

Sebelumnya untuk mengontrol user ketika masuk landing page  berdasarkan sudah login atau belum ada di routenya, namun setelah dipertimbangkan lagi, akhirnya dibuatlah controller terpisah agar bisa di test terlebih dahulu. Akhirnya saya buatlah test untuk controller tersebut dengan cara seperti berikut.

apabila belum login apabila di cek url ‘/’ akan mengembalikan landing page, dan apabila sudah login jika di cek url ”/” akan mengembalikan redirect ke url ”/dashboard”

Alokasi Waktu: 3 jam

26 April 2017

Pada hari ini saya membetulkan tampilan-tampilan yang bermasalah terutama footer, karena untuk beberapa halaman, footer menghalangi kontennya tersebut. 

Alokasi Waktu: 2 jam

2 Mei 2017

Hari ini saya membetulkan beberapa tampilan di coldfix. Salah satunya membetulkan landing page, karena ternyata awalnya pada mode mobile view tobol loginnya tertutup. kemudian pada dashboard apabila pada mobile view foto profile akan ada ditengah layar. Kemudian saya mengupdate tampilan untuk melihat post yang telah dibuat, hasilnya seperti berikut.

*gambarnya yang tidak keload tidak usah dihiraukan*

Alokasi waktu: 4 jam.

Jadi sampai situlah hal-hal yang telah saya lakukan.

[temanlomba-blog]

[Sprint#3.1-DZ]

...

[2017/04/27][~2 Jam]

Hari ini kami melakukan rapat, berdiskusi mengenai apa yang akan kami tentukan pada sprint planning. Berikut beberapa point yang kami dapatkan dari hasil rapat:

Review dan eksplorasi backlogs

Permasalahan yang akan dihadapi dan solusinya

Pembagian kerja dan breakdown tugas

Penentuan deadline

[2017/04/08][~4 Jam]

Hari ini saya mencoba mengerjakan beberapa pekerjaan yang menjadi coldfix, namun sebelumnya saya melakukan:

Pembuatan Gitlab issue

Penentuan berdasarkan perencanaan sebelumnya

Pembuatan branch coldfix

Kemudian saya mulai mengerjakan coldfix:

Workaround SSO untuk NIP dosen

Penggantian date ke timestamp agar urutan post terbaru pada dashboard benar

Pengubahan akses penulisan tanggal lomba menjadi hanya bisa diklik

...

[temanlomba-blog]

[Sprint #2.2-IRF]

Yang telah saya lakukan:

7 April 2017

Pada hari ini saya mulai mengerjakan tampilan frontend untuk user story login sso, yakni landing pagenya. Pertama-tama saya melihat dahulu mockup yang telah dibuat sebelumnya di balsamiq, kemudian saya melihat-melihat dahulu contoh-contoh landing page situs lain sebagai referensi. Setelah mendapatkan gambaran apa yang akan dibuat, saya membuat terlebih dahulu asset-asset yang ingin digunakan di dalam desainnya menggunakan photoshop. Setelah itu akhirnya saya memulai mengoding tampilan. 

Estimasi Waktu: 4 jam

11 April 2017

Hari ini saya melanjutkan kembali mengerjakan tampilan laman landing page. Hasil akhir dari yang lalu masih belum berbentuk yang bagus dan masih tidak responsif. Berikut hasil akhir dari landing page yang dikerjakan.

Pada awalnya image background tidak berupa css berupa ‘backgrund-image’ tapi merupakan tag img, dengan komponen-komponen lainnya mempunyai sifat relative yang nantinya akan diposisikan sesuai tempatnya, namun ternyata cara ini tidak cocok dengan apa yang diinginkan dan responsivitasnya sangat buruk, akhirnya digantilah menjadi tag body mempunyai style background image. Sisanya tinggal menggunakan colom yang disediakan bootstrap dan menggunakan margin:auto agar asset-aset gambar lainnya ditengah.

Estimasi Waktu: 4 jam.

19 April

Setelah seminggu lebih vakum tidak mengerjakan apa-apa dikarenakan kondisi kesehatan yang tidak sehat, kegiatan keluarga, dan timemanagement yang kurang saya akhirnya fokus kembali mengerjakan kembali sisa-sisa tugas saya. Setelah memberi polesan-polesan terhadap landing page yang telah dibuat kemarin akhirnya di push-lah ke ke gitlab PPLC1, Kemudian saya mulai mengerjakan tampilan lain yaitu create post Pada awalnya ada kesulitan sedikit karena ada error yang bertuliskan “Machine actively refusing” ketika pertama kali login(yang berarti data user tidak bisa dimasukan ke tabel), setelah mencari-cari akhirnya bisa diatasi dengan mengganti value dalam  controller login yang asalnya local menjadi testing.

Setelah bisa saya melanjutkan mengerjakan create post, hasil akhirnya sebagai berikut.

namun ada sesuatu hal yang mengganggu, yaitu double scroll, jika dilihat disamping ada 2 buah scroll. Hal ini disebabkan oleh css yang ada padding-bottom, namun padding itu digunakan agar konten tidak tertutupi oleh footer, hal lain yang mempengaruhi ini juga karena Semantic UInya. Namun hal ini sudah teratasi, lebih jelasnya bisa dilihat di post yang dibuat oleh Dzulham Azham.

Estimasi Waktu: 11 jam

[temanlomba-blog]

[Sprint#2.2-SD] Tagging Post

Hello. It’s me again.

11 April 2017

Jadi, setelah selesai membuat input untuk post, tugas saya selanjutnya adalah untuk membuat tagging dropdown. Jadi, setiap post ada tagnya (bisa lebih dari satu), dan rencananya untuk inputnya dibuat dropdown supaya bisa dipilih, dan kalau tidak ada bisa dibuat baru.

Untuk implementasi awal saya menggunakan jQuery UI. Implementasinya cukup mudah, cukup mengambil apa yang ada di website jQuery UI (bisa dicek di: https://jqueryui.com/autocomplete/#multiple dan disesuaikan dengan kebutuhan).

Hasil implementasinya pun cukup sederhana.

Implementasi ini juga sudah bisa masuk ke database (input baru maupun lama).

Waktu yang digunakan: 6 jam

13 April 2017

Tim saya mengatakan bahwa jQuery UI tidak cukup indah digunakan. Oleh karena itu saya mencoba mencari implementasi yang lain. Setelah dilakukan pencarian, saya mencoba menggunakan Bootstrap Tags Input dan typeahead. Namun untuk hari itu, implementasi belum dapat dilaksanakan dengan benar, sehingga pengerjaan dilanjutkan di hari lain.

Selain itu, saya juga menemukan bahwa summernote bisa di-install melalui composer (bisa dicek di packagist.org), namun berhubung dokumentasi summernote di php dan laravel tidak ada, saya memutuskan untuk hanya mengunduh js dan css-nya saja.

Waktu yang digunakan: 4 jam

16 April 2017

Hari itu kelompok kami memutuskan untuk mengerjakan proyek ini bersama-sama. Saya pun mencoba untuk membuat bootstrap tag dan typeahead bekerja baik dengan semestinya, namun tetap saja tidak berhasil. Oleh karena itu, kelompok kami memutuskan untuk menggunakan Semantic UI. Dan Semantic UI works like a charm. Implementasinya cukup mudah.

Awalnya, input tidak terbaca sebagai array (yang terbaca hanya input pertama). Namun, setelah dilakukan modifikasi, akhirnya bisa dibaca sebagai array.

Selain itu, saya juga menghapus beberapa input awal (seperti author yang harusnya diambil dari session dan date_post yang sudah disediakan oleh laravel) dan mengganti input date_lomba menjadi jQuery UI Calendar.

Waktu yang digunakan: 10 jam.

Berhubung saya merasa pekerjaan saya sudah selesai, saya belum melanjutkan lagi. Mungkin akan dilakukan sedikit refactor.

[temanlomba-blog]

[Sprint#2.2-TYB] Sso... My Feature Has Finished

Yang telah saya lakukan:

2017-04-07 (금) Waktu yang telah dialokasikan: 5 jam

Hari ini, dibantu dengan Dzulham, saya mencoba menyelesaikan masalah yang terjadi pada testing di mana UnitPHP mengalami error ketika berjalan. Setelah mencoba-coba mencari sumber permasalahnnya, akhirnya ditemui hal tersebut terjadi ketika pemanggilan fungsi dari library SSO. Penyelesaian masalah untuk ini saat ini masih dengan cara kotor, yaitu dengan tidak memanggil fungsi SSO apabila environment-nya adalah testing.

Setelah masalah test selesai, saya bersemangat untuk melanjutkan penyelesaian fitur saya. Pertama yang saya lakukan adalah mengubah kode yang saya buat sebelumnya menjadi lebih elegan. Salah satu yang saya ubah adalah kode ketika user melakukan pertama kali login dan terdaftar secara otomatis ke database. Dari yang sebelumnya saya mencoba mengambil dari database, ketika tidak ada maka akan insert user baru ke dalam database, kemudian saya ubah menggunakan cara Laravel dengan method:

User::firstOrCreate();

Berikut implementasi lengkapnya:

$user = User::firstOrCreate( ['npm' => $npm],    [     'name' => ucwords(strtolower($name)),        'year' => '20'.substr($npm, 0, 2),        'contact' => 'Email: '.$email.', LINE: ...',        'role' => 1    ] );

Kode tersebut akan melakukan pencarian user dengan NPM yang terdapat pada variabel $npm, kemudian jika tidak ditemukan maka akan meng-insert user dengan NPM tersebut, dan memasukkan atribut-atribut lain yang dimasukkan sebagai array pada parameter kedua dari method firstOrCreate() Laravel.

Kemudian yang saya lakukan berikutnya adalah menambahkan middleware. Middleware adalah mekanisme yang melakukan filtering request HTTP ketika masuk ke dalam aplikasi. Middleware yang saya tambahkan adalah melakukan pengecekan apakah user telah login untuk bisa menggunakan aplikasi TemanLomba ini.

Untuk membuat middleware pada Laravel dapat dilakukan perintah artisan:

php artisan make:middleware CheckLogin

Perintah tersebut akan membuat berkas PHP untuk middleware yang ingin kita buat. Di dalam berkas tersebut, kita kemudian dapat implementasikan logic yang ingin kita buat. Misal, pada yang akan saya buat, yaitu user akan redirect ke landing page apabila mencoba mengakses fitur-fitur lain pada aplikasi TemanLomba. Berikut implementasi saya:

public function handle($request, Closure $next) {    // Check if already login    if ($request->session()->has('npm')) {        return $next($request);    // Return to landing page if not logged    } else {        return redirect('/')->with('error', 'Please login.');    } }

Kemudian masukkan class tersebut ke dalam class \App\Http\Kernel:

protected $routeMiddleware = [    'auth' => \Illuminate\Auth\Middleware\Authenticate::class,    'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,    'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,    'can' => \Illuminate\Auth\Middleware\Authorize::class,    'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,    'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,    'login' => \App\Http\Middleware\CheckLogin::class, ];

Setelah itu berikan middleware tersebut pada route, sebagai contoh, pada route dashboard sebagai berikut:

Route::get('dashboard','DashboardController@index')->middleware('login');

Akhirnya middleware selesai, dan user yang belum login tidak akan bisa masuk ke halaman yang tidak seharusnya bisa dimasuki.

Selanjutnya yang saya lakukan adalah melakukan handling exception. Pada library SSO, terkadang tanpa sebab muncul exception seperti ini:

Agar tidak muncul lagi, maka saya dapat melakukan exception handling dengan menggunakan try catch.

Exception tersebut muncul ketika dilakukan pemanggilan method pada class SSO. Dengan begitu, saya memasukkan semua pemanggilan method SSO pada try dan melakukan catch CAS_Exception (CAS_AuthenticationException adalah subclass dari CAS_Exception) seperti berikut:

try { SSO::authenticate(); ... } catch (CAS_Exception $e) { return redirect('login'); }

Exception ini biasanya hilang ketika halaman login dicoba diakses kembali sehingga untuk menyelesaikannya saya cukup melakukan redirect ke halaman tersebut kembali.

Dengan demikian, saya bisa memastikan bahwa fitur yang saya kerjakan telah selesai.

2017-04-07 (토) Waktu yang telah dialokasikan: 4 jam

Hari ini saya mencoba menyempurnakan fitur saya dengan integrasi frontend. Yang saya kerjakan adalah memberikan warning message kepada user untuk melengkapi profile-nya ketika ia baru pertama kali login (baru terdaftar ke sistem). Untuk melakukannya, ketika redirect, saya cukup melakukan method chaining dengan with() pada method redirect(). with() akan memberikan flash session yang hanya akan ada pada request berikutnya.

return redirect('profile/edit')->with('warning', 'Please complete your profile first before using TemanLomba.');

Setelah itu pada frontend-nya tinggal cetak pesan dalam variabel warning tersebut.

@if (session('warning')) <div class="alert alert-warning alert-dismissable"> <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a> {{ session('warning') }} </div> @endif

Kemudian yang saya lakukan berikutnya adalah meng-handle apabila yang login bukan mahasiswa Fasilkom.

Setelah berdiskusi dengan Dzulham, kami memutuskan untuk melempar Error 403 - Forbidden ketika user tersebut mencoba login. Untuk melakukan ini saya perlu membuat frontend yang dituliskan di /resources/views/error/403.blade.php. Kemudian untuk memberikan error tersebut, cukup dengan perintah:

return abort(403, 'You are not a Computer Science student.<br />Click <a href="'.url('logout').'">here</a> to logout from SSO.');

Perintah tersebut akan memberikan error dengan kode 403 dan pesan “You are not a Computer Science student. Click here to logout from SSO.”. Dengan adanya blok baru tersebut, maka saya perlu menambahkan test terlebih dahulu.

Untuk meng-assert suatu error, pada phpunit, tidak dengan method. Hal tersebut dilakukan pada comment sebelum method test-nya. Berikut comment-nya:

/** * Test fungsi doLogin pada LoginController untuk mahasiswa Non-Fasilkom. * Seharusnya akan melemparkan error 403. * * @expectedException \Symfony\Component\HttpKernel\Exception\HttpException * @expectedExceptionMessage You are not a Computer Science student.<br />Click <a href="http://localhost:8000/logout">here</a> to logout from SSO. */

Terdapat dua cara yang dapat dilakukan untuk menangkap error-nya. Yaitu dengan kode atau dengan message.

Dengan kode dituliskan:

@expectedExceptionCode 403

dan dengan message dengan:

@expectedExceptionMessage <the message>

Namun entah mengapa saya tidak bisa dengan kode, akhirnya saya melakuannya dengan message.

Dengan begitu, selesai lah fitur saya.

2017-04-16 (일) Waktu yang telah dialokasikan: 6 jam

Dua minggu belakang saya tidak dapat mengalokasikan seminggu saya selama 18 jam. Hal tersebut karena saya bingung apa yang harus saya kerjakan lagi.

Kemudian pada hari ini kami sekelompok memutuskan untuk melakukan coding bersama.

Terdapat beberapa pekerjaan dari sprint 1 yang ternyata sebenarnya lupa tertuliskan pada backlog. Karena sifat agile yang adaptif terhadap perubahan, maka kami dengan inisiatif melakukan pekerjaan tersebut.

Pekerjaan yang saya lakukan adalah menampilkan skill-skill dari table join user_skill pada halaman profile.

Pada desain database kami, satu user bisa memiliki banyak skill dan satu skill bisa dimiliki oleh banyak user. Dengan begitu, hal tersebut merupakan relasi many-to-many. Dengan menggunakan eloquent dari Laravel dengan mudahnya kita dapat mengambilnya dari database tanpa perlu melakukan perintah join-join lagi.

Untuk relasi many-to-many, dapat ditambahkan belongsToMany() pada model-nya. Saya menambahkan fungsi skills, untuk mengambil semua skill yang dimiliki user, pada model User.

public function skills() {    return $this->belongsToMany('App\Skill', 'user_skills', 'user_id', 'skill_id'); }

Fungsi tersebut akan bisa mengembalikan semua skill yang dimiliki user. Untuk method belongsToMany(), terdapat beberapa parameter yang dapat dimasukkan. Parameter pertama adalah model dari skill-nya, parameter kedua menunjukkan nama join table kedua relasi pada database. Parameter ketiga adalah nama foreign key dari user ke join table tersebut. Parameter keempat adalah nama foreign key dari skill ke join table tersebut.

Kemudian untuk mengambil semua skill yang dimiliki, pada controller dapat dilakukan pemanggilan fungsi tersebut lalu di-chain dengan method get().

$user = User::where('npm', $npm)->first(); $user->skills = $user->skills()->get();

Selain itu, kami juga mencoba menggunakan CSS framework lain yaitu Semantic UI. Untuk memasang Semantic UI, dapat diunduh pada semantic-ui.com dan masukkan pada folder public/semantic/dist/.

Pada frontend, tambahkan pada head:

<link href="{{ asset('semantic/dist/semantic.min.css')}}" rel="stylesheet">

dan tambahkan file javascript-nya (biasanya sebelum </body>):

<script src="{{ asset('semantic/dist/semantic.min.js') }}"></script>

Kendala:

Fitur ternyata dapat diselesaikan dengan sangat cepat. Sehingga, ketika telah selesai, saya menjadi bingung harus mengerjakan apa. Hal tersebut membuat alokasi waktu tidak maksimal.

Selain itu, secara teknis sudah lancar.

[temanlomba-blog]

[Sprint#2.2-DZ] Ham::storage, Dzulham Cloud Storage.

Kutipan dari sprint 2.1 karena nyambung pada sprint 2.2

[2017/04/04][~7 Jam]

Hari ini saya lanjutkan untuk membuat API dari webhosting gratis di idhostinger saya untuk menggunakan server tersebut sebagai cloud storage. Awalnya saya tidak berfikir untuk membuat API melainkan sekedar mencari cara untuk mengirimkan files lewat php tanpa perantara form. Berikut cara dasar jika menggunakan form ...

continues...

[2017/04/05][~10 Jam]

Hari ini merupakan jadwal individual review. Saya menceritakan tentang masalah saya tentang cloud storage kepada Pak Ade. Beliau menyarankan untuk memakai MongoDB yang juga dipakai oleh FUKI (salah satu organisasi di Fasilkom UI). Setelah membicarakan tentang MongoDB dengan kelompok, maka diputuskan untuk memakai MongoDB hanya untuk penyimpanan file.

Laravel tidak menyediakan support langsung dengan integrasi mongoDB sehingga untuk itu kita harus melakukannya secara manual.

Instalasi laravel dimulai dengan install program di os masing-masing sehingga memilki mongod.exe. Kemudian untuk support pada developing environment seperti wamp maka dapat menambahkan extension php_mongodb ke dalam folder ext dan mengaktifkannya pada php.ini

Installasi dependensi composer dengan:

composer require mongodb/mongodb

Setelah itu, kita dapat menggunakan kelas MongoDB untuk melakukan koneksi ke server dan memanggil GridFS untuk cloud storage.

Untuk laravel, jenssegers telah membuat MongoDB yang sudah terintegrasi dengan eloquent (Moloquent) sehingga mempermudah penggunaannya.

composer require moloquent/moloquent

PROBLEM!

Penggunaan MongoDB mengharuskan installasi MongoDB pada heroku juga sehingga kembali pada masalah awal, yaitu dependensi heroku.

[2017/04/06][~8 Jam]

Masih pada topik yang sama, pencarian cloud storage dilanjutkan. Singkat cerita, saya menemukan bahwa cURL dapat digunakan untuk mengirimkan superglobal $_POST termasuk $_FILES.

Di atas merupakan fungsi yang saya buat untuk mengirimkan file dengan curl ke server saya (dzulham.ga).

curl_init digunakan untuk memulai koneksi ke alamat yang akan menerima request tersebut. Dalam hal ini, $target_url saya berisi 'http://dzulham.ga/api/ham/'

curl_setopt digunakan untuk pengaturan opsi, CURLOPT_POST true mengaktifkan request sebagai POST. CURLOPT_POSTFIELDS diisi dengan array yang mengandung variable dan nilai yang akan dikirim. CURLOPT_RETURNTRANSFER true mengaktifkan request untuk mengirimkan balik hasil keluaran server.

curl_exec mengeksekusi request dengan opsi yang sudah diberikan sebelumnya.

curl_close menutup koneksi.

Untuk mengirimkan file, maka menggunakan CURLfile:

'file' => new \CURLFile($file, $file->getMimeType(), $file->getClientOriginalName())

[2017/04/07][~12 Jam]

Akhirnya permasalahan telah terlihat solusinya. Saya membuat sebuah class Ham yang dapat digunakan sebagai API cloud storage ke dzulham.ga. Berikut penggunaan Ham (Ham Adorned Mar):

Menggunakan kelas Ham dengan:

use App\Parties\Ham;

Demikian akhirnya saya dapat upload file ke cloud storage tanpa dependensi di GitLab CI maupun Heroku.

[2017/04/08-10][~20 Jam]

Tiga hari berturut-turut ini saya habiskan untuk merge seluruh cabang pada sprint 1 ke cabang develop sehingga dapat terlihat pada deployment server di temanlomba-dev.herokuapp.com. Selama merging, seperti yang sudah saya sampaikan, saya memakai GUI yaitu Visual Studio Code yang juga sudah memiliki fitur untuk mempermudah penyelesaian conflict.

Kemudian pada cabang view_latest_posts. Shandy sudah membuat banyak test database menggunakan DB Facades. Berikut contoh dasar penggunaan DB Facades:

use Illuminate\Support\Facades\DB;

function getUsers() {

      return DB::table(’users’)->get();

}

Saya merekomendasikan penggunaan eloquent model sehingga nanti dapat diberikan pada factory untuk seeding.

Eloquent Model Post

Model tadi dapat dipakai pada factory 

Sehingga mempermudah otomasi pada Database Seeding

[2017/04/~20]

Karena bagian saya pada sprint ini telah terselesaikan, maka saya memutuskan untuk membantu anggota lain saat bekerja melakukan bagian sprint-nya selama jangka waktu ini.

[Sticky footer problem ]

Dalam pembuatan front-end, Irfan memiliki masalah dalam pembuatan footer yang diinginkan. Ditambah lagi jika menggunakan dropdown yang elementnya overflow, maka footer akan membuat scrollbar menjadi ganda. Berikut workaround yang saya lakukan:

Pada bagian stylesheet.css, terdapat element .container.content yang mengandung konten dari page selepas dari footer. Dengan menggunakan calc(100vh - [some value]px) pada min-height, maka footer dapat stick to the bottom of the page.

[Semantic multiple dropdown search]

Dalam pembuatan fitur create post, terdapat fitur yang menggunakan Multiple Dropdown Search. Maka dari itu, kami menggunakan Semantic UI. Saya menggunakan element tersebut pada bagian skill di fitur edit profile page.

Kemudian pada bagian blade templatenya:

...

[temanlomba-blog]

[Sprint #2.1-IRF] The Sprint Continues

Yang telah saya lakukan:

1 April 2017

Pada hari sebelumnya, telah dilaksanakan sprint planning, namun sayangnya saya tidak bisa ikut karena sudah ada janji dengan dokter. Oleh karena itu pada hari ini saya berkumpul bersama Thoyib dan Dzulham untuk mendiskusikan apa yang telah dibahas kemaren. Setelah me-review apa user story yang akan diambil pada sprint kali ini, saya membuat git-lab issue yang berisi task-task yang harus dikerjakan.

[Alokasi waktu: 3.5 Jam]

Sejauh ini, baru ini saja yang saya sudah lakukan.

[temanlomba-blog]

[Sprint 1.3 FAM]

28 Maret 2017 Pembuatan fitur

Pembuatan fitur pengambilan 10 post teratas

controller $post = DB::table('posts')               ->orderBy('date_post','desc')               ->take(10)               ->get(); return view('dashboard', ['post' => $post]);

Secara dasar saya mengambil model post yang sudah ada lalu dengan menggunakan query builder dari laravel saya membuat query pengambilan data view

<?php $arrayPosts = sizeof($post); $count=$arrayPosts-1; ?> @while ($arrayPosts-- > 0)            <div class="post">              <div class="row">                <div class="profile-pict col-md-2">                  <img class='post' src="{{ asset('img/pf_dummy2.png')}}" />                </div>                <div class="col-md-10"> <h4> {{$post[$count-$arrayPosts]->title}}</h4> <p> {{$post[$count-$arrayPosts]->content}}</p>                </div>              </div>            </div><!--/.col-xs-6.col-lg-4-->            @endwhile dari data post yang sudah dikirim melalui controller saya mebuat pengambilan data tersebut dengan melooping data2 yang dikirim Pembuatan fitur pengambilan data user

public function GetInfo() {         $npm = session('npm');         $user = User::where('npm', $npm)->first();         $skills = User_skill::where('npm', $npm) ->get(); $data = array(             'name' => $user->name,             'desc' => $user->description,             'contact' => $user->contact, 'skills' => $skills ); return view('profile', ["data"=>$data]);     }

[temanlomba-blog]

[Sprint#1.3-IRF] Sprint Sprint Sprint!!

Yang telah saya lakukan:

24 Maret 2017

Setelah pada waktu lalu telah membuat kode untuk tampilan dashboard, pada hari ini saya melanjutkan untuk membuat tampilan profile page. Saya menggunakan salah satu fungsi dari Laravel untuk membuat frontend yaitu, Laravel Blade Templating. Intinya, blade ini akan membuat sebuah template layout, dengan layout ini kita bisa dengan mudah untuk mengisi bagian yang ingin dibedakan. Sepertinya akan lebih mudah apabila ditunjukan langsung. Misalkan saya sedang ingin membuat tampilan profile page, namun saya sudah mempunyai laman dashboard yang tampilannya sebagai berikut.

pada profile page, ada sebuah komponen yang sama dipakai juga di laman dashboard yaitu header dan footer. Oleh karena itu dibuatlah layout yang hanya berisi header dan footer yang kurang lebih seperti ini(sebenarnya kurang soalnya cuma ngambil bagian yang isinya penting saja he)

pada potongan kode tersebut berisi header dan footer, dan di tengah tengah ada sebuah baris kode yaitu “@yield(’content’)” yang kegunaannya akan dijelaskan lagi dibawah. untuk memakai blade template ini kita tinggal membuat file php lain yang berisi seperti berikut

untuk memakainya kita tinggal mengextend nama filenya. layouts.layout itu berarti file yang dipakai bernama layout yang berada di folder layouts, file template layout sebaiknya disimpan di resources>views>layouts, biasanya folder layouts manual kita buat sendiri dan namanya tidak perlu layouts. Baris kode @section(’content’) itu akan berhubungan dengan @yield yang sebelumnya saya tunjukan. Isi dari @section(’content’) sampai @endsection akan dimasukan ke layout template yang kita buat, lebih tepatnya ke bagian @yield yang mempunyai tag ’content’, sama halnya dengan section(’title’) isinya akan masuk kedalam yield(’title’). Kurang lebih cara memakai blade template seperti itu, ohiya untuk memakai laravel blade, perlu memakai ekstensi .blade.php untuk filenya, hehe. Jadi pada akhirnya sudah dipisah dan akhirnya membuat kode untuk tampilan profile namun belum selesai.

[Alokasi waktu: 4 jam]

26 Maret 2017

Pada hari ini saya melanjutkan membuat laman profile page dan akhirnya selesai yay

Sehabis itu saya melanjutkan untuk membuat laman edit profile.

[Alokasi waktu: 4 jam]

28 Maret 2017

Pada hari ini saya berencana untuk menyelesaikan semuanya, hal pertama yang dilakukan sebelum melanjutkan pembuatan tampilan laman, saya membuat test terlebih dahulu. Pada awalnya saya masih kurang mengerti bagaimana cara mengetest frontend dan juga memakai apa. Ketika saya cari ada cara yang bisa dipakai untuk men-test yaitu Laravel dusk, akan tetapi setelah ditelusuri oleh salah satu anggota kelompok kita.... penggunaannya tidak memungkinkan gara-gara sebuah isu, untuk penjelasan lebih lanjut tentang mengapa bisa dilihat pada post teman saya di sini. Pada akhirnya kita menggunakan sebuah aplikasi testing lain bernama codeception yang lumayan cocok, namun masih bingung cara penggunaannya hehe. Akhirnya dibuatlah test untuk laman profile page seperti berikut ini

Pada intinya ini dia akan menjalankan test satu-satu pertama dia akan mencek apakah dia masuk ke link “/profile” kemudian dia liat satu-satu apakah ada elemen-elemen tertentu di page itu seperti class desc, id usr-fullname, id gen-npm, kemudian dicek apakah ada tulisan download cv dan edit profile. Test ini untuk mengecek apakah ketika kita masuk pada link tersebut ada elemen-elemen tersebut, sejauh ini itu yang baru saya pikirkan. Setelah itu saya membuat test serupa untuk edit profile dan dashboard lalu saya push ke gitlab. setelah saya push saya melanjutkan untuk membuat page edit dan mengedit beberapa tampilan, dan pada akhirnya terlihat seperti ini

Setelah jadi saya mencoba untuk meruntest yang saya buat terlebih dahulu dengan command

vendor/bin/codecept run

kemudian saya lihat semua test sudah passed, jadi saya akhirnya push ke gitlab akan tetapi ketika sedang dijalankan test di gitlab ada terjadi error. Ternyata untuk memasuki link /profile harus mempunyai session dan pada test tidak ada session yang terbuat jadi tidak pernah masuk ke laman profile oleh karena itu test tidak pernah berhasil. Setelah itu saya mencoba untuk mengakalinya tapi tidak membuahkan hasil yang baik, akhirnya saya sudahi dahulu karena sudah mengerjakan terlalu lama.

[Alokasi Waktu: 8 jam]