Tahun lalu, Josh Como, penulis tutorial dan tutorial untuk pengembang, di akun Twitternya secara sukarela melihat dan mengkritik situs portofolio semua pendatang. Dalam acara tersebut, ia melihat satu hal yang menarik: feedback yang tidak terlalu beragam, kekurangan dalam desain portofolionya untuk sebagian besar programmer pemula ternyata kurang lebih sama. Kemudian Como mendapat ide bahwa akan menyenangkan untuk mengumpulkan komentar yang sering diulang ke dalam satu daftar. Alhasil, ia mendapatkan materi yang cukup luas, yang diformat menjadi buku elektronik - tersedia di situs penulis secara gratis. Di bawah potongan Anda akan menemukan tesis utama, rekomendasi dan sumber yang diberikan di dalamnya.
Masalah umum
Apa yang dimaksud dengan portofolio pengembang?
Dalam kebanyakan kasus, kita berbicara tentang situs tempat proyek pribadi disajikan, di mana seseorang dapat menilai pengalaman dan keterampilannya.
Itu perlu?
Tidak. Tidak semua pengembang memasukkan portofolio dalam resume mereka, dan tidak semua pemberi kerja mengharapkan informasi seperti itu. Apalagi ada yang bahkan tidak mau membuka link tersebut. Portofolionya bersifat opsional, tetapi dapat memberikan keuntungan yang baik atas persaingan dan menunjukkan kepada Anda apa yang dapat Anda lakukan sejelas mungkin.
Apakah tidak ada cara lain untuk memamerkan karya Anda?
Ada. Resume sekarang sering kali menyertakan, misalnya, tautan ke LinkedIn atau Github - sumber daya yang juga dapat digunakan untuk menyoroti aktivitas Anda. Keuntungan dari situs portofolio adalah memungkinkan Anda menceritakan tentang diri Anda dengan cara yang nyaman dan bermanfaat bagi Anda. Tidak perlu mengikuti format yang telah ditentukan, Anda dapat memberikan konteks sebanyak mungkin untuk setiap proyek sesuai keinginan Anda.
Untuk siapa tips ini?
Untuk pengembang yunior, yang, di satu sisi, sudah memiliki sesuatu untuk ditampilkan, dan di sisi lain, ingin mengimbangi kurangnya pengalaman kerja di mata pemberi kerja dan menonjol dari keramaian. Penulis berfokus terutama pada front-end dan full-stack, tetapi sebagian besar rekomendasi juga akan berguna bagi mereka yang terlibat dalam pengembangan backend atau seluler.
Berapa banyak proyek yang harus dimiliki situs?
Jumlah optimal adalah dari dua hingga lima. Pendekatan "lebih banyak lebih baik" tidak berfungsi di sini - portofolio dirancang untuk menampilkan contoh kerja terbaik, dan tidak mencakup keseluruhan kronologi. Jika Anda benar-benar ingin menampilkan lebih banyak, setidaknya beri peringkat - biarkan yang terbaik bertahan di halaman utama, dan sisanya dibuka dengan mengklik kucing "Tampilkan lebih banyak" atau tab arsip.
Jika hanya ada satu proyek, tetapi skala dan kualitasnya layak, diperbolehkan menambahkan kuantitas dengan mengorbankan sesuatu yang kurang mengesankan: membuat produk sederhana murni untuk portofolio atau variasi kecil pada tema utama (misalnya , ekstensi berdasarkan aplikasi seluler), tunjukkan proyek saat ini dengan tanda "Dalam proses", beri tahu tentang beberapa aktivitas yang tidak terkait langsung dengan kode (dokumentasi, mengatur acara untuk pengembang).
Proyek apa yang tidak dapat dimasukkan?
Ada beberapa kategori proyek yang harus digunakan dengan sangat hati-hati:
- , – , . , , , . . , ( 50% ) .
- . – . , .
- -. – . , - . , , , .
- , . « ». , . , , . , , .
Proyek mana yang harus Anda sertakan terlebih dahulu?
Selain yang sudah jelas (baik dan menarik), ada beberapa karakteristik yang cenderung sangat dihargai oleh pemberi kerja:
- Targetkan proyek yang dibuat untuk memecahkan masalah tertentu. Mereka menunjukkan bahwa Anda tahu bagaimana menerjemahkan keterampilan teknis ke dalam praktik, dan memungkinkan Anda mengevaluasi pendekatan Anda terhadap semua aspek manajemen proyek, dari awal hingga akhir.
- Proyek langsung yang memiliki pengguna nyata, bahkan sedikit, cenderung menghasilkan lebih banyak minat daripada versi demo produk yang dibuat demi proses itu sendiri.
- Proyek berskala besar dan kompleks yang membutuhkan banyak waktu dan tenaga. Tidak setiap junior, pada prinsipnya, mampu menyelesaikan sesuatu seperti ini, jadi fakta keberadaan akan mendukung Anda.
- . , , , . , , , .
Secara umum, Anda dapat menambahkan berbagai produk aktivitas Anda ke dalam portofolio: proyek pendidikan, piala dari hackathon, program kecil yang Anda buat untuk kebutuhan Anda sendiri. Para junior sering khawatir bahwa proyek mereka tidak istimewa, mereka tidak kewalahan oleh kerumitan dan akan menyedihkan untuk dilihat dalam portofolio. Jangan menaikkan standar terlalu tinggi. Jika Anda memiliki sesuatu untuk diceritakan tentang proyek (bagaimana Anda memperebutkan implementasi fungsi, bagaimana Anda memilih satu solusi, dan kemudian meninggalkannya demi solusi lain), kemungkinan besar, itu memiliki kompleksitas tersembunyi yang cukup dan cukup mencerminkan Anda saat ini. tingkat.
Struktur dan konten situs
Situs portofolio biasanya tidak memiliki struktur yang sangat luas. Faktanya, ini bermuara pada serangkaian blok semantik berikut: bagian "Tentang saya", daftar / kisi proyek, dengan deskripsi terperinci untuk masing-masing, kontak. Di bawah ini kita akan melihat masing-masing secara terpisah.
Tentang saya
Audiens situs portofolio terdiri dari dua kelompok: spesialis perekrutan dan pengembang. Pada tahap pekerjaan yang berbeda, situs Anda cenderung dilihat oleh keduanya. Oleh karena itu, Anda perlu melakukan manuver untuk mengesankan kedua grup sekaligus.
Bagian "Tentang Saya" sebagian besar ditujukan untuk petugas personalia. Tugas utamanya adalah membuat "bisnis pribadi" Anda setidaknya sedikit berkesan dengan latar belakang orang lain. Menurut pendapat penulis, momok utama situs portofolio sekarang adalah impersonalitas lengkap, keinginan untuk menyesuaikan diri dengan gaya korporat yang menggunakan tulang punggung struktural yang sama (lulus dari universitas ini dan itu, bekerja atau bekerja di sana, saya memiliki teknologi ini dan itu. ) dan klise pidato perekrutan.
Jika Anda berusaha menulis teks terperinci untuk blok ini, cobalah untuk menambahkan sesuatu yang orisinal padanya - bahkan ketika Anda mulai berkembang, setidaknya filosofi kehidupan dan pemrograman seperti apa yang Anda miliki. Bilah terendah untuk menilai orisinalitas adalah sebagai berikut: jika Anda melihat teks Anda di situs orang lain, apakah Anda akan langsung mengenali plagiarisme, atau apakah Anda akan berpikir pada saat pertama bahwa seseorang baru saja menceritakan tentang dirinya dengan istilah yang sama?
Pengembang jarang menunjukkan minat pada bagian ini, jadi yang terbaik bagi mereka adalah membawa daftar bahasa dan teknologi yang Anda gunakan untuk bekerja di tempat yang menonjol.
Satu hal lagi yang perlu diingat saat memilih nada cerita Anda adalah SDM dan pengembang melihat keterampilan soft junior Anda melalui lensa yang berbeda. Petugas personalia lebih cenderung menghargai antusiasme dan dedikasi terhadap pekerjaan mereka. Bagi pengembang, pertama-tama, harga diri yang memadai itu penting - mereka masih harus mengajari Anda. Oleh karena itu, saat menjelaskan kecintaan Anda pada kode tersebut, cobalah untuk tidak terlalu percaya diri. Jika Anda membayangkan diri Anda sebagai spesialis dan pengembangan yang mapan, HR mungkin dijiwai dengan kepercayaan diri Anda, tetapi mentor masa depan kemungkinan besar akan berpikir bahwa bekerja dengan Anda akan sulit.
Proyek dan deskripsinya
Cerita tentang proyek adalah blok semantik pusat dalam struktur situs. Biasanya, halaman utama berisi kisi atau daftar proyek dengan presentasi singkat masing-masing: judul, tangkapan layar, beberapa baris deskripsi, tumpukan teknologi, tautan ke versi demo.
Setiap kartu tersebut harus diterjemahkan ke halaman dengan deskripsi rinci. Jika informasinya terbatas pada item yang terdaftar, makna situs portofolio sebenarnya hilang.
Mengharapkan produk berbicara sendiri adalah kesalahan serius yang dilakukan banyak pengembang. “Menjual” karya Anda dianggap tidak pantas, jadi masalahnya hanya terbatas pada tautan ke versi demo dan, dalam skenario yang ideal, basis kode - pemberi kerja diberi kesempatan untuk membuat opini sendiri.
Ada dua kelemahan kritis dari pendekatan ini. Pertama, tanpa pengawasan Anda, interaksi pengunjung situs dengan produk menjadi tidak dapat diprediksi. Akan sangat sulit bagi Anda untuk menebak sebelumnya bagaimana perjalanan pengguna akan berjalan dan pada titik mana hal itu akan mengganggu, terutama jika Anda belum pernah melakukan desain UX. Orang tersebut mungkin tidak mencapai hal-hal yang paling Anda banggakan dan yang Anda pertaruhkan.
Sama halnya dengan kode. Bukan rahasia lagi bahwa dalam hal kualitas, basis kode biasanya heterogen: beberapa bagian dibuat dengan cerdas dan anggun, beberapa dipegang pada pita listrik. Secara kebetulan, yang melihatnya mungkin akan terkejut oleh yang kedua, dan bukan yang pertama.
Kelemahan kedua adalah bahwa pendekatan ini, pada prinsipnya, tidak bekerja dengan baik untuk tujuan akhir. Portofolio berfungsi untuk memberi tahu tentang Anda sebagai seorang spesialis. Produk mandiri tidak memberikan banyak informasi tentang siapa yang membuatnya, terutama jika Anda mempertimbangkan bahwa kenalan dengan versi demo atau kode dalam sembilan dari sepuluh akan sangat sepintas. Di awal artikel, kami berbicara tentang fakta bahwa situs pribadi, tidak seperti platform lain, memungkinkan untuk menghadirkan lebih banyak konteks. Ini tentang melihat proyek dari dalam, tentang bagaimana desain dan pengembangan berlangsung. Informasi ini berguna bagi pemberi kerja dan menjelaskan kualitas profesional Anda dengan sebaik-baiknya.
Como menyediakan cetak biru untuk digunakan saat menulis tentang sebuah proyek. Anda tidak harus membahas semua poin, fokuslah pada poin yang benar-benar ingin Anda bicarakan.
pengantar
- Gambaran umum, inti dari proyek
- Daftar fungsi utama dan fitur pembeda
- Peran Anda dalam proyek: apakah Anda bekerja sendiri atau dalam kelompok, hal-hal apa yang Anda terapkan?
- Teknologi yang digunakan
- Tautkan ke demo dan basis kode (jika memungkinkan)
Tujuan dan alasan
- Mengapa Anda melakukan proyek ini, apa maknanya bagi Anda secara pribadi?
- Apa yang diharapkan pada awalnya, seperti apa produk pada tahap desain?
- Komentar lain tentang tahap perencanaan.
Poin-poin penting
- ? – , , .
- , .
- , , . , , , .
- ? - , , - .
- , , ? ? ?
- Apakah pengalaman yang didapat memengaruhi pekerjaan Anda di masa depan? Jika Anda dapat menautkan kedua proyek, menunjukkan bagaimana pengetahuan yang diperoleh dalam satu proyek berguna di proyek lain, itu akan baik-baik saja.
Status saat ini adalah bagian opsional. Masuk akal untuk memasukkannya jika produk tersebut benar-benar digunakan oleh seseorang; lalu Anda dapat menyebutkan jenis audiens yang dia miliki dan apa yang dikatakan orang. Jika proyek dibuat khusus untuk portofolio, Anda tidak boleh memikirkannya.
Teksnya, kemungkinan besar, akan cukup banyak - deskripsi satu proyek bisa memakan waktu dua atau tiga halaman. Untuk meningkatkan peluang pembaca mencapai akhir, sesuaikan untuk membaca secara diagonal: paragraf pendek, judul, daftar.
Kontak
Biasanya, blok ini berisi formulir umpan balik. Jika lebih nyaman bagi Anda untuk berkomunikasi melalui email, Anda dapat membatasi diri Anda pada link mailto langsung. Tautan ke halaman di jejaring sosial dan blog profesional, jika Anda menjalankannya, juga dibawa ke sini. Sekarang ada kecenderungan untuk menanamkan blog langsung ke situs portofolio, tetapi penulis skeptis tentang gagasan ini. Portofolio dirancang terutama untuk komunikasi dengan pemberi kerja - kemungkinan dia akan menemukan waktu untuk membaca postingan sangat kecil. Selain itu, Anda harus memantau dengan cermat keteraturan pembaruan dan kualitas konten.
Implementasi teknis
Desain
Hal-hal buruk dulu: desain memiliki banyak bobot. Konten adalah konten, tetapi fitur persepsi visual bekerja tanpa gangguan, jadi semakin indah ( tidak lebih nyaman, lebih indah ) situs, semakin profesional Anda akan melihat di mata pengunjung.
Tidak semua pengembang kuat dalam desain atau mampu membeli desain khusus, sehingga penggunaan templat siap pakai tampaknya menjadi opsi intensif sumber daya yang optimal untuk hasilnya. Hal terbaik adalah memilih beberapa dan mencampurnya untuk membuat antarmuka terlihat lebih atau kurang segar.
Como mencatat bahwa selama penjelajahan portofolionya yang masif, ia berulang kali menemukan desain populer yang sama, hanya menyalin piksel untuk piksel:
Ini jelas tidak perlu. Sekalipun desainnya berada dalam domain publik, ia meninggalkan perasaan sekunder yang tidak menyenangkan dan menimbulkan pertanyaan tentang legalitas peminjaman.
Berikut adalah sejumlah templat yang dapat Anda andalkan saat membuat desain:
Portofolio Starter Portofolio
Craig Portofolio
Alex Portofolio
Dexter
Novo
Kester
Art Director
Pengembangan situs web
Jika Anda melamar posisi front-end atau full-stack developer, Anda perlu membuat situs web Anda sendiri, tanpa solusi nocode - posisi mewajibkan ... Anda dapat menggunakan alat apa saja, sebaiknya yang sudah Anda kenal, agar tidak membuang waktu ekstra. Pilihan untuk dipertimbangkan: vanilla HTML / CSS / JS, 11ty, Gatsby , Selanjutnya , Jekyll . Atas nama saya sendiri, penulis merekomendasikan Gatsby, paling tidak karena banyak tema dan plugin telah dibuat untuknya, yang sangat menghemat tenaga.
Elemen interaktif, animasi kecil, dan bonus visual lainnya yang membuat penjelajahan lebih hidup terlihat sangat menguntungkan di situs. Jangan takut untuk menambahkan sesuatu yang lucu atau tidak terduga dari diri Anda.
Nama Domain
Idealnya, itu harus seperti firstnamelastnamelatinice.com. Jika perlu (misalnya, jika nama sudah ada), Anda dapat memasukkan kode atau elemen dev. Nicky tidak disarankan untuk digunakan kecuali Anda adalah orang terkemuka dalam komunitas online.
Domain level teratas dapat dipilih sesuai selera Anda (co, io, domain spesifik dari berbagai negara). Satu-satunya poin: Anda harus menghindari .info, yang banyak diasosiasikan dengan spam dan scammer. Situs Portofolio
Hosting
biasanya statis, sehingga tidak menimbulkan masalah dengan server. Ada sejumlah layanan untuk menghosting situs statis, di antaranya Como menyoroti Vercel , Netlify , Github Pages , Surge .
*
Selain teori untuk kejelasan, Como memberikan dua contoh portofolio dengan analisis mendetail. Yang pertama adalah situs Charlie Smith, orang fiksi yang dibuat sendiri oleh penulisnya, dengan fokus pada sampel rata-rata dari Web. Yang kedua adalah situs Julia Johnson , seorang mahasiswa dan magang IBM, yang memberikan kesan paling menyenangkan padanya dengan latar belakang orang lain yang dikirim oleh pelanggan. Dengan membandingkan satu sama lain, mudah untuk melihat perbandingannya dengan rekomendasi.
Situs Charlie - desain yang tidak ekspresif tanpa tikungan, cerita stereotip tentang diri Anda, deskripsi singkat dan dangkal tentang proyek Situs
Julia - desain yang lebih efektif, struktur yang sukses, cerita yang terkendali tetapi bukan tanpa wajah tentang diri Anda, banyak elemen yang menghidupkan halaman, deskripsi rinci untuk setiap proyek