treechan

? pohonchan?

Ini adalah klien baca-saja untuk 4chan (https://4chan.org) yang dirancang untuk menampilkan rangkaian pesan dan balasan dalam format berbasis pohon.

Mengapa?

Menurut saya cara 4chan mengatur balasan terhadap rangkaian pesan sangat membingungkan dan tidak membantu dalam menentukan alur percakapan. Di klien web 4chan, balasan ditampilkan dalam daftar datar, sesuai urutan postingan aslinya.

Saat rangkaian pesan mendapat lebih banyak balasan, wajar jika banyak percakapan dalam bentuk rantai balasan mulai terbentuk. Dari sini, setiap penambahan berikutnya pada rantai hanya ditambahkan ke daftar kronologis besar.

Ini berarti bahwa jika Anda menelusuri daftar tersebut, Anda akan menemukan postingan dari beberapa rantai balasan yang tidak ada hubungannya satu sama lain yang terus-menerus terjalin, memaksa Anda untuk terus-menerus berpindah konteks, dan mengharuskan Anda memverifikasi dengan cermat rantai balasan mana. sebenarnya membalas untuk mengikuti percakapan.

Secara keseluruhan, ini menjengkelkan.

Inilah sebabnya mengapa proyek ini ada - sekarang sangat mudah untuk mengikuti rangkaian balasan karena, sebenarnya, ini ditampilkan dengan benar! Balasan ke postingan menjadi turunannya, dan ditampilkan satu tingkat lebih dalam. Beginilah cara Reddit menyusun komentarnya, dan saya yakin ini adalah sistem intuitif yang meningkatkan pengalaman pengguna sepuluh kali lipat.

Desain Aplikasi

Aplikasi ini ditulis dalam Svelte dan berjalan hampir seluruhnya di sisi klien, menggunakan nginx sebagai proxy CORS ke server API 4chan. Anda dapat menjalankan satu container nginx yang menghosting aplikasi dan bertindak sebagai proxy CORS, membuatnya sangat ringkas & mudah diterapkan.

Aplikasi ini berukuran sekitar 38.43 KB termasuk semua aset HTML, JS & CSS. Dengan Gzip, ukurannya menyusut menjadi total 14 KB . Bangunan didukung oleh sistem build Vite dan tipe diterapkan dalam kode dengan TypeScript.

Gambar thread dimuat setiap kali di-scroll ke tampilan browser, yang bertujuan untuk menghilangkan panggilan API spam ke API 4chan. Proksi nginx CORS juga melampirkan header X-Forwarded-For dan X-Real-IP ke setiap permintaan untuk menunjukkan asal permintaan yang sebenarnya.

Instalasi

1. Instal dependensi host

Untuk menjalankan treechan, Anda memerlukan Docker dan Git. NodeJS tidak perlu diinstal pada host karena proses pembangunan sepenuhnya dimasukkan ke dalam container demi kenyamanan Anda.

Untuk memverifikasi bahwa Anda telah menginstal Docker:

 $ docker -v
Docker version 20.10.21, build baeda1f82a

$ git -v
git version 2.38.1

Versi Docker & git tidak harus cocok, cukup pastikan Anda memiliki versi terbaru.

2. Git-klon repositori

Sekarang Anda perlu mengkloning repositori dengan Git. Ini penting agar skrip build dapat dijalankan, jangan unduh file zip dari GitHub!

 $ git clone --depth=1 https://github.com/xxcodianxx/treechan.git

3. Jalankan skrip permulaan

Sekarang, Anda cukup menggunakan skrip run.sh yang disertakan dan skrip tersebut akan menginstal dan menjalankan treechan untuk Anda.

 $ ./run.sh

Tidak termasuk waktu pengunduhan jaringan, instalasinya sangat cepat (sekitar 2 detik).

Secara default, server berjalan pada port 8080 , tetapi ini dapat diubah di bagian atas file ./run.sh .

Selamat, sekarang treechan Anda sudah berjalan. Jika Anda melakukan ini di mesin lokal Anda, sekarang Anda dapat mengunjungi http://localhost:8080 dan nikmatilah.

Jika Anda melakukannya di server, ganti saja localhost dengan IP server Anda. Ingatlah untuk port forward port 8080 atau port pilihan Anda.