Seringkali, programmer harus berurusan dengan kode asing orang lain. Ini mungkin studi tentang proyek-proyek open source yang menarik, dan kebutuhan untuk bekerja - dalam kasus bergabung dengan proyek baru, ketika menganalisis sejumlah besar kode warisan, dll. Saya pikir Anda masing-masing telah menemukan ini.
Dalam proses pekerjaan seperti itu, saya selalu merasakan kebutuhan akan alat yang dirancang khusus untuk memudahkan proses pencelupan cepat dalam volume besar kode asing. Seiring waktu, semakin banyak ide menarik muncul di berbagai bidang, dan semuanya membutuhkan studi kode orang lain dalam jumlah besar. Jaringan terdesentralisasi, cryptocurrency, compiler, sistem operasi - semua ini adalah proyek besar yang membutuhkan studi kode dalam jumlah yang signifikan. Pada titik tertentu, saya memutuskan: Anda hanya perlu mengambil dan membuat alat khusus ini. Dalam artikel ini, saya sampaikan kepada Anda apa yang muncul sebagai hasilnya.
Apa yang secara umum dapat membantu dalam mempelajari kode? Tentu saja, ada baiknya ketika ada dokumentasi terperinci untuk kode - sebagai aturan, tidak ada di sana; gaya pengkodean yang baik dan komentar juga bagus, tetapi ini biasanya tidak cukup. Ada juga berbagai generator dokumentasi kode, seperti doxygen. Dengan menganalisis struktur kode dan komentar dokumenter khusus, mereka menghasilkan dokumentasi dalam bentuk hypertext dalam format html. Kerugian utama dari dokumentasi tersebut adalah tidak interaktivitasnya; dalam proses mempelajari kode, pemrogram mungkin memiliki beberapa pemahaman baru, dan untuk mencerminkannya dalam dokumentasi, Anda perlu menulis komentar dokumenter baru dan membuat kembali semua dokumentasi lagi.
Selain itu, dokumentasi tersebut tidak secara langsung berhubungan dengan kode di lingkungan pengembangan, yaitu mengklik hyperlink tidak akan membuka file dengan kode ini di IDE. Ada analogi yang baik untuk alat-alat seperti itu, yang berakar pada zaman kuno: pembongkaran pertama adalah alat-alat baris perintah yang menghasilkan kode tanpa campur tangan pengguna. Kemudian muncul pembongkar interaktif pertama ("IDA pro"), yang mengasumsikan partisipasi aktif pengguna dalam proses pembongkaran - menugaskan nama variabel dan fungsi, mendefinisikan struktur, menulis komentar pada kode, dll.
Analisis volume besar kode asing dalam bahasa tingkat tinggi dalam beberapa hal sangat mirip dengan pembongkaran. Maka, saya mulai mengembangkan ide tentang apa yang sebenarnya saya inginkan. Sebagian besar IDE memiliki tampilan File klasik dan panel Tampilan Kelas yang menampilkan struktur file dan ruang nama / kelas di dalamnya. Tetapi struktur ini biasanya terhubung erat dengan sintaks bahasa dan tidak memungkinkan Anda untuk membuat semantik kustom. Jadi, hal pertama yang saya ingin miliki adalah kemampuan interaktif untuk membangun pohon arbitrer yang berisi referensi kode bernama - untuk kelas dan fungsi yang sama, atau ke tempat-tempat yang sewenang-wenang sama sekali. Dan yang kedua adalah keinginan untuk entah bagaimana menandai kode secara langsung di editor. Tanda dapat membawa beragam makna: dari yang sederhana "dipelajari", "disortir", "ditulis ulang", hingga kode milik berbagai kelompok semantik. Anda dapat menandainya dengan komentar, tetapi saya ingin sesuatu yang lebih terlihat. Misalnya, perubahan warna latar belakang sepotong kode. Jadi pemisah warna KDPV adalah analogi yang cukup akurat dari dunia nyata.
Setelah percobaan pertama, saya segera menyadari bahwa ini harus menjadi plug-in untuk lingkungan pengembangan modern, dan bukan editor saya sendiri. Bekerja dari dua editor pada saat yang sama adalah bodoh dan tidak nyaman; prospek mengulangi semua kemungkinan lingkungan pengembangan tidak menginspirasi kegembiraan, dan mengapa apa yang telah dilakukan? Karena itu, plugin. Qt Creator dipilih sebagai IDE pertama hanya karena operasi navigasi kode paling populer (Pergi ke definisi, Temukan referensi, dll.) Dilakukan secepat mungkin. Lingkungan selanjutnya adalah Visual Studio, dan kemudian dalam kasus keberhasilan konsep itu sendiri - implementasi untuk IDE lain.
Sekarang tentang bagaimana semuanya diatur. Konsep "komentar penanda" diperkenalkan. Ini adalah komentar reguler dari bahasa pemrograman (saat ini ini adalah komentar baris tunggal "//" yang digunakan dalam banyak bahasa - C, C ++, C #, Java, ...), diikuti oleh urutan karakter khusus, diikuti oleh pengidentifikasi dan / atau tag, yang dapat diikuti oleh komentar manusia normal. Saya memperkenalkan tiga jenis komentar penanda
- Komentar untuk menyoroti area yang berubah-ubah. Satu-satunya jenis yang membutuhkan komentar penanda "dekat". Mulai dengan "// <<" dan diakhiri dengan "// >>".
- Komentar untuk menunjukkan baris sewenang-wenang dalam kode. Ditandai oleh "// $$"
- Komentar untuk menyorot blok kode yang benar secara sintaksis. Itu dimulai dengan "// @@" dan termasuk blok kode di bawah ini, dibatasi oleh kurung kurawal "{" dan "}", yang digunakan untuk blok kode di sebagian besar bahasa pemrograman mirip C. Analisis brace lengkap telah dilaksanakan - tanda kurung keriting diperbolehkan, dan parser dengan benar melewatkan tanda kurung keriting dalam garis dan komentar.
Selanjutnya, segera setelah karakter khusus, satu atau lebih pengidentifikasi, dipisahkan dengan koma, mengikuti. Identifier adalah "tag" dan dapat berarti apa yang diinginkan oleh programmer - tanda-tanda "dipelajari", "tulis ulang", "pahami", kepengarangan kode, hubungan kode dengan beberapa kelompok semantik, dll. Anda juga dapat menentukan satu pengidentifikasi unik - itu ditempatkan pertama dan dipisahkan dari yang lain oleh titik dua. Jika mau, Anda dapat menentukan warna latar belakang cuplikan kode secara eksplisit - kisi ditempatkan di akhir daftar tag, setelah itu warna dalam format RGB ditunjukkan (meskipun metode ini bukan yang terbaik - kami akan membicarakan metode lain yang lebih "benar" di kemudian hari). Dan pada akhirnya, Anda dapat memberi spasi, kemudian Anda dapat menulis komentar yang bisa dibaca manusia secara teratur. Saya mencoba memilih sintaks sedemikian rupa sehingga sesederhana mungkin untuk input cepat, tidak mengacaukan kode, dan nyaman untuk komentar biasa.
Meskipun input manual dari komentar marker dimungkinkan, ia seharusnya menggunakan tombol toolbar khusus untuk ini. Kursor diatur ke posisi kode yang diinginkan dan tombol ditekan (atau salah satu opsi terakhir dipilih dari menu).
Jika perlu, dialog input akan dibuka di mana Anda dapat memasukkan tag dan pengidentifikasi komentar penanda, deskripsi terperinci, dan juga memilih warna latar belakang. Data ini akan dimasukkan tidak hanya dalam kode, tetapi juga di pohon "CRContentTree", ditampilkan di samping di panel pohon (di mana FileView, ClassView, dll.). Perlu dicatat bahwa warna latar belakang bisa "transparan" - dalam hal ini, warna latar belakang blok penutup (jika ada) digunakan atau lampu latar tidak digunakan sama sekali.
Saat ini, pohon terdiri dari tiga bagian utama (simpul tingkat atas): FILES, TAGS, dan CATATAN (mungkin ini bukan solusi akhir, karena konsepnya belum cukup jelas, serta kenyamanan struktur seperti itu).
FILES adalah struktur file proyek, yang diekstraksi dari file proyek atau dari lokasi sumber pada disk. File node dibuat selama pembuatan pohon awal. Mengklik dua kali pada simpul file biasanya membuka file di editor IDE. Anda dapat menentukan penambahan komentar penanda dalam FILES - maka simpul anak akan muncul di file yang sesuai. Di sinilah pengidentifikasi komentar penanda yang unik ditambahkan. Sistem memeriksa keunikan pengidentifikasi dalam simpul file pohon dan memungkinkan untuk menghasilkan nama unik secara otomatis.
TAGS adalah cloud tag proyek global; tag tidak terikat pada file kode sumber dan dapat terjadi dalam file proyek apa pun sebanyak yang Anda suka.
CATATAN adalah tempat untuk menyimpan node yang dikelompokkan secara sewenang-wenang dan tidak terikat dengan struktur file. Setiap node berisi path file dan pengidentifikasi. Tujuan utamanya adalah untuk membuat grup logis khusus. Misalnya, "semua fungsi yang perlu ditulis ulang" atau "semua fungsi yang terkait dengan kriptografi", atau "urutan fungsi komunikasi jaringan dengan server" (karena node dalam pohon dipesan, cukup menempatkan node satu demi satu dapat menampilkan urutan apa pun).
Setiap simpul pohon memiliki menu konteks. Node dapat dihapus (meskipun ini tidak menghapus komentar penanda dari kode - selama saya tidak yakin ini diperlukan), Anda dapat mengeditnya. Anda dapat menambahkan node yang tidak terkait dengan komentar penanda: Anda dapat menambahkan misalnya tautan (Tautan). Mengklik dua kali pada simpul seperti itu akan membuka sumber daya terkait dalam program terkait, misalnya, hyperlink di browser.
Setiap node dapat dinonaktifkan dengan menghapus centang pada kotak centang di node. Ini akan menyebabkan penyorotan node ini dan semua node anak dalam kode dihapus. Jadi, dengan menghapus, misalnya, tanda centang dari tiga node root (FILES, TAGS dan CATATAN), Anda dapat mematikan sorotan dari semua komentar penanda, kecuali untuk mereka yang warnanya ditunjukkan secara eksplisit dalam kode (melalui bilah).
Mengklik dua kali pada simpul akan membuka file yang sesuai dalam IDE dan menempatkan kursor pada posisi kode yang sesuai. Untuk tag yang dapat terjadi berulang kali, alih-alih membuka file, daftar semua kejadian terbentuk, yang dimuat ke panel Output CR, dan dengan mengklik dua kali pada baris yang sesuai dari daftar ini Anda dapat membuka file dan posisi dalam kode.
Setiap node memiliki bidang untuk deskripsi terperinci (teks multi-garis panjang sewenang-wenang). Deskripsi ini dimuat ke area "Info CR" dengan pilihan sederhana dari simpul di pohon (dengan satu klik mouse), serta menempatkan kursor di mana saja di area yang disorot dalam kode dan mengklik tombol "Cari" pada bilah alat. Pengeditan selalu tersedia, teks yang diubah disimpan secara otomatis (dengan kehilangan fokus). Saya berpikir untuk membuat dukungan format Markdown di area ini, tetapi sejauh ini tangan saya belum mencapai titik ini.
Tidak selalu diinginkan (atau tidak selalu nyaman) untuk memasukkan komentar apa pun ke dalam kode. Oleh karena itu, kemungkinan kedua adalah "tanda tangan", yaitu gunakan sebagai penanda kode itu sendiri. Tanda tangan adalah urutan token tertentu (tidak termasuk spasi dan jeda baris - yaitu, "foo (1,2,3)" dan "foo (1, 2, 3) adalah satu dan sama). Ada tiga jenis tanda tangan:
- blok - blok disorot, dimulai dengan tanda tangan dan termasuk urutan kode yang terlampir dalam kurung keriting.
- single-line - seluruh baris dengan tanda tangan disorot
- simbolik - hanya urutan tanda tangan yang disorot. Lebih mudah menggunakan tanda tangan seperti itu untuk menyorot nama individu - variabel, fungsi, kelas.
Bekerja dengan blok tanda tangan sama dengan blok marker. Demikian pula, node dalam pohon dibuat.
Jika untuk simpul penanda pengidentifikasi dan tag dibuat secara terpisah, maka untuk simpul tanda tangan disarankan untuk menunjukkan dengan tepat bagaimana kita ingin mempertimbangkan tanda tangan - sebagai pengidentifikasi (dilampirkan ke file) atau sebagai tag global. Misalnya, untuk "nama" adalah logis untuk menggunakan mode tag - maka nama yang sesuai akan disorot dalam kode di seluruh proyek.
Fitur lain yang menarik adalah membangun cakupan kode. Fungsi khusus memindai kode dan menentukan tempat-tempat yang tidak ditandai sama sekali, dan membentuk daftar tempat-tempat tersebut di "Output CR". Ini tidak memperhitungkan baris dan komentar kosong akun, mis. pemindaian hanya memperhitungkan kode penting. Dengan mengklik dua kali pada baris daftar, Anda dapat pergi ke tempat ini dalam kode, dan setelah mempelajarinya, tandai dengan satu atau lain cara.
Sedikit tentang format penyimpanan database. Sebenarnya, hanya komentar penanda yang disimpan dalam kode sumber; isi pohon disimpan dalam file xml khusus dengan ekstensi ".cr". Tidak ada pengikatan eksplisit dari file database ke proyek, meskipun ketika Anda membuka proyek, upaya dilakukan untuk membuka file-cr dengan nama yang sama jika tidak ada file-cr yang telah diunggah sebelumnya.
Untuk meringkas. Secara umum, saya menerapkan hampir semua yang saya inginkan. Konsep ini baru dan tidak biasa, dan oleh karena itu perlu beberapa waktu dan umpan balik pengguna untuk memahami apa yang perlu dikembangkan dan apa yang dapat ditinggalkan. Dalam upaya untuk merealisasikan peluang sebanyak mungkin, sesuatu ternyata sedikit rumit, yang tidak bisa dihindari. Antarmuka itu sendiri mungkin belum ditetapkan dan akan berubah. Namun secara keseluruhan, tampaknya telah bekerja dengan cukup baik.
Apa yang ada dalam rencana. Versi ini adalah demo, sebagian besar mentah dan tidak dimaksudkan untuk penggunaan komersial. Saya memiliki mimpi - untuk membuat produk komersial saya sendiri, membawa pendapatan kecil tetapi tetap, cukup untuk melakukan proyek menarik lainnya. Selain itu, beberapa hal tidak disesuaikan untuk penggunaan komersial. Saya membayangkan bagaimana mengadaptasi sistem serupa untuk mode multi-pengguna, dengan mempertimbangkan fakta bahwa kode dapat diedit oleh beberapa orang yang bekerja secara bersamaan melalui sistem kontrol versi. Dimungkinkan juga untuk melihat ke arah pembuatan dokumentasi yang dikenal (html), mungkin alat untuk integrasi yang lebih dalam dengan kode (parsing bukan leksikal / braket, secara otomatis menerima daftar kelas dan metode dan mengubahnya menjadi node pohon). Tentu saja, memperbaiki bug (yang masih ada) dan meningkatkan fitur diperlukan. Dan tentu saja saya menunggu komentar Anda dengan ide dan saran :)
Itu saja untuk saat ini (walaupun masih ada beberapa fitur kecil yang tidak saya sebutkan dalam artikel - misalnya, saya menganggap perlu untuk menambahkan tab, karena tanpa itu sangat menyedihkan - walaupun ada beberapa plugin untuk tab; beberapa perintah dasar Qt juga ditampilkan pada bilah alat Pembuat tidak terkait dengan plugin; dll.)
Tautan unduhan:
https://www.dropbox.com/s/9iiw5x7elwy3tpe/CodeRainbow4.zip?dl=0Persyaratan sistem: Windows, Qt Creator> = 4.5.1 dikompilasi oleh MSVC2015 32bit (ini adalah perakitan standar yang didistribusikan di download.qt.io)
instalasi: unzip arsip dan salin plugin ke folder c: /Qt/Qt5.10.1/Tools/QtCreator/lib/qtcreator/plugins (ini adalah contoh untuk penempatan Qt standar, jika Anda memasang Qt secara berbeda atau versi lain - jalurnya akan berbeda) dan (kembali) jalankan Qt Creator.