Assalamu’alaikum Warahmatullahi Wabarokatuh,

Disini saya akan menceritakan pengalaman saya saat magang di Kadang Koding Indonesia. Sebelum saya menceritakan pengalaman saya, saya akan bercerita singkat kepada teman-teman tentang Kadang-Koding Indonesia dan saya juga akan memperkenalkan kepada teman-teman tentang keempat pembimbing saya saat magang di Kadang Koding Indonesia.

Jadi, Kadang-Koding Indonesia adalah salah satu Software House di Kota Surakarta. Kadang-Koding memiliki 4 admin yang hebat, yaitu ada Kak Joko, Kak Dinar, Kak Eki dan Kak Arif. 

Ya, mungkin cukup itu saja cerita sangat singkat saya tentang Kadang-Koding Indonesia dan keempat pembimbing magang saya.

Sekarang, saya akan menceritakan pengalaman saya saat magang.

 

Hari Pertama Magang

Hari pertama magang di awali dengan perkenalan, mulai dari sejarah berdirinya Kadang-Koding sampai data profil pribadi dari setiap admin di Kadang Koding Indonesia.

Setelah selesai berwawancara tentang sejarah dan profil Kadang Koding, kemudian saya dan teman-teman dipersilahkan untuk duduk di kursi tepatnya di meja kerja untuk pemagang, disinilah saya dan teman-teman saya memulai belajar tentang dunia IT. 

Kak Dinar (salah satu admin sekaligus pembimbing magang) menjelaskan kepada saya dan teman saya tentang cara kerja remote, yaitu dengan model kerja yang laporannya menggunakan google drive, didalam google drive kami telah disediakan spreadsheet yang berisikan jadwal dan tugas magang kami di Kadang Koding selama kurang lebih 3 bulan yaitu Bulan Februari 2019 sampai bulan April 2019.

 

Tugas Pertama: Membuat Sketsa Web Profil

Kami mulai membuat sketsa kerangka tampilan web profil dengan menggunakan sebuah lembaran kertas dan sebuah alat tulis (bolpoin atau pensil). Dan saat itu dalam pemikiran saya adalah saya akan membuat sebuah tampilan web dengan tema dunia pendidikan. Tujuan saya membuat web dengan tema pendidikan adalah mewujudkan mimpi anak-anak Indonesia untuk belajar bersama dalam website saya tanpa mereka harus membayar uang gedung maupun uang jasa pengajar, banyak sekali anak di Indonesia yang terkendala akan sekolahnya dikarenakan minimnya ekonomi keluarga. 

Di hari jumat tanggal 1 Februari 2019, saya telah membuat sebuah sketsa kerangka tampilan web profil dengan jumlah 5 tampilan, yaitu tampilan opening web, tampilan login(apabila sudah memilki akun), tampilan daftar akun(apabila belum mempunyai akun), tampilan menu(berisikan menu-menu yang mencakup macam-macam materi dalam pembelajaran online), dan tampilan materi. Dan saya juga tidak lupa untuk memberikan sebuah deskripsi pada tampilan web saya. Deskripsi pada sketsa saya berisikan “Tampilan Website untuk program pembelajaran Online. Dimana setiap pengunjung harus mempunyai akun terlebih dahulu, apabila belum mempunyai akun, pengunjung harus mendaftar akun dengan alamat email/gmail.”.

Karena sketsa kerangka yang saya buat masih banyak sekali evaluasi yang harus dibenahi. Dan karena waktu magang hari ini sudah hampir selesai dan masih banyak yang harus dibenahi dalam sketsa kerangka tampilan saya, maka saya dan teman saya memutuskan untuk melanjutkannya di hari senin yang akan datang.

 

Hari Senin, tanggal 4 Februari 2019

