Commit 39c24db8b4
Unsigned
Layout: unified · split
content/blog/2024-12-27-tbd.org added +164
| @@ -0,0 +1,164 @@ | |||
| 1 | #+date: <2024-12-29 Sun 17:45:00> | ||
| 2 | #+title: Self-Hosting The Lounge: An IRC Web Client | ||
| 3 | #+description: Learn how to deploy The Lounge, an IRC web client, via Docker Compose on Linux. | ||
| 4 | #+filetags: :self-hosting: | ||
| 5 | #+slug: self-hosting-the-lounge | ||
| 6 | |||
| 7 | * The Lounge | ||
| 8 | |||
| 9 | [[https://thelounge.chat/][The Lounge]] is a self-hosted IRC client for the web, which supports a lot of | ||
| 10 | desirable features for a modern IRC client. The Lounge supports push | ||
| 11 | notifications, link previews, file uploads, always connected, multi-user | ||
| 12 | support, and is available as a PWA for mobile devices. | ||
| 13 | |||
| 14 | I wanted to write this as I had written a post about [[https://cleberg.net/blog/self-hosting-convos.html][self-hosting Convos]] and | ||
| 15 | have recently migrated over to The Lounge instead. | ||
| 16 | |||
| 17 | If you'd like to try a demo first, head over to [[https://demo.thelounge.chat/][the official demo website]]. | ||
| 18 | |||
| 19 | ** Installation (Docker) | ||
| 20 | |||
| 21 | I install everything I can via Docker, so this tutorial will install The Lounge | ||
| 22 | with the Docker Compose platform. | ||
| 23 | |||
| 24 | You can find the official docker version of The Lounge's repository on GitHub at | ||
| 25 | [[https://github.com/thelounge/thelounge-docker][thelounge-docker]]. | ||
| 26 | |||
| 27 | To start, let's create a directory for this app and create the =compose.yml= file. | ||
| 28 | |||
| 29 | #+begin_src shell | ||
| 30 | mkdir thelounge | ||
| 31 | cd thelounge | ||
| 32 | nano compose.yml | ||
| 33 | #+end_src | ||
| 34 | |||
| 35 | Within this configuration file, you can paste the content below and customize as | ||
| 36 | needed. If you want to use a different port on your machine, change the first | ||
| 37 | port on the =9000:9000= line. Additionally, you may move the volume to a | ||
| 38 | different location if required. | ||
| 39 | |||
| 40 | #+begin_src yaml | ||
| 41 | services: | ||
| 42 | thelounge: | ||
| 43 | image: ghcr.io/thelounge/thelounge:latest | ||
| 44 | container_name: thelounge | ||
| 45 | ports: | ||
| 46 | - "9000:9000" | ||
| 47 | restart: always | ||
| 48 | volumes: | ||
| 49 | - ./.thelounge:/var/opt/thelounge | ||
| 50 | #+end_src | ||
| 51 | |||
| 52 | Save and close the file and you can now launch the service. | ||
| 53 | |||
| 54 | #+begin_src shell | ||
| 55 | sudo docker compose up -d | ||
| 56 | #+end_src | ||
| 57 | |||
| 58 | The service is now available at =localhost:9000= or =machine_ip:9000= if you're | ||
| 59 | browsing from a different device. Don't forget to allow the port through your | ||
| 60 | machine's firewall, if you have one enabled. | ||
| 61 | |||
| 62 | #+caption: Login | ||
| 63 | [[https://img.cleberg.net/blog/20241229-thelounge/login.png]] | ||
| 64 | |||
| 65 | ** Nginx Reverse Proxy | ||
| 66 | |||
| 67 | If you want to access the service via a domain name (=thelounge.example.com=), | ||
| 68 | you can use Nginx as a reverse proxy. | ||
| 69 | |||
| 70 | First, create the Nginx configuration file. | ||
| 71 | |||
| 72 | #+begin_src shell | ||
| 73 | sudo nano /etc/nginx/conf.d/ | ||
| 74 | #+end_src | ||
| 75 | |||
| 76 | The configuration below assumes you have a wildcard certificate for HTTPS (:443) | ||
| 77 | traffic via =example.com=. If you don't, you'll need to obtain an SSL | ||
| 78 | certificate to use HTTPS. | ||
| 79 | |||
| 80 | #+begin_src configuration | ||
| 81 | upstream irc_upstream { server 127.0.0.1:9000; } | ||
| 82 | |||
| 83 | # HTTP redirect | ||
| 84 | server { | ||
| 85 | listen 80; | ||
| 86 | listen [::]:80; | ||
| 87 | server_name thelounge.example.com; | ||
| 88 | include custom.d/letsencrypt.conf; | ||
| 89 | |||
| 90 | if ($host ~ ^[^.]+\.example\.com) { | ||
| 91 | return 301 https://$host$request_uri; | ||
| 92 | } | ||
| 93 | } | ||
| 94 | |||
| 95 | # HTTPS | ||
| 96 | server { | ||
| 97 | listen 443 ssl; | ||
| 98 | listen [::]:443 ssl; | ||
| 99 | http2 on; | ||
| 100 | server_name thelounge.example.com; | ||
| 101 | |||
| 102 | # SSL | ||
| 103 | ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; | ||
| 104 | ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; | ||
| 105 | ssl_trusted_certificate /etc/letsencrypt/live/example.com/chain.pem; | ||
| 106 | |||
| 107 | # reverse proxy | ||
| 108 | location / { | ||
| 109 | proxy_pass http://irc_upstream; | ||
| 110 | client_max_body_size 0; | ||
| 111 | proxy_set_header X-Request-Base "$scheme://$host/"; | ||
| 112 | |||
| 113 | # Standard reverse proxy settings | ||
| 114 | proxy_set_header Host $host; | ||
| 115 | proxy_set_header Upgrade $http_upgrade; | ||
| 116 | proxy_set_header Connection upgrade; | ||
| 117 | proxy_set_header Accept-Encoding gzip; | ||
| 118 | proxy_set_header X-Real-IP $remote_addr; | ||
| 119 | proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; | ||
| 120 | proxy_set_header X-Forwarded-Proto $scheme; | ||
| 121 | proxy_set_header X-Forwarded-Host $http_host; | ||
| 122 | proxy_set_header X-Forwarded-Uri $request_uri; | ||
| 123 | proxy_set_header X-Forwarded-Ssl on; | ||
| 124 | proxy_redirect http:// $scheme://; | ||
| 125 | proxy_http_version 1.1; | ||
| 126 | proxy_set_header Connection ""; | ||
| 127 | proxy_cache_bypass $cookie_session; | ||
| 128 | proxy_no_cache $cookie_session; | ||
| 129 | proxy_buffers 64 256k; | ||
| 130 | } | ||
| 131 | } | ||
| 132 | #+end_src | ||
| 133 | |||
| 134 | Finally, restart Nginx to see the effects. | ||
| 135 | |||
| 136 | #+begin_src shell | ||
| 137 | sudo systemctl restart nginx.service | ||
| 138 | #+end_src | ||
| 139 | |||
| 140 | ** Initial Setup | ||
| 141 | |||
| 142 | The first thing you'll need to do is create a user. You can do this with the | ||
| 143 | docker container with the following command, which will ask for a password. | ||
| 144 | |||
| 145 | #+begin_src shell | ||
| 146 | sudo docker exec --user node -it thelounge thelounge add [username] | ||
| 147 | #+end_src | ||
| 148 | |||
| 149 | Once the user has been created, you'll be able to log in to the web interface. | ||
| 150 | Once created, you can change your password in the settings panel of the web | ||
| 151 | interface. | ||
| 152 | |||
| 153 | Finally, you can connect to an IRC server with the plus (=+=) button at the | ||
| 154 | bottom of the sidebar and connect to individual channels or users via the plus | ||
| 155 | (=+=) button next to your server's name in the sidebar. | ||
| 156 | |||
| 157 | #+caption: New Server Connection | ||
| 158 | [[https://img.cleberg.net/blog/20241229-thelounge/new_connection.png]] | ||
| 159 | |||
| 160 | #+caption: Existing Server Connection | ||
| 161 | [[https://img.cleberg.net/blog/20241229-thelounge/existing_connection.png]] | ||
| 162 | |||
| 163 | #+caption: Channel View | ||
| 164 | [[https://img.cleberg.net/blog/20241229-thelounge/channel.png]] | ||
theme/templates/index.html +7 −6
| @@ -8,6 +8,13 @@ uid [ultimate] Christian Cleberg <hello@cleberg.net></pre> | |||
| 8 | <section> | 8 | <section> |
| 9 | <h2>Recent Blog Posts</h2> | 9 | <h2>Recent Blog Posts</h2> |
| 10 | 10 | ||
| 11 | <div class="post"> | ||
| 12 | <time datetime="2024-12-29 17:45:00">2024-12-29</time> | ||
| 13 | <a href="/blog/self-hosting-the-lounge.html" | ||
| 14 | >Self-Hosting The Lounge: An IRC Web Client</a | ||
| 15 | > | ||
| 16 | </div> | ||
| 17 | |||
| 11 | <div class="post"> | 18 | <div class="post"> |
| 12 | <time datetime="2024-10-31 11:01:05">2024-10-31</time> | 19 | <time datetime="2024-10-31 11:01:05">2024-10-31</time> |
| 13 | <a href="/blog/continue-ollama-code-assistant.html" | 20 | <a href="/blog/continue-ollama-code-assistant.html" |
| @@ -20,12 +27,6 @@ uid [ultimate] Christian Cleberg <hello@cleberg.net></pre> | |||
| 20 | >Self-Hosting Transmission Bittorrent Client</a | 27 | >Self-Hosting Transmission Bittorrent Client</a |
| 21 | > | 28 | > |
| 22 | </div> | 29 | </div> |
| 23 | <div class="post"> | ||
| 24 | <time datetime="2024-09-20 13:38:52">2024-09-20</time> | ||
| 25 | <a href="/blog/prometheus-grafana-cloud.html" | ||
| 26 | >Linux Observability with Self-Hosted Prometheus and Grafana Cloud</a | ||
| 27 | > | ||
| 28 | </div> | ||
| 29 | 30 | ||
| 30 | <br /> | 31 | <br /> |
| 31 | <a href="/blog/">All Posts →</a> | 32 | <a href="/blog/">All Posts →</a> |