Rebuilding unspunne.ch

Hello and welcome. This is my second blog post, I will talk about the process of rebuilding the website unspunne.ch. The website is not built yet but i will talk about what i planned, what technologies i will use and what i want to achieve with it.

About unspunne.ch

The Pfadi unspunne Interlaken is a mixed scout group in Switzerland Interlaken and I am one of their members. I have been a member for a few years now, I entered in 2018 and have been in a lot of camps and activities with them.

The website unspunne.ch is their official website. It is mostly a static/informative website with some information about the group, the house which you can rent and or our Ship which is rentable as well. The website is also used to inform about upcoming events and activities. It contains some dynamic content like a calendar of the next events and a blog section where the leaders can post some information about the last activities or camp.

The website is not very modern though, its built in wix and is not very flexible. Also the content is not very well maintained, the last blog post is from 2022 and there are some dead links or half finished features. Also the person who is responsible for the website is retiring this Winter which requires a new responsible person anyways, so me and a friend of mine who will start the PIBS (Praxis Integrated Bachelor Education) this year thought of rebuilding the whole site with some Professional tools.

The Plan

The plan is first to rebuild the website with some modern and professional tooling. The goal is to have the same website with the same content and features like the old one but with a more modern and flexible design. The new website should be easier to maintain and update though requiring some more professional knowledge to maintain.

After the website is in the same state as the old one, we will add some new features and content. There are a lot of ideas for new features and content. For example some sort of Photo gallery where the members could find photos from the last camp or events. But there is nothing really planned there.

Also we want to make a new Registration system for the members. The current way members register for upcoming activities is via email. So one of the leaders sends out an email to all the members and they just reply to the email if they want to join. The leader then has to check his inbox and count all emails manually which is really painful and not reliable. So we want to build a new system to handle this. My idea was to still handle everything via email so the members don't have to create an account and remember their login. The system should send an email with a little text still written from the leader organizing the activity and a signed url which when clicked automatically registers the member for the activity. The Website should then contain some sort of admin dashboard where the leaders can create activities and send the invitation emails and also see who has registered for the activity. But i still don't know if this should be integrated into the main website or completely separated from it. I will have to think about this more and discuss it with the other leaders.

The Technologies

The new website will be built with a Static Site Generator I thought about using Astro. The benefits of using a SSG are easier development because it offers you a lot of features a normal framework React would offer you without the performance cost. A Static site generator takes your components and pages and builds them into static HTML with no javascript required. This is a big performance boost compared to something like React which ships a ton of javascript to the client. Astro provides a lot of useful features for dynamic content as well, you can even use React components in Astro for highly dynamic content. I will have to see if this is required for the website though.

The rest is quite straight forward i will host everything on some cheap VPS like Hetzner or something. Serve it using caddy, just build everything together and deploy it using GitHub Actions.

For the more advanced features like the registration system I will need a Backend. I will use NestJs for this because i have a lot of experience with it from work and it is easy to use and has a lot of features. I will also need some database for it to store activities and users, for that i will just go with maria dB nothing fancy.

The last thing i am thinking about is using some CMS. There is a blog feature and stuff and i am thinking about using a CMS or to just build it myself. I have to build some admin dashboard anyways so i am thinking about just building a little markdown editor into the admin panels that then calls the api which serializes it into HTML and saves it into the database or something like that. I will have to see if this is worth the effort or if it is easier to just use a CMS like Strapi.

Conclusion

I am excited to start this project and rebuild the website. I will document the full process in this blog and share my thoughts. It will take some more time though because I have to discuss everything with the leadership and get their opinions and approval. I will also have to team up with my friend who will help, maybe he has some good ideas as well.

Anyways thanks for reading so far, for any feedback or suggestions feel free to send me an email, the address is on the bottom of my homepage.

I will see you in the next post Bye👋