This week I built my own forum app at http://nomadlist.com/forum  from scratch: it features nested replies, upvotes/downvotes like Reddit and location-based tagging of posts, here's why and how I built it 👇
Back when Nomad List was launched I quickly needed social features and I had no idea how to code them myself, I mean I didn't even understand databases back then and would use text files!

So back then Discourse seemed the easiest/fastest way to set up a forum, but...
...Discourse slowly became increasingly painful to work with. It started with how convoluted it was to integrate it into the site.

There was no easy styling a la Wordpress, instead it used Ember JS Handlebars:
...which when I finally managed to make it work and look good so the forum looked like part of the rest of the site, Discourse would then update and replaced it so the handlebars stopped working and I had to rewrite the entire styling integration.
The update process was an endless problem with Discourse, there's a new release like every week and it would often break at least something in your install.

Discourse wasn't the only thing that'd need updates, so did Docker, which would also break randomly.
When I'd go to the support forums of Discourse, I'd ask a question and usually get grumpy/angry engineer answers that weren't helpful at all. I guess that makes sense since it's OSS, so I can't complain there
Anyway, let's keep it POSITIVE. 😍 I realized why all this HASSLE, when I could just build a simple HN/Reddit-style forum app myself. @csallen made his own for Indiehackers, so did Product Hunt and @marckohlbrugge with WIP. So maybe I could too:
I started with a basic database structure, most importantly I have epoch (the time post is created), the topic title, the body of the post, post_id, and to enable nested replies reply_to_post_id
I then built a FAQ/forum tab on the city page and a textbox and textarea to ask a question
I made a function called buildForumPost() which would take the post_id, draw the post in HTML then find the replies to itself and foreach of those replies run itself again:

like this:

foreach($replies as $reply) {
buildForumPost($reply['post_id']);
}
I then added very rudimentary reply functionality, where I took the styling from Reddit. Just a textarea generated in jQuery
The biggest thing missing in Discourse was upvotes and downvotes (inb4 I could install some upvote plugin that would probably break on the next Discourse update). I love upvotes/downvotes on HN and Reddit, so nice to finally have that on my site too:
I then made it usable on mobile by adding some @media (max-width:600px) queries, mostly reducing the margins and font-sizes
Then I build a robot to import all the 13,000+ posts made on the Nomad List forum when it was on Discourse. Just like Discourse, its API is also super convoluted. There's no pagination in the posts.json endpoint so instead you need to hack the post_stream and request every post
While it was importing I added infinity load, it sends an AJAX to /forum with the last post_id, the script then sends the next 50 or so posts from there back and jQuery appends it
I then added user hover boxes so you can see someone's profile without visiting it
Now for a feature VERY useful to me that I was NEVER able to build it in Discourse: auto location tagging. My forum detects when you mention any of the cities or countries in Nomad List's DB and it auto tags the thread with it
This means I could now instantly generate country and city specific forum pages which only threads/topics/questions about that place, super useful if you're planning on going to a place and want to do research quickly
I also added social cards for the questions that had a city or country tag, with the image of that place from Nomad List
Very important and something that was also impossible to customize in Discourse: the Schema structure you'd like to use. Discourse seems to use DiscussionForumPosting schema, when my site is a Q&A site, so I'd like to use the QAPage schema so that it shows as answers on Google
Now with my own forum app working running on my own DB, I could integrate it into any part of Nomad List with ease. For example the search box
As well as the frontpage, where I now show the latest replies on the forum
And on the Slack chat, where it posts if there's a new topic/question or reply
Also the favorite feature I made: if you ask a question about a place, it will check the database of people who went there recently and asks them if they can answer the question
I think I covered everything; I started work on this June 5 and finished around June 14, so about 9 days of a few hours per day working on it. I was surprised how easy it was and how simple a forum app can be if you don't go overboard on features
The conclusion here I think is, when early on your little project is taking off it's best to take something off the shelf so you can quickly deploy it and have your users use it. But if it doesn't work for you anymore and you have the skills/time to build it yourself later, do it
Oh and in true Pietz-fashion it's a single PHP file called forum.php 😂

It does include my config and functions files though
This is the second last part of http://nomadlist.com  that wasn't custom. The only thing left is the Slack chat, I tried to re-build Slack myself but it's too difficult. Maybe one day.... 😀
You can follow @levelsio.
Tip: mention @twtextapp on a Twitter thread with the keyword “unroll” to get a link to it.

Latest Threads Unrolled:

By continuing to use the site, you are consenting to the use of cookies as explained in our Cookie Policy to improve your experience.