$30 off During Our Annual Pro Sale. View Details »

Membuat Website Zaman Sekarang

Membuat Website Zaman Sekarang

Berbagai informasi mengenai pembuatan website dengan teknologi terkini

Irfan Maulana

March 11, 2022
Tweet

More Decks by Irfan Maulana

Other Decks in Programming

Transcript

  1. MEMBUAT WEBSITE Zaman Sekarang STMIK Widya Cipta Dharma - Samarinda

    12 Maret 2022
  2. Halo, saya Irfan Maulana (dipanggil mazipan). Saat ini bekerja di

    Tokopedia sebagai Principal Engineer untuk tim Web Platform, bergabung sejak 2019. Telah menjadi pemrogram web sejak 2013-an. Kalian bisa baca lebih lanjut mengenai saya di blog mazipan.space Bisa juga ikuti twitter saya di @maz_ipan Perkenalan
  3. Semua yang saya sampaikan adalah pendapat pribadi saya sebagai profesional

    berdasarkan pengalaman yang saya pelajari dan berbagai sumber daya yang saya baca, bukan merupakan pendapat resmi dari tempat saya bekerja. Resiko yang timbul sebagai akibat dari kesalahan interpretasi dari materi yang ada, bukan merupakan tanggung jawab saya. Penafian
  4. Poin-poin yang akan dibahas Kenapa memilih web? profesi web developer

    Membuat web dengan (hampir) tanpa biaya Kenyataan kerumitan pengembangan web Belajar pengembangan web Berbagai skill yang perlu ditempa Kesimpulan
  5. Kenapa memilih web? Mudah dicari Selalu terbarukan Mudah diakses Mudah

    Disebarkan
  6. Beberapa pekerjaan yang “naik daun” 2021 di asia tenggara ksana.in/jobs-sea-2021

  7. • Konsumer di asia tenggara semakin berkembang ke arah “digital”.

    • Para “Brand” menemukan cara baru untuk berhubungan dengan konsumer. • E-commerce meledak di 2020, melecutkan munculnya berbagai sektor. • Posisi “tradisional” semakin berevolusi, sebagai akibat Covid-19. Beberapa pekerjaan yang “naik daun” 2021 di asia tenggara
  8. Beberapa pekerjaan yang “naik daun” 2021 di asia tenggara

  9. predictsalary.com/salaries Berapa rentang gaji Web developer?

  10. Beberapa bagian dari web Perangkat Peramban Antarmuka Peladen Basis data

  11. Bagian mana kerjaannya web developer? Perangkat Peramban Antarmuka Peladen Basis

    data Web Developer
  12. Spesialisasi profesi Antarmuka Peladen Basis data Web Developer DB ADMINISTRATOR

    Backend developer Frontend developer System Engineer/Devops
  13. Backend vs Frontend Rest APIs / GraphQL Business Flow Engine

    Designing DB Table Caching System Authentication + Authorization Service Communication Server Management Job / Task Scheduler Containerization CI / CD Cloud Service Many more… Visual Layouting Interactivity Server/Client Rendering Client Side Validation Data Fetching Web Performance Web Accessibility Build Process CI / CD Many more…
  14. Backend vs Frontend Java Go Python PHP Ruby HTML CSS

    JavaScript
  15. Membuat web (hampir) tanpa biaya 1 2 3 4

  16. Alternatif hosting gratis

  17. Custom domain (Kalau perlu) Wowww

  18. Tambahan konten semi dinamis Metode: • Markdown sebagai sumber konten

    • Menjadi bagian dari kode • Static-Site Generation (SSG) • Membutuhkan proses build tiap kali ada perubahan • Membutuhkan pengiriman berkelanjutan (continuous delivery) yang baik • Disajikan dalam bentuk web statis Kelebihan: • Pada umumnya bisa lebih cepat dimuat, tidak membutuhkan proses di server • Biasanya lebih murah, banyak tersedia hosting gratisnya • Teknologi lebih familiar dengan Frontend Developer https://jamstack.org/generators/
  19. Dukungan data dinamis Headless CMS - Strapi - Ghost -

    Netlify CMS - Headless Wordpress - Google Doc? Backend as a Service (BaaS) - Firebase - Supabase - AWS Amplify https://jamstack.org/ DB as a Service (DBaaS) - Prisma - PlanetScale - FaunaDB - FireStore from Firebase
  20. Contoh nyata web (hampir) tanpa biaya mazipan.space - Next.js -

    Static generated - Konten dengan markdown - Hosting di Vercel ksana.in - Next.js - Server render - Supabase - Hosting di Vercel pramuka.online - Next.js - Static generated - Konten dengan JS statis - Hosting di Vercel www.baca-quran.id - Next.js - Static generated - Konten dengan berkas JSON statis - Hosting di GitHub learning.byphp.id - Svelte - Static generated - Konten dengan markdown - Hosting di Netlify https://ksana.in/gh
  21. Tren teknologi terkini: javascript https://2021.stateofjs.com/en-US/libraries/front-end-frameworks

  22. Tren teknologi terkini: alat build https://2021.stateofjs.com/en-US/libraries/build-tools

  23. Tren teknologi terkini: css https://2020.stateofcss.com/en-US/technologies/css-frameworks/

  24. Bikin aplikasi yang production-grade, gak segampang bikin aplikasi prakarya. Ada

    lebih banyak sudut pandang yang mesti diperhatikan: • Validasi • Skalabilitas • Keamanan • Performa • Manajemen dependensi • Integrasi dan pengiriman berkelanjutan • Monitoring aplikasi • Dan banyak lainnya Kenyataan kerumitan pengembangan web https://ksana.in/susahnya-bikin-aplikasi
  25. Sumber daya: • Materi pembelajaran interaktif • Artikel / tutorials

    / video / dokumentasi resmi • Mentorship / belajar dari & dengan yang lebih bisa • Belajar bersama / berkelompok • Projek bersama / kode sumber terbuka • Bootcamp / kursus intensif Catatan: • Semuanya butuh komitmen waktu dan tenaga • Tetap perlu praktek, banyak nyoba, berulang, konsisten, bikin projek nyata • Jangan panik kalau error • Tulis ulang yang sudah dipelajari, ajarkan dan bagikan ke teman belajar jadi pengembangan web https://ksana.in/belajar-pemrograman
  26. belajar jadi pengembangan web https://roadmap.sh

  27. #MULAIAJADULU

  28. GIT Version control buat kolaborasi Unix command Biar bisa mengeksekusi

    berbagi perintah di server dan di lokal Data structure + Algorithm Bisa lancar buat manipulasi berbagai jenis struktur data Debugging skill Biar tidak heboh dan putus asa kalau ketemu bug/error Seni mencari jawaban dan bertanya Biar terbiasa mencari jawaban di mesin pencari, dan bisa bertanya tentang suatu hal dengan lebih baik Skill teknis yang berguna dimana saja
  29. Membaca Kolaborasi Komunikasi Berpikir kritis Growth Mindset Beradaptasi dengan perubahan

    Bahasa Inggris Skill non-teknis yang sering diremehkan
  30. Kesimpulan Kenapa WEB? Mudah dicari, mudah diakses, mudah disebarluaskan dan

    selalu terbarukan Profesi web programmer Menanjak di 2021 dan terlihat menjanjikan di tahun mendatang Bagian dari web Ada layer backend dan frontend, kendati sering dikerjakan oleh orang/tim berbeda, mungkin saja semuanya dikerjakan orang/tim yang sama. Bikin web (hampir) tanpa modal Kita bisa membuat web murah tapi tidak murahan. Bongkar pasang berbagai layanan. Pintar-pintar memanfaatkan layanan gratis yang tersedia. Skill yang perlu dipelajari Ada skill spesifik macam HTML, CSS, JS untuk Frontend. Tapi ada beberapa skill yang bisa diterapkan dimanapun kamu ditempatkan. Jangan lupa untuk mempelajari skill non-teknis juga
  31. Unduh slide speakerdeck.com/mazipan

  32. CREDITS: This presentation template was created by Slidesgo, including icons

    by Flaticon, and infographics & images by Freepik. TERIMA KASIH! Silahkan bertanya!!!