MEMBUAT WEBSITE Zaman Sekarang STMIK Widya Cipta Dharma - Samarinda 12 Maret 2022

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

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

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

Kenapa memilih web? Mudah dicari Selalu terbarukan Mudah diakses Mudah Disebarkan

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

● 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

Beberapa pekerjaan yang “naik daun” 2021 di asia tenggara

predictsalary.com/salaries Berapa rentang gaji Web developer?

Beberapa bagian dari web Perangkat Peramban Antarmuka Peladen Basis data

Bagian mana kerjaannya web developer? Perangkat Peramban Antarmuka Peladen Basis data Web Developer

Spesialisasi profesi Antarmuka Peladen Basis data Web Developer DB ADMINISTRATOR Backend developer Frontend developer System Engineer/Devops

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…

Backend vs Frontend Java Go Python PHP Ruby HTML CSS JavaScript

Membuat web (hampir) tanpa biaya 1 2 3 4

Alternatif hosting gratis

Custom domain (Kalau perlu) Wowww

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/

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

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

Tren teknologi terkini: javascript https://2021.stateofjs.com/en-US/libraries/front-end-frameworks

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

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

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

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

belajar jadi pengembangan web https://roadmap.sh

#MULAIAJADULU

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

Membaca Kolaborasi Komunikasi Berpikir kritis Growth Mindset Beradaptasi dengan perubahan Bahasa Inggris Skill non-teknis yang sering diremehkan

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

Unduh slide speakerdeck.com/mazipan

CREDITS: This presentation template was created by Slidesgo, including icons by Flaticon, and infographics & images by Freepik. TERIMA KASIH! Silahkan bertanya!!!