This app checks the location of Washington State Ferries using the same API that powers VesselWatch and presents it in a mobile-friendly format. I made it because ferries are the best, but I have a hard time reading the existing realtime map while using my phone in line at the dock.
Check it out for yourself at https://ferries.ryantravitz.com
Clone the app, make sure to have the most recent LTS version of Node available, and npm install.
Two other things to know:
- The app tries to fetch ferries from
localhost:5273/ferrieswhenNODE_ENV=development. This is specified in.env.development. The responses are mocked locally with a service worker provided bymsw. It should mean that there is usable data for development out of the box after initial clone and install. The relevant configuration is mostly insrc/mocks. - In production the client sends requests to a lambda instead of hitting the API directly (yay CORS). The code for that lambda lives in
src/api/vessels.js.
The tests all live under src/__tests__. They primarily use react-testing-library with some support from msw for mocking network requests. Vitest handles all of the hard work of setting up the test environment just right with jsdom, et al. You can run everything with npm test.
Each new PR will generate a staging link to review. Once a PR is merged, the changes are built and deployed to production automatically. CI and hosting are both on Netlify.