LinkedIn, GitHub & Portofolio

Kenapa ini penting

Resume kamu adalah ringkasan; LinkedIn, GitHub, dan portofolio adalah bukti. Recruiter dan hiring manager di US hampir selalu membuka link yang ada di resume. Kalau LinkedIn kosong, GitHub hanya berisi repo tutorial yang di-fork, dan link portofolio mati, kepercayaan langsung turun. Sebaliknya, profil yang rapi bisa membuat recruiter menghubungi kamu duluan, padahal kamu belum melamar sama sekali. Untuk kandidat dari luar negeri, bukti publik ini makin penting karena perusahaan tidak bisa mengecek reputasi kamu lewat jaringan lokal mereka.

Konsep inti

LinkedIn: bagian yang paling menentukan

Headline (kalimat di bawah nama) adalah teks yang muncul di hasil pencarian recruiter. Jangan hanya "Software Engineer at PT XYZ". Masukkan peran, stack utama, dan nilai jual:

"Frontend Engineer · React, Next.js, TypeScript · Web performance & accessibility · Open to remote (UTC+7)"

About (ringkasan): 3-5 paragraf pendek. Struktur sederhana: siapa kamu dan apa spesialisasimu, 2-3 pencapaian dengan angka, cara kamu bekerja (async, zona waktu), dan ajakan menghubungi. Tulis dengan "I", santai tapi profesional.

Experience: salin bullet terbaik dari resume, boleh lebih panjang sedikit. Tambahkan media (link demo, screenshot).

Featured: pasang 2-3 tautan terbaik, misalnya proyek portofolio, artikel teknis, atau talk.

Skills: pilih yang relevan dengan target kerja, bukan semua yang pernah kamu sentuh.

Open to Work: LinkedIn punya fitur untuk memberi sinyal bahwa kamu terbuka pada pekerjaan baru, dengan pilihan jenis peran, lokasi (termasuk remote), dan apakah sinyal itu terlihat publik atau hanya untuk recruiter. Kalau kamu sedang bekerja, pertimbangkan opsi yang hanya terlihat oleh recruiter. Detail pengaturan dan siapa yang bisa melihatnya bisa berubah; cek langsung di pengaturan LinkedIn kamu.

Foto profil: berbeda dengan resume, foto di LinkedIn itu wajar. Pakai foto wajah yang jelas dan profesional.

GitHub: profil sebagai etalase

Profile README: buat repository dengan nama persis sama dengan username kamu (misalnya budisantoso/budisantoso), lalu isi README.md. Isinya tampil di bagian atas profil GitHub. Isi singkat: siapa kamu, apa yang sedang dikerjakan, proyek unggulan dengan link, dan cara menghubungi.
Pin repositories: GitHub mengizinkan kamu menyematkan beberapa repo di profil. Pin hanya proyek terbaik dan buatan sendiri, bukan fork tutorial.
README per proyek: setiap repo yang di-pin wajib punya README yang menjelaskan masalah yang diselesaikan, demo live, screenshot, stack, cara menjalankan, dan keputusan teknis.
Riwayat commit yang wajar: commit message yang rapi lebih penting daripada "kotak hijau" penuh.

Proyek portofolio yang dilirik

Hiring manager bosan melihat todo app, clone Netflix, dan kalkulator. Yang membuat mereka berhenti scroll adalah proyek yang:

Menyelesaikan masalah nyata, idealnya milik orang lain. Contoh: sistem antrean untuk klinik kecil, dashboard stok untuk UMKM keluarga, alat bantu aksesibilitas.
Sudah live dan dipakai, sekecil apa pun ("dipakai 3 toko kelontong di kampung saya" itu cerita yang bagus).
Menunjukkan kedalaman teknis: autentikasi, testing, CI/CD, penanganan error, performa, aksesibilitas.
Punya dokumentasi keputusan: "Saya memilih server components karena ..., trade-off-nya ...".
Sesuai dengan lowongan target. Mau kerja di fintech? Buat proyek yang menangani uang dengan benar (pembulatan, idempotency). Mau di e-commerce? Fokus ke performa checkout.

Kontribusi ke open source juga termasuk portofolio. Satu PR yang di-merge ke proyek terkenal menunjukkan kamu bisa membaca kode orang lain, mengikuti aturan kontribusi, dan berkomunikasi dalam bahasa Inggris.

Situs portofolio

Tidak harus mewah. Situs portofolio yang efektif punya: nama dan peran di bagian atas, 2-4 proyek dengan studi kasus singkat (masalah, solusi, hasil, link), link ke resume PDF, GitHub, LinkedIn, dan email. Pastikan cepat dibuka, bisa dipakai di HP, dan aksesibel. Situs ini sekaligus jadi demo skill frontend kamu. Domain sendiri bagus tapi tidak wajib.

Contoh kode

Template GitHub profile README (simpan sebagai README.md di repo bernama sama dengan username):

# Hi, I'm Budi 👋

