This is a full-stack app experience inspired by iNaturalist. Users can upload observations of their encounters with other organisms and identify them or have them identified by the community (currently the app supports taxonomy down to the Family level). Viewing an observation allows one to see where it was found (and nearby observations of the same taxon), any details, as well as the identification activity on the observation. When multiple people have identified the observation a consensus is calculated and the status of each identification is reflected in the activity feed as the observation is upgraded to "verified" status (or not). This consensus is re-calculated whenever the state of the identifications associated with the observation changes.
https://kainaturalist.herokuapp.com/
- Create an account, sign in, or log in as a demo user
- Create, view, edit, and delete Observations with custom-built form components including an image uploader, a taxonomy typeahead input, and a clickable-draggable map location selector.
- Find other observation of the same taxon on the observation map view to see where things live!
- Create, view, edit, and delete Identifications with comments and a taxonomy typeahead with automated consensus calculation on Observations.
- Homempage grid view with My Observations, Observations waiting to be identified by the community, and recently verified observations.
- Explore map view allowing users to explore the map and see what lives near them!
- My observations map
- Taxon pages with map and grid views
- Continue to expand available taxonomic ranks
- React
- Redux
- Python
- PostgreSQL
- Flask
- Flask SQLAlchemy
- WTForms (for backend validations)
- Leaflet / React Leaflet (for map components)
- AWS S3 (for image uploads)
- dayjs (for manipulating dates)
- FontAwesome
- Leaflet Geosearch
- geopy
- react-date-picker
I worked really hard to make this look pretty, I hope you enjoy it as much as I do. It's hard to resist space cat isn't it?
I had some fun with the page while keeping iNaturalist's form / style.
The main grid is separated into three sections for the user's uploads, uploads from the community that need attention, and verified observation.
The taxonomy picker, draggable/searchable map component (based on Leaflet), and image uploader are all custom-built for this project!
I'm really proud of this CSS loading spinner that I built so it has to go here. It uses a random nature-themed FontAwesome icon each time.
The orange circles on the map are other places banana slugs have been observed. You can click them to bring up a link to those other observations.
The icons represent the level to which the particular ID agrees with the community.
The map markers adjust based on what was observed.
The right sidebar adjusts to show what's currently on the map!