Page updates, footer and an improved layout

Added some pictures

I added proper pictures of the team, as well as the roles and a picture of the robot on the robot page

Added a footer

I made the footer, it has a link to every page and also external sites

Fundraising section

There is now a section on the home page for fundraising, with an embedded element to the team’s gofundme

Improved layout

I changed the layout of the home page, so that the about, robot, and fundraising sections are in a column rather than a row. They change to be in rows again on small screens though. I think this makes the site look less generic

Current work

I am currently working on improving the mobile experience of the site, such as adding a menu to the navbar and improving the footer layout

Contact Us Form

I built a form on the website to send email to the team! I am using Cloudflare Functions (free & serverless) as the backend, which receives the name, email address and message from the sender via an API, validates it, and then sends it via a noreply address to the contactus address using Resend. The senders address is included in the ‘reply to’ header so the team member just needs to reply to the email.

I had to learn how to use Cloudflare Functions for this, and re-learn some web API concepts from my earlier projects.
Overall I’m very happy with the usability of the system!

I kinda forgot to devlog for a while, so this is a big one..

Link element

This was my first astro component, it is for links so I didn’t have to style each one individually. You can specify a colour theme, if it opens in a new tab, etc.

Navbar

I created a navbar with some links for different pages (not all created yet) this was my second component, since I can now easliy add it to each page. Im pretty pleased with how this turned out, since I figured out the tailwind styling myself.

Meet the Team page

I created a second page for the site, for team members. I used a grid of member cards (another component), and I like the look of it. It went through quite a few revisions until I got the look that I wanted.

First devlog! I started work on a team website for my First Tech Challenge team. I’m using the Astro web framework, Tailwind CSS and Cloudflare pages for hosting. this devlog I was learning tailwind and making some sections, and a cool header. the dev site is hosted at sitedev.botonauts.uk