Il s'agit d'un client en lecture seule pour 4chan (https://4chan.org) conçu pour afficher les fils de discussion et les réponses dans un format arborescent.
Je trouve la façon dont 4chan organise les réponses aux fils de discussion est très désorientante et inutile pour déterminer le flux des conversations. Dans le client Web 4chan, les réponses sont affichées dans une liste plate, dans l'ordre dans lequel elles ont été publiées à l'origine.
À mesure qu'un fil de discussion reçoit davantage de réponses, il est naturel que plusieurs conversations sous forme de chaînes de réponses commencent à se former. À partir de là, chaque ajout ultérieur à la chaîne est simplement ajouté à la grande liste chronologique.
Cela signifie que si vous parcourez ladite liste, vous rencontrerez des messages provenant de plusieurs chaînes de réponse qui n'ont presque rien à voir les unes avec les autres, constamment entrelacées, vous obligeant à changer constamment de contexte et vous obligeant à vérifier méticuleusement quelle chaîne est la réponse. répond réellement afin de suivre la conversation.
Dans l'ensemble, c'est ennuyeux.
C'est pour cela que ce projet existe : il est désormais très simple de suivre la chaîne des réponses car, eh bien, elle s'affiche correctement ! Les réponses à un message deviennent ses enfants et sont affichées à un niveau plus profond. C’est également ainsi que Reddit structure ses commentaires, et je pense qu’il s’agit d’un système assez intuitif qui décuple l’expérience utilisateur.
L'application est écrite en Svelte et s'exécute presque entièrement côté client, en utilisant nginx comme proxy CORS pour les serveurs API de 4chan. Vous pouvez exécuter un conteneur nginx qui héberge à la fois l'application et agit comme proxy CORS, ce qui le rend très compact et facile à déployer.
L'application fait environ 38.43 KB
, y compris tous les actifs HTML, JS et CSS. Avec Gzip, la taille totale est réduite à 14 KB
. La construction est alimentée par le système de construction Vite et les types sont appliqués dans le code avec TypeScript.
Les images des fils de discussion sont chargées chaque fois qu'elles défilent dans la vue du navigateur, dans le but d'éliminer les appels d'API spam vers l'API de 4chan. Le proxy nginx CORS attache également les en-têtes X-Forwarded-For
et X-Real-IP
à chaque requête afin d'indiquer la véritable origine de la requête.
Pour exécuter Treechan, vous aurez besoin de Docker et de Git. Il n'est pas nécessaire d'installer NodeJS sur l'hôte car le processus de construction est entièrement conteneurisé pour votre commodité.
Pour vérifier que Docker est installé :
$ docker -v
Docker version 20.10.21, build baeda1f82a
$ git -v
git version 2.38.1
Les versions Docker et git ne doivent pas nécessairement correspondre, assurez-vous simplement d'avoir quelque chose de récent.
Vous devez maintenant cloner le référentiel avec Git. Ceci est important pour que le script de build s'exécute, ne téléchargez pas de fichier zip depuis GitHub !
$ git clone --depth=1 https://github.com/xxcodianxx/treechan.git
Maintenant, vous pouvez simplement utiliser le script run.sh
inclus et il installera et exécutera treechan pour vous.
$ ./run.sh
Hors temps de téléchargement réseau, l'installation est extrêmement rapide (environ 2 secondes).
Par défaut, le serveur s'exécute sur le port 8080
, mais cela peut être modifié en haut du fichier ./run.sh
.
Félicitations, vous avez maintenant Treechan en cours d'exécution. Si vous avez fait cela sur votre ordinateur local, vous pouvez maintenant visiter http://localhost:8080 et en profiter.
Si vous l'avez fait sur un serveur, remplacez simplement localhost
par l'adresse IP de votre serveur. N'oubliez pas de transférer le port 8080
ou le port de votre choix.