TL; DR Halo. Nama saya Bogdan dan saya sedang mempelajari masalah membaca kode. Saya baru saja mengunduh versi codecrumbs pertama yang berfungsi, alat visual untuk mempelajari kode sumber dengan remah roti.
Repositori github
dapat dilihat di sini.
Masalah
Baru-baru ini, saya melakukan survei tentang masalah utama yang kita hadapi ketika kita mulai mempelajari kode sumber proyek besar (jika Anda belum berpartisipasi, maka Anda masih dapat menyelesaikan survei di
sini ).
Pertanyaan utama yang menarik minat saya adalah: apa sebenarnya bagian tersulit dari mempelajari kode untuk proyek baru untuk Anda? Mari kita lihat tren tanggapan pada gambar di bawah ini.
Seperti yang diharapkan, jauh lebih sulit untuk menggabungkan semua poin menjadi satu gambar daripada memahami apa yang dilakukan kode di dalam fungsi atau file tertentu (anehnya, editor kode lebih memperhatikan hanya satu file, bukan keseluruhan gambar "). Masalahnya adalah ketika kita pertama kali membuka kode proyek, terlalu banyak informasi yang dibuang pada kita sekaligus. Kita mulai melompat di antara file-file tanpa arti, dalam kekacauan penuh, sering membuka file yang sama beberapa kali, menyadari bahwa "oh, saya sudah melihat ini, ini bukan tempat" atau "di mana tempat yang tepat yang baru saja saya lihat “Dan buang-buang waktu. Jadi, kita pasti membutuhkan semacam alat untuk menandai tempat-tempat penting dalam kode dan, idealnya, untuk membangun "gambaran visual yang umum" tentang bagaimana semuanya bekerja.
Codecrumbs untuk menyelamatkan
Codecrumbs (nama ini berasal dari "kode" dan "remah roti") adalah alat yang memungkinkan Anda untuk meninggalkan "remah roti" dalam kode dan membangun diagram visual pada mereka.
Bagaimana cara kerjanya? Anda menjalankan perintah codecrumbs yang menentukan jalur ke kode proyek, codecrumbs menganalisis kode sumber dan membuat representasi visualnya. Tambahkan codecrumb-comment dan status yang diperbarui dari basis kode akan ditampilkan di klien visual di browser dengan cepat.
Fitur utama
Jejak remah roti ("rantai remah") - urutan remah yang menggambarkan beberapa jenis skenario di dalam aplikasi (misalnya, otentikasi atau mengirimkan formulir ke server, dll.).
Pohon ketergantungan (“tree of dependencies”) - memudahkan untuk menentukan “apa yang sedang diimpor”.
Flowchart ("flowchart") - memungkinkan Anda untuk melihat diagram alur dari file yang dipilih.
Selain itu, hanya dengan menjalankan "codecrumbs" untuk beberapa proyek secara bersamaan, Anda dapat mempelajari integrasi satu sama lain.
Setelah semua ini, Anda juga dapat mengunduh dan "mengirim ke teman" skema yang baru Anda pelajari. Gunakan fungsi "unduh" untuk mendapatkan status aplikasi saat ini dalam format file json. File akan berisi jumlah data minimum untuk menampilkan sirkuit. Untuk ini, tidak perlu memiliki kode sumber yang sama secara lokal - "codecrumbs" dapat bekerja dalam mode "standalone" di browser. Contohnya ada di
sini .
Dukungan bahasa. Bahasa pemrograman berikut ini didukung dalam versi saat ini:
- Javascript
- TypeScript
- Python
- Php
- Jawa
- C ++
JavaScript menawarkan lebih banyak fungsi daripada yang lain, karena hanya menggunakan pengurai AST untuk memproses kode.
Rencana selanjutnya
Alat ini (codecrumbs) memungkinkan Anda untuk mempelajari, mendokumentasikan dan menjelaskan basis kode lebih cepat. Selain itu, fungsi "unduh / unggah" membuatnya sangat mudah untuk mendistribusikan hasil penelitian kode. Tujuan utamanya adalah untuk menempatkan banyak "kasus" seperti itu di
https://codecrumbs.io dan mendapatkan sesuatu dalam gaya perpustakaan proyek Dijelaskan dengan codecrumbs - tempat di mana setiap orang dapat berbagi pengetahuan tentang contoh-contoh proyek nyata.
Lebih banyak fitur keren segera hadir, nantikan! Dan ya, klik “bintang” dan beri tahu teman-teman Anda :)
Gudang Github ada di sini
github.com/Bogdan-Lyashenko/codecrumbs . Terima kasih