Frontend engineer in Jakarta (UTC+7) building fast, accessible React and
Next.js apps. Currently open to remote roles with US teams.

### Featured projects
- **[OpenKurs](https://github.com/budisantoso/openkurs)**, currency dashboard
  (Next.js, TypeScript). Caches rates server-side to stay under API limits.
  [Live demo](https://openkurs.example.dev)
- **[a11y-check-cli](https://github.com/budisantoso/a11y-check-cli)**, Node.js
  CLI that flags missing alt text and form labels in CI.

### What I'm working on
- Contributing docs fixes to open-source React tooling
- Writing about web performance at [budi.dev/blog](https://budi.dev/blog)

### Tech
TypeScript · React · Next.js · Node.js · Tailwind CSS · Vitest · Playwright

### Contact
budi.santoso@email.com · [LinkedIn](https://linkedin.com/in/budisantoso)

Template README proyek portofolio:

# OpenKurs

Currency dashboard for small importers who check IDR/USD rates many times a day.

**Live demo:** https://openkurs.example.dev
![Screenshot](docs/screenshot.png)

### Problem
Free exchange-rate APIs limit requests. Calling them from every browser
burned through the limit by noon.

### Solution
- Next.js route handler fetches rates once and caches them on the server
- Client polls our own endpoint, not the external API
- Chart with keyboard-accessible tooltips

### Tech decisions
| Decision | Why | Trade-off |
|---|---|---|
| Server-side cache | Stay under API limits | Rates can be up to 10 min old |
| TypeScript strict mode | Catch null rate values early | Slower first setup |

### Run locally
    npm install
    npm run dev

### Tests
    npm test   # Vitest unit tests + Playwright smoke test

Template LinkedIn About:

I'm a frontend engineer in Jakarta (UTC+7) who builds fast, accessible web
apps with React, Next.js, and TypeScript.

Recent highlights:
• Cut checkout load time from 4.1s to 1.6s at an e-commerce company with
  2M monthly users.
• Built a component library used by 4 product teams.
• Maintain OpenKurs, an open-source dashboard with 250+ GitHub stars.

I work well async: clear written updates, detailed PRs, and 2-3 hours of
daily overlap with US Eastern time.

Open to remote frontend roles. Email: budi.santoso@email.com

Kesalahan umum

Headline LinkedIn generik. "Student" atau "Looking for opportunities" tidak muncul di pencarian. Cara benar: peran + stack + spesialisasi + "open to remote".
Pin repo hasil fork tutorial. Cara benar: pin hanya proyek buatan sendiri yang punya README dan demo.
README kosong atau hanya bawaan create-next-app. Cara benar: tulis masalah, solusi, demo, keputusan teknis, cara menjalankan.
Link demo mati. Hosting gratis kadang tidur atau kedaluwarsa. Cara benar: cek semua link sebulan sekali dan sebelum mengirim lamaran.
Informasi tidak konsisten antara resume, LinkedIn, dan GitHub (jabatan atau tanggal berbeda). Cara benar: samakan semuanya; recruiter memperhatikan hal ini.

Latihan

Mudah, Tulis headline LinkedIn untuk dirimu sendiri dengan format: peran · stack · spesialisasi · status remote.
Sedang, Buat repo profile README di GitHub kamu dan pin 2 proyek terbaik. Tuliskan alasan memilih dua proyek itu.
Menantang, Pilih satu proyek lama, tulis ulang README-nya mengikuti template di atas, termasuk tabel keputusan teknis, dan pastikan ada demo live.

Lihat solusi

Contoh:

Full-Stack Developer · Next.js, Node.js, PostgreSQL · Building tools for
small businesses · Open to remote (UTC+7)

Langkah: buat repo baru bernama persis seperti username (misalnya sitiaminah/sitiaminah), centang "Add a README file", isi dengan template, lalu di halaman profil pilih "Customize your pins". Contoh alasan:

1. Klinik-Antre, dipakai klinik nyata, ada auth, test, dan CI. Menunjukkan
   kemampuan full-stack.
2. Kontribusi docs ke library open source, bukti bisa kolaborasi dalam
   bahasa Inggris.

Kriteria README yang lolos:

[✔] Satu kalimat masalah di atas
[✔] Link demo live yang bisa dibuka
[✔] Screenshot
[✔] Tabel 2-3 keputusan teknis + trade-off
[✔] Cara menjalankan dan cara menjalankan test

Ringkasan

LinkedIn: headline berisi peran, stack, spesialisasi, dan status remote; About berisi pencapaian dengan angka.
Fitur Open to Work bisa diatur publik atau hanya untuk recruiter; cek pengaturannya di LinkedIn.
GitHub profile README dibuat di repo yang namanya sama dengan username; pin hanya proyek terbaik buatan sendiri.
Proyek yang dilirik: masalah nyata, live, punya kedalaman teknis, dan terdokumentasi.
Situs portofolio cukup sederhana, cepat, responsif, dan berisi studi kasus singkat.