Saya telah menyelesaikan tugas sketsa kerangka saya. Setelah selesai, saya meminta evaluasi tentang sketsa saya kepada salah satu pembimbing magang saya yaitu Kak Eki, banyak sekali ternyata evaluasi dari kerangka saya yang harus saya benahi lagi. Mulai dari tata letak saya yang kurang tepat, beberapa icon-icon yang penempatannya kurang tepat, masih ada bagian kosong yang belum diisi, dan lainnya. Tapi Kak Eki tidak hanya memberi saya evaluasi, Kak Eki juga memberi solusi untuk membenahi kerangka tampilan saya, Kak Eki juga menawarkan saya agar belajar menggunakan bootstrap v4. Dan Alhamdulillah hari ini saya telah selesai membenahi evaluasi pada kerangka saya. Setelah selesai membenahi evaluasi yang telah disampaikan Kak eki, kemudian saya dan teman-teman mengumpulkan sketsa kerangka kami kepada Kak Dinar.

Setelah bagian evaluasi, kemuadian hal yang harus dilakukan saat magang adalah presentasi. Sorenya sebelum pulang, kami presentasi(penilaian) hasil sketsa kerangka tampilan web profil yang kami buat kepada Kak Dinar, dan Alhamdulillah presentasi saya lancar dan saya bisa lanjut pada tugas berikutnya.

Dari tugas pertama saya, saya mendapat banyak ilmu, yang kurang lebihnya :

  1. Awalnya saya menempatkan icon sosmed saya di tengah atas, tapi Kak Eki mengajari saya agar icon sosmed lebih baik diletakkan di atas pojok, atau sebaiknya di pojok bawah(pada footer).
  2. Judul web yang awalnya saya buat melengkung, kata Kak Eki lebih baik dibuat tegak lurus saja.
  3. Pemberian footer pada tampilan web.

 

Tugas Kedua: Proses Coding dengan HTML & CSS

Rabu, 6 Februari 2019 saya mengerjakan tugas kedua yaitu pengkodingan dari sketsa tampilan web profil yang telah kami buat, dengan deadline selama satu minggu. Hari ini saya memulai pengkodingan saya dari sketsa tampilan opening web saya. Hari ini saya diajarkan Kak Eki tentang bagaimana pengkodingan web yang baik dan mudah dipahami. Sampai sore pun saya masih dalam proses pengkodingan bagian tampilan opening web. Dan karena waktu sudah sore, akhirnya kami pulang dan melanjutkan kodingannya sampai besok.

 

Hari Kamis, tanggal 7 Februari 2019

Masih dengan tugas yang sama, yaitu pengkodingan tampilan web profil. Hari ini saya melanjukan kodingan saya yang tampilan opening web dan tampilan yang lainnya. Dan Alhamdulillah hari ini saya berhasil membuat 4 tampilan yaitu tampilan opening, tampilan login, tampilan daftar akun, dan tampilan menu. Kodingan saya masih menggunakan HTML dan CSS biasa, dan tampilannya masih sangat sederhana.

Tak lupa saya juga selalu meminta evaluasi pada Kak Eki, hari ini Kak Eki membantu dan mengajari saya membenahi beberapa tata letak tampilan yang kurang tepat.

 

Hari Jum’at, tanggal 8 Februari 2019

Seperti hal dengan Hari Kamis kemarin, hari ini kami masih dengan tugas yang sama yaitu pengkodingan tampilan web profil. Tadi malam saya belajar sedikit tentang bootstrap versi 4 yang pernah ditawarkan Kak Eki waktu Hari Senin, saya belajar melalui video tutorial dari Web Programming UNPAS, dan Alhamdulillah saya sedikit paham. Dan karena saya malamnya sudah belajar sedikit tentang bootstrap versi 4, jadi hari ini saya berniat untuk membuat tampilan web menggunakan bootstrap versi 4.

