Slide 1

Slide 1 text

Berkarir Sebagai Frontend Developer PHPID Online Learning #12

Slide 2

Slide 2 text

Randy Vianda Putra, live in Bandung -Lead Frontend Engineer @WorkLifeBeyond -Instructor @SekolahFrontend Hello modulloe@gmail.com github.com/randyviandaputra @randyvp

Slide 3

Slide 3 text

Let’s Start

Slide 4

Slide 4 text

Agenda ?

Slide 5

Slide 5 text

1. Kesalahpahaman mengenai kompleksitas Frontend Developer 2. Mengetahui apa itu Frontend Developer. 3. Mengetahui masalah apa saja yang dihadapi Frontend Developer. 4. Gambaran dan Karir seorang Frontend Developer. 5. Bagaimana menjadi Frontend Developer yang baik 6. Bagaimana memulainya ?

Slide 6

Slide 6 text

Apa kesalahpahaman mengenai Frontend Developer ?

Slide 7

Slide 7 text

- Harus jago photoshop, adobe xd, sketch, .… Paint - Mengganggap HTML, CSS itu mudah - Mengganggap ngerubah wording itu mudah. bener ? - Mengganggap memindahkan sesuatu dari A ke B mudah - Mengganggap itu mah tinggal margin, padding, dst doang

Slide 8

Slide 8 text

Apa itu Frontend Developer ?

Slide 9

Slide 9 text

Frontend developer adalah pengembang website yang menggunakan baris kode HTML, CSS, dan JavaScript untuk menghasilkan website dengan tampilan yang menarik. Dan juga mengolah desain murni menjadi website yang interaktif dengan pengguna.

Slide 10

Slide 10 text

“ “Seorang frontend developer harus memastikan tampilan website sesuai dengan yang disepakati dengan desainer, baik dari segi tampilan maupun fungsionalitas.”

Slide 11

Slide 11 text

Kenapa perlu Frontend Developer ?

Slide 12

Slide 12 text

Human Resource Marketing - Dunia periklanan di internet tumbuh - Layanan yang ada memerlukan mobile web solution - Data yang besar perlu divisualisasikan - Dari situ permintaan pekerjaan terhadap frontend developer sangat banyak. - Challenging

Slide 13

Slide 13 text

Seperti apa peluang karir sebagai Frontend Developer ?

Slide 14

Slide 14 text

- Cukup Popular - Learning path yang cukup mudah - Banyak dicari di perusahaan startup

Slide 15

Slide 15 text

Frontend Developer yang gimana sih yang dicari saat ini? ?

Slide 16

Slide 16 text

Non Teknis - Mempunyai fundamental yang kuat - Mau belajar - Mempunyai pemahaman tentang UI/UX - Harus Aktif

Slide 17

Slide 17 text

Teknis - Memahami Html, css, javascript - Memahami tentang Responsive Design - Memahami Framework Css dan Javascript - Memahami cara mengconsume API - Memahami Version Control System (Git) - Memahami Testing/Debugging - Memahami Browser Developer Tools - Memahami Collaboration tools - Memahami tentang optimasi tools/website

Slide 18

Slide 18 text

Seperti Apa Pekerjaannya? ?

Slide 19

Slide 19 text

- Menentukan struktur dan desain halaman website - Memastikan desain web mampu memaksimalkan user experience - Melakukan optimasi agar tetap cepat dan terus dapat dikembangkan - Membuat style guide - Memastikan konsistensi branding melalui desain website - Bekerja sama dengan ui/ux, backend developer untuk melakukan coding dan troubleshooting

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

Bagaimana menjadi Frontend Developer yang baik ? ?

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

- Detail - Berpikir panjang - Haus akan pengetahuan - Dapat berkomunikasi dengan baik - Dapat bekerja tim - Mempunyai time management yang baik - Good programming skill - Mengetahui kapan harus optimasi - Good testing skill

Slide 27

Slide 27 text

Bagaimana memulainya ? ?

Slide 28

Slide 28 text

“ 1. Apakah kita tertarik dengan desain ? 28

Slide 29

Slide 29 text

“ 2. Apakah kita peduli dengan hal detail ? 29

Slide 30

Slide 30 text

“ 3. Apakah kita ingin mempelajari hal-hal baru? 30

Slide 31

Slide 31 text

“ 4. Selalu mencoba dan berlatih 31

Slide 32

Slide 32 text

“ 5. Jangan batasi diri kita untuk melakukan sesuatu yang baik 32

Slide 33

Slide 33 text

“ 6. Sering berurusan dengan banyak masalah cross-browser. 33

Slide 34

Slide 34 text

“ 7. Sering ketemu masalah yang ga logis seperti CSS 34

Slide 35

Slide 35 text

“ 8. Pasti mengulangi atau melakukan hal sama 35

Slide 36

Slide 36 text

“ 9. Kita harus menerima kode orang lain 36

Slide 37

Slide 37 text

Teknologi - Pelajari HTML, CSS, JavaScript Referensi : https:/ /www.w3schools.com/ https:/ /developer.mozilla.org/id/docs/Web/JavaScript https:/ /javascript.info/ - Pelajari HTML5, CSS3, JavaScript Lanjutan, Framework CSS & JavaScript - Pelajari Grid system, teknik responsive design - Pelajari mengenai peningkatan performa - Pelajari mengenai visualisasi data

Slide 38

Slide 38 text

Tools yang sering di pakai

Slide 39

Slide 39 text

Links - https:/ /frontendmasters.com/books/front-end-handbook/2019/ - https:/ /www.w3schools.com/ - https:/ /developer.mozilla.org/id/docs/Web/JavaScript - https:/ /javascript.info/ - https:/ /github.com/kamranahmedse/developer-roadmap/blob/master/img/fro ntend.png?year-2020-2 - https:/ /frontendchecklist.io/

Slide 40

Slide 40 text

40 Thanks Any questions? You can find me on github : @randyviandaputra