Summary: FireDanger is a super simple Progressive Web App (PWA) to find out the fire rating for campsites throughout Western Australia.
Build with React, Python, GitHub Actions
Process
- Identify the core issue
The first stage of building a tool like this is to define the specific issue or problem the tool is setting out to fix. In the case of FireDanger it was setting out to make it super simple to check different campsites and find out their FDI rating.
- Wireframe and Mockups
First creative stage! We start by developing the wireframe to ensure components are reachable and the app is set out in an intuitive manner. This was confirmed by showing friends and getting them to provide feedback on how the app felt to use and if they were frustrated or had difficulty navigating. Luckily most of it was about how the app looked horrifically simple.
Once we confirmed the interface was usable we moved the start refining the interface to make it prettier and more usable.
- Develop the Application
Now that we had a design to work off we can develop a ReactJS web application to completion. This was both challenging and rewarding being my first full-stack end-to-end project. Some of the challenges involved getting access to the data through BOM which was harder, and easier, than I had expected. After scrapping their website and getting a warning I sent and email and was granted access to set up a periodic scrape every day to update the FDI data used throughout the project.
We also set up a GitHub action to automatically collect the up-to-date information ensuring users get the correct information every day.
- Test and Deploy
Rewarding is an understatement. I wrote tests to ensure the app would behave in a reasonable manner if anything were to go wrong with the scrape or any other edge cases
Finally the project deployed the project through Netlify for CI/CD every time we collect fresh information.