Ternyata menggunakan bootstrap versi 4 secara online itu menyenangkan dan mudah. Dan menyobanya perlahan-lahan untuk kemudian menghasilkan tampilan yang sesuai dengan yang saya harapkan. Hari ini saya mencoba praktek bootstrap versi 4 pada tampilan yang belum saya buat yaitu tampilan materi. Dan memang sangat menyenangkan membuat tampilan web menggunakan bootstrap versi 4. Saat proses pengkodingan menggunakan bootstrap versi 4, tidak lupa saya juga meminta pendapat dari Kak Eki dan Kak Joko. Karena tampilan bagian materi yang saya buat sekarang tidak sesuai dengan sketsa yang saya buat kemarin, saya bertanya pada Kak Eki apakah diperbolehkan, dan kata Kak Eki gakpapa 😁. Dan saat saya meminta pendapat Kak Joko mengenai tampilan web yang saya buat menggunakan bootstrap versi 4, kata Kak Joko sudah lumayan tapi tetap ada beberapa evaluasi juga dari Kak Joko. Evaluasi dari Kak Joko adalah katanya sebaiknya tampilan yang saya buat sebaiknya diberi isi sesuai dengan materi yang akan disampaikan agar tidak terlihat monoton, dan penambahan jarak pada beberapa tata letak agar terlihat tidak berantakan.

Namun, tampilan materi yang saya buat hari ini  masih dalam tahap 30%. Dan karena waktu sudah menunjukan pukul 16.00 WIB, akhirnya kami pulang dan melanjutkan kodingannya Hari Senin depan.

 

Hari Senin, tanggal 11 Februari 2019

Ya, saya masih dengan tugas yang sama yang masih belum saya selesaikan. Sesampainya di kantor, saya melanjutkan kembali kodingan saya  di Hari Sabtu kemarin. Alhamdulillah tampilan saya yang sangat sederhana, telah saya selesaikan. Kemudian saya meminta evaluasi pada Kak Arif, kata Kak Arif saya sebaiknya pakai Codegniter dulu baru nanti dievaluasi sama Kak Arif. Dan kata Kak Arif, sebaiknya CSS nya dijadikan jadi satu file saja supaya lebih mudah. 

Dan sejak itu, saya kemudian belajar menggunakan Codegniter dengan bantuan Kak Arif juga. Sebenarnya sih dulu juga pernah diajarkan sama Kak Arif saat bulan Desember 2018 waktu belum dimulai magang (Tapi sudah lupa 😁). Hari ini Kak Arif mengajari saya menggunakan Codegniter, mulai dari pembuatan assets untuk penyimpanan file-file eksternal seperti images, css, video, javascript, dll., cara memberi background menggukan Codegniter, cara manggil file eksternalnya, cara membuat function baru, dll.  

Tapi, sebenarnya hari  ini saya masih belum bisa membuat tampilannya menggunakan Codegniter. Karena saya masih bingung menggunakan Codegniter, akhirnya saya mengedit tampilan saya saja menggunakan HTML dan CSS biasa. Sampai akhirnya sore pun datang, dan kami pulang.

Belajar CodeIgniter 

Agenda hari ini adalah melanjutkan codingan menggunakan Codegniter. Tapi karena hari ini Kakak-Kakak pembimbing sedang ada acara, jadi kami belajar sendiri dan bertanya apa yang belum tahu lewat Via Whatsapp dengan Kak Arif. 

Hari ini, saya mulai mengkoding menggunakan Codegniter, saya mencoba kembali tentang apa yang diajarkan Kak Arif kemarin, perlahan-lahan sih bisa walaupun masih tanya-tanya sama Kak Arif juga. Tapi, Alhamdulillah tampilan yang saya buat semakin berantakan 😁. 

Mencoba-coba menggunakan Codegniter terus sampai sore, dan masih bingung juga kenapa hasilnya berantakan terus 🙁. Akhirnya, kami minta Kak Arif untuk mengajarkan lagi Codegniter dari awal (hehehehe 😁). Dan Kak Arif pun mau mengajarinya tapi besok hari Rabu. Gakpapalah yang penting diajarin. Lagi-lagi sore cepat banget datangnya, dan kami pun pulang.

Hari Rabu, tanggal 13 Februari 2019 

Hari ini agendanya adalah belajar Codegniter/CI bersama Kak Arif, banyak sih yang saya tanyakan sama Kak Arif, mulai dari  peng-config-an pada CI, caranya biar kalau di link nanti bisa tampil ke halaman berikutnya, cara buat function pada controllernya, dan banyak lagi pokoknya dari awal-lah. Sampai akhirnya saya sudah sedikit paham tentang Codegniter, dan Kak Arif menyuruh saya untuk mencoba-coba dulu nanti kalau ada yang nggak bisa lagi tanya lagi 😁. Dan saya pun mencoba-coba perlahan sampai akhirnya hasilnya nggak berantakan lagi (ahahaahaha 😁) yah walaupun CSS nya masih saya pisah-pisah belum saya gabungin jadi satu.

Selesai membuat tampilan menggunakan CI, hasil yang saya buat saya tunjukkan pada Kak Arif, dan ternyata masih banyak evaluasi lagi yang harus saya benahi lagi 😁. Kata Kak Arif, kalau mau nge-link biasanya pakai

<a href=””>...<a>,


dan karena yang saya link masih pakai button dan input, akhirnya Kak Arif mengajari saya cara membuat link

<a href=””>...<a>


biar hasilnya tetap sama jadi button, yaitu pada class-nya button dicopy-paste taruh di dalam tag 

<a href=””>...<a>.


Mungkin itu salah satu yang di ajari Kak Arif kepada saya, terus Kak Arif juga memberitahu saya agar dalam tampilan web itu diusahakan tidak menggunakan background image supaya tidak ribet nantinya, jadi Kak Arif menyuruh saya untuk sebaiknya bakcgroundnya color saja. Kak Arif juga memberitahu saya background color yang bagus buat web, yaitu pada alamat wesite : https://flatuicolors.com/

Kak Arif juga mengajari cara manggil file eksternal dan juga cara nge-link supaya link yang diingkan bisa tampil ke halaman yang berikutnya.

Cara memanggil file eksternal dalam CI:

<a href=”<?php echo base_url()?>assets/folder_file/nama_file“>...</a>

Cara nge-link supaya bisa tampil ke halaman yang diingkan dalam CI:

<a href=”<?php echo base_url()?>nama_project/nama_file(dalam folder view)_yang_akan_tampil”>...</a>


Karena sudah diajarkan bagaimana caranya, akhirnya saya mencoba apa yang diajarkan dan saya juga mencoba menggabungkan CSS nya menjadi satu file yang sama.

Alhamdulillah, hari ini tampilan web profil saya selesai, saya juga belajar menggunakan modal. Kak Arif juga memberitahu saya supaya buka website ini supaya mudah cari sesuatu di bootstrap : https://hackerthemes.com/bootstrap-cheatsheet/


Hari Presentasi

Kamis, 14 Februari 2019 adalah hari untuk mempresentasikan hasil dari tampilan web profil yang telah dibuat.

Presentasinya pada Kak Dinar, kata Kak Dinar sudah gitu saja dan seperti biasa kami diminta Kak Dinar untuk mengirimkan screenshoot-an tampilan kami dan dikirim lewat google drive.

Hay Guys, aku mau nge-share juga nih syntax buat tampilan web profil yang sudah saya buat. Disini saya punya 2 jenis. Yang pertama saya akan menunjukan tampilan saya yang sederhana dan saat sebelum saya menggunakan Codegniter. Kemuadian Yang Kedua, saya akan menunjukan tampilan saya yang sudah saya modifikasi dan saat saya sudah menggunakan Codegniter. Kalau masih ada kekurangan tolong dimaklumin ya, soalnya ini tampilan awal saya saat magang dan memang masih sangat sederhana sekali. Berikut untuk tampilannya  :

  1. Halaman Utama

    C:\Users\asus1\Downloads\Screenshot_2019-02-15 Opening WEb.png

    HTML : 

    G:\1.PNG
    G:\2.PNG

    CSS : 

    G:\css 1.PNG


  2. Halaman Login



    HTML : 







    CSS : 



  3. Tampilan Register / Daftar



    HTML : 






    CSS : 







  4. Tampilan Menu



    HTML : 


















    CSS : 








  5. Tampilan Materi



    HTML :

     











    CSS :

 

 

0 Comments

Leave a comment