Membuat Website CV Sederhana

Pendahuluan

• Membuat website sederhana untuk CV menggunakan HTML dan CSS.
• Rekomendasi belajar dasar HTML dan CSS melalui tutorial di channel sebelumnya.

Contoh Website

• Contoh CV yang akan dibuat mirip dengan CV Cristiano Ronaldo.
• Struktur website:
  • Sebelah kiri: Gambar, tombol untuk email dan WhatsApp.
  • Sebelah kanan: Bagian yang bisa di-scroll, dengan section seperti About, Experience, dan Achievement.
  • Dihosting di github.io.

Langkah-langkah Membuat Website

1. Desain Wireframe
   • Membuat desain layout website, menentukan lokasi gambar, teks, dan warna.
2. Mempersiapkan Aset
   • Menyiapkan teks, gambar, video, dan link yang diperlukan.
3. Menulis Kode
   • Menggunakan HTML, CSS, dan JS (jika perlu).
4. Hosting
   • Memastikan website dapat diakses melalui internet.
   • Dua jenis hosting:
     • Managed Hosting
     • Self Hosting
   • Menggunakan github.io sebagai contoh managed hosting.

Persiapan Aset

• Persiapkan gambar dan favicon menggunakan favicon.cc.
• Resolusi gambar disarankan 400x400 pixel.

Penulisan Kode

Membuat File HTML

• Mulai dengan membuat file index.html
• Buat template HTML dan tambahkan favicon.

Membuat Struktur Div

• Dua div besar:
  • left-container untuk bagian kiri.
  • right-container untuk bagian kanan.

Mengatur CSS

• Gunakan file style.css untuk mengatur tampilan.
• Berikan styling pada left-container dengan posisi fix.
• Mengatur warna, ukuran, dan lainnya melalui CSS.

Menambahkan Gambar dan Tombol

• Gunakan elemen <img> untuk gambar dan elemen <button> untuk tombol.
• Atur ukuran gambar dan tombol agar sesuai.
• Mengatur hover effect pada tombol dengan CSS.

Menulis JavaScript

• Menambahkan fungsi onclick untuk tombol agar membuka email dan WhatsApp di tab baru.

Menyusun Bagian Kanan

• Membuat bagian untuk top bar dan menambahkan link ke section lain.
• Menggunakan ID untuk navigasi antar section.

Menyelesaikan Website

• Menambahkan konten untuk setiap section seperti About, Experience, Achievement, dan Contact.
• Mengatur jarak antar elemen dengan padding dan margin.

Hosting di GitHub

1. Buat akun GitHub.
2. Buat repository baru.
3. Upload semua file aset ke repository.
4. Atur GitHub Pages di pengaturan repository.
5. Tunggu beberapa menit hingga website dapat diakses.

Penutupan

• Jangan hanya menonton, tetapi praktikkan juga.
• Pertanyaan dapat dituliskan di kolom komentar.
• Ajak teman untuk menonton dan berlangganan channel.