KOLEKSI VIDEO
-
PlayList u HTML & CSS doang
MAKING AMAZING TEXT EFFECT using HTML & CSS3 | TYPOGRAPHY Playlist
Dibuat: ddqia Channel | Posting : 05 Jan 2020
Dalam video tutorial kali ini membahas cara membuat teks efek glowing dan komik.
Biasanya dalam membuat desain gambar atau teks sudah lazim menggunakan photoshop, corel draw atau aplikasi sejenisnya.
Namun, tidak dalam video ini. Kita sama-sama akan ngoding teks efek menggunakan bahasa web programing HTML dan CSS.
Hasil manipulasi teks ini bisa digunakan untuk cover youtube atau biasa disebut thumbnail.
Semuanya akan kita bahas di video kali ini.
Sebelum kita barengan ngoding.
Dukung kami dengan cara Subscribe Channel ini.
Like, bagikan dan komentar.
Penting!!! Sebelum membuat tutorial ini disarankan sebaiknya melihat dulu video sebelumnya:
Aplikasi Ngoding:
Klik disini
Aplikasi Perekam Layar:
Klik disini
Video ini dilengkapi cuplikan lengkap source code, tetapi tidak menyertakan source code file.
-
PlayList u Javascript
CARA MEMBUAT PIZZA - NGODING JAVASCRIPT, HTML dan CSS | Mahir Ngoding Playlist
Dibuat: ddQia Channel | Posting : 17 Sep 2019
Video ini menampilkan animasi text bahan-bahan membuat adonan makanan khas Italia yang dikenal Pizza.
Tampilan video dibuat dengan mempergunakan bahasa pemograman Javascript Vanilla, HTML dan CSS.
Fungsi-fungsi dalam javascript yang digunakan diantaranya addEventListener mouseover/mouseleave, keycode dan setTimeout.
Selain itu, beberapa fungsi css dan html diantaranya filter blur, opacity, overflow, keyframes dan animation. Fungsi html diantaranya div, img, span dan h1.
Tampilan teks animasi ini cocok digunakan untuk konten video memasak atau pengenalan info produk baru.
Dukung terus chanel ini dengan cara klik tombol merah subscriber di bawah video.
Terima kasih telah menyaksikan. Sampai ketemu lagi di video mendatang.
Semua gambar di video ini hasil unduhan:
http://www.freepik.com -
PlayList u Mahir Ngoding
NGODING RESPONSIVE SLIDER SEDERHANA | HTML+CSS & 100% JAVASCRIPT | NO FRAMEWORK
Dibuat: ddQiaChannel | Posting : 22 Feb 2019
Video tutorial di edisi ini, kita akan membahas bagaimana cara membuat slider hanya dengan HTML, CSS dan Javascript, tanpa mempergunakan JQUERY.
Biasanya slider di website harus menyertakan framework jquery. Sudah banyak nama-nama slider yang sudah kita kenal. Seperti diantaranya Carousel, Swiper dan Flexslider.
Namun, sayangnya fungsi mereka itu harus disertai framework dari jquery. Tanpa framework itu, fungsi slider tidak akan bisa berjalan.
Dalam video ini, fungsi javascript seperti scrollLeft masih menjadi pemeran utama. TIdak lupa addEventListeners menjadi teman setianya.
Koding ini masih belum berfungsi sempurna, harus banyak perbaikan. Skrip koding ini hanya bisa berjalan baik di Chrome, editor ATOM (karena koding ini dibuat melalui ATOM).
Belum bisa berjalan sempurna di Mozilla dan perangkat handphone atau tablet.
Kami mohon maaf karena ngoding di video ini masih copas. Hal ini dikarenakan perangkat yang belum mumpuni.
Mungkin kedepannya akan ada perbaikan.
Terus dukung kami yaaa, cukup dengan cara komentar, like dan terakhir yang paling utama subscribe channel kami untuk selalu mendapat video terbaru.
Klik untuk lihat dan Subcribe Channel Youtube -
PlayList u HTML & CSS doang
MEMBUAT TEKS ANIMASI ENDING MOVIE | CAST SEQUENCE menggunakan HTML & CSS | MAHIR NGODING
Dibuat: ddQiaChannel | Posting : 13 Mar 2019
Assalamu'alaikum.
Video tutorial simple dan sederhana web programing tentang cara membuat ending sequence menggunakan bahasa HTML dan CSS.
Ngoding menggunakan aplikasi Atom dan Xampp, bisa dilihat di video sebelumnya jika belum ada aplikasinya.
Hasil ngoding direkam menggunakan Active Presenter.
Simak cara pembuatannya.
Wasalamu'alaikum.
Klik untuk lihat dan Subcribe Channel Youtube -
PlayList u Javascript
RESPONSIVE TOUCH SLIDER USING ANIMATION BACKGROUND | Javascript, HTML & CSS | Mahir Ngoding Playlist
Dibuat: ddQia Channel | Posting : 14 Aug 2019
Ngoding responsive slider kali ini dilengkapi tombol navigasi dan mode geser (swipe mode) pada setiap gambar/foto slider serta diujicoba melalui browser chrome yang dijalankan menggunakan komputer dan handphone
Ukuran file ini tidak lebih dari 15kb, jika menggunakan framework akan membengkak hingga ukurannya diatas 100kb. Sehingga ngoding tanpa framework jauh lebih hemat.
Video di edisi kali ini merupakan revisi dari semua konten video yang membahas #ngoding slider. Diantara video terdahulunya bisa dibuka di link Responsive Animation Slider dan Responsive Slider
Penulisan kode ini murni mempergunakan bahasa javascript atau dikenal dengan sebutan vanillaJS yang selalu membaur dengan HTML dan CSS.
Tak ketinggalan, dibahas pula beberapa perangkat yang dicoba untuk menguji hasil pengodingan ini. Diantaranya PC jadul dual core, hp Oppo A37 dan hp Realme 3 Pro. Manakah yang paling bagus performanya? Untuk tau jawabannya, saksikan video ini sampai akhir.
Software editing menggunakan ATOM, browser dites lewat Mozilla dan Chrome. Editing video dan perekaman layar masih tetap setia menggunakan aplikasi Android VideoShow dan Active Presenter.
Pengolahan animasi di dalam video ini sebagian besar menggunakan HTML dan CSS. Insya Allah, dalam kesempatan lain akan dibuat efek-efek video tutorialnya secara terpisah.
Semua hasil ngoding didokumentasikan ke dalam video ini. Mulai dari kode HTML sampai Javascript, jadi tonton sampai selesai yaa.
Bagi yang ingin kode (source code) yang sudah jadi dalam bentuk file, bisa tulis permintaan atau request di kolom komentar di bawah sampai dengan minggu depan, jadi buruan request dan komentar di bawah ini!
Kodingan ini GRATIS dan boleh dimodif sesuka hati. Indahnya berbagi untuk para peminat ngoding. .
Terima kasih telah menyaksikan video ini. Dukung terus channel ini. Jangan lupa tekan tombol subscribe bagi yang belum bergabung di channel ini.
Like dan bagikan video ini. Komentar, request dan saran bisa ditulis di bawah. -
PlayList u Javascript
ScrollLeft Navigation HTML+CSS3 (100% Javascript) Part 2
Dibuat: ddQia Channel | Posting : 25 Jan 2019
Akhirnya beres juga di upload setelah ada beberapa kendala... HP yang dipake buat edit video ini gak ada space-nya. Jadi terpaksa harus dipotong durasinya.
Sekali lagi maaf, maklum peralatannya terbatas. Ngoding video ini dibuat lewat software Videoshow yang di install di OPPO A37. Capture layar HP menggunakan software Mobizen.
Tadi siang pinjem dulu PC, buat capture layar kode-kodenya biar keliatan bagus... Pake PC dualcore T4400 yang ramnya 2gb, hdd 320gb, layar lcd 17". Software caputernya yang gratisan pake ActivePresenter.
Semoga video part 2 ini bisa membantu teman-teman yang seneng ngulik website khususnya yang pakai bahasa javascript.
Terima kasih sekali lagi, maaf atas kekurangan, support boleh dengan cara subscribe, like dan komentar atauu donasi boleh juga :)
Terima kasih telah menyaksikan konten video kami.
Klik untuk lihat dan Subcribe Channel Youtube
TENTANG
Website ini membahas informasi hiburan, kuliner, pendidikan, tutorial/cara desain, web programming, animasi, video/audio, menggambar dan menjadi Youtubers.
Website ini telah resmi menjadi bagian dalam Program Partner Youtube.
Fokus utama kami yaitu berkolaborasi membuat video e-learning & hiburan yang bisa disaksikan melalui laman website ini dan Youtube.