FireDanger

**Summary:** Inspired by a very, very minor inconvenience on a distant camping trip, I built FireDanger. I lightweight web-app which uses pre-rendering so users can check the Fire Danger Index (FDI) and therefore check if they’ll be able to have a campfire. **The Problem** Being into camping I was often outside of phone signal or had very little of it at a campsite. And often when we got to the campsite we would want to set up a campfire as a reward for driving all the way out. Usually this would be okay however, around the shoulder of bushfire season we wanted to be careful not to start and campfires if there was a fireban or the risk was deemed too high. One trip, after arriving at the campsite we realised we missed the fire danger sign and couldn't find it (if you;re reading this their often at the entrance to the campground) **The Solution** Seeing as I had recently completed the Fullstack Open course kindly offered by the University of Helsinki I decided to built a mobile-first progressive web app built on internet-native technologies. I chose Netlify for hosting as they offered free CI/CD with plenty of build minutes and it could be easily linked to the GitHub repository for seamless updates The solution can be found at: firedanger.oscardb.xyz Because everything is hosted and deployed via CI/CD through netlify and the firedanger data is updated every morning at 6am AWST the data is mostly correct, and unless one of the platform goes belly up the service should be available for a long time to come. ### The Process **Define the problem** For some reason the Department of Fire and Emergency Services(?) (DFES) makes is obtuse to find any information relating to campfires and bush cooking. FireDanger will be a solution by making it super simple to be able to look up the campsite you're staying at and checking whether or not the FDI is suitable to build a campfire. **Brainstorm solutions** Build a mobile app - this was a silly idea since I can't make apps Build a progressive web app built for phones - this was a great idea since I had recently completed the FSO course and felt confident with ReactJS, Python and FTP which were the main technical skills I would be using to develop the project Wireframe and Prototype I whipped up some very, very rough mockups in a notebook I had on my desk and quickly transferred it across to Figma. The main reason was to get the rough font size and layout defined. I was planning on coming back to this to really pretty up the page once the logic was working **Develop** Development was the fun part. The hardest problem to solve was getting a search function implemented to limit how many campsites you have to look through to find your ideal site. 1. Build the ReactJS structure 2. Build a python script to scrape the BoM file (through FTP) and extract the relevant info, and transcribe the data into JSON format 3. Build GitHub Action to automate the python script every morning at 6AM 4. Point the page to look at the data in the public github repo to ensure it's pulling up-to-date info 5. Set up all the pages to get built on the server before being sent to the user. Thereby reducing bandwidth and improving performance especially in remote locations where you may not have much phone signal at all **Deploy** Deployment was such a smooth process, since it was only a switch to flip in Netlify from building and deploying the "preview" build to deploying the public build.