Built off of MongoDB, Fastify, Vue, and Node, otherwise known as MFVN stack. Sound Map for a Changing Landscape is, as the name suggests, an interactive soundscape. It utilizes LeafletJS to allow users to pan around a world map and view user uploaded markers at specifc locations that contain audio recordings.
- Always start simple, clone this repo https://github.com/cs41X-turqouise/sound-map-mfvn.git
- Open a terminal and navigate to the root folder of the repo
- Install the node packages via npm in both the client & server folders
cd .\client\ && npm install && cd ..\server\ && npm install
- This project requires MongoDB connection. Learn more here https://www.mongodb.com/docs/guides/atlas/cluster/
- This project requires an API key from https://www.geoapify.com/reverse-geocoding-api
- This project requires an access token from https://www.mapbox.com/maps
- This project requires Google OAuth token from https://console.cloud.google.com/
- Create a copy of local.env.template and name it
local.env
- Fill out the enviroment variables
- Finally you are ready to run. Open two terminals, in one cd into the server directory and in the other cd into the client directory. In both run
npm run dev
- By default vite will startup the frontend server on port 5173. Open http://localhost:5173/ in your web browser to view the page.
- Interactive Map: Pan, zoom, and navigate around a world map populated with markers.
- Map Markers: User uploaded audio recordings corresponding to specific lat/lng coordinates
- Audio Player: Listen to the sounds recorded in different locations.
- Secure Login via OAuth2 using Google account.
- Search Modal: Look for uploads corresponding to specific parameters.
- Profile Page: View and manage all your own personal uploads from a private profile page.
- Vite + Vue3 powers the front-end
- Vuetify handles the styling
- Vuex handles the global state management
- Fastify is our back-end web framework
- MongoDB is the database with Mongoose as the driver
- File uploads are handled using MongoDB's GridFS and utilizing Multer to parse the formdata
- Sessions handle persisting user data between requests
- Documentation provided by Swagger, view in browser at http://localhost:3000/docs/static/index.html#/
- Minimum Node.js v20.9.0 LTS
- Docker installed (if you want to use Docker for containerization)
If you find a bug please open a issue first and for major changes please open a discussion. Otherwise Feel free to send pull request with new features, and/or documentation improvements!
theBGuy | egold001@odu.edu | |
MeagherPatrick | pmeag001@odu.edu | |
PrestinB12 | pbell003@odu.edu | |
zeroday-zaddy | kfogl001@odu.edu | |
tr29038 | treyn008@odu.edu | |
Cwoody240 | cwood012@odu.edu | |
bjohn108-ODU | bjohn108@odu.edu |
The purpose of this project is to foster a deeper understanding and awareness of climate change through an interactive, user-driven experience. By allowing users to upload audio recordings at specific locations on a world map, we aim to create a dynamic and evolving soundscape that reflects the changing landscape of our planet.
This interactive map serves as a platform for individuals around the world to share their local experiences of climate change. Whether it's the sound of a dwindling bird species in a particular region, the noise of construction as sea levels force communities to relocate, or the changing soundscapes of urban environments as they become greener, every user contribution helps to paint a more comprehensive picture of our changing world.
By engaging with this project, users are not just passive observers of climate change, but active participants in documenting its effects. We believe that this active participation can lead to increased climate change awareness and inspire action towards environmental sustainability.
This project is licensed under the MIT License
The MIT license info can be found here: https://pitt.libguides.com/openlicensing/MIT#:~:text=Like%20the%20Apache%202.0%2C%20and,sell%20copies%20of%20the%20software.