How alicialeeyuelin/mern-stack-project works
This is a shark-information and conservation web app with a React frontend and Express/MongoDB API. Users register or log in, then explore shark records and a map of locations and sighting frequencies; authenticated researchers can submit research applications, while admin-oriented screens support content and request management. The backend exposes separate user, shark, location, sighting, research, info, and admin routes. Sampled source confirms the home, shark, and research request calls; other route capabilities are represented from the tree and their mount points, without assuming unsampled route-to-model wiring.
Main entry points: index.js Express API · App.jsx App routing · home.jsx Home and map · shark.js Shark routes
Components 24
Web client
- App routing
frontend/src/App.jsx - Home and map
frontend/src/pages/home.jsx - Shark catalog
frontend/src/pages/shark.jsx - Login and register
frontend/src/pages/login.jsx - Research application
frontend/src/component/researcherForm.jsx - Admin screens
frontend/src/component/approve.jsx
API and access
- Express API
backend/index.js - JWT authentication
backend/middleware/auth.js
Marine information
- Shark routes
backend/routes/shark.js - Location routes
backend/routes/location.js - Sighting routes
backend/routes/sighting.js - Information routes
backend/routes/info.js - Shark records
backend/models/Shark.js - Location records
backend/models/Location.js - Sighting records
backend/models/Sighting.js - Information records
backend/models/Info.js
Accounts and research
- User routes
backend/routes/user.js - Research requests
backend/routes/research.js - Admin routes
backend/routes/admin.js - Research records
backend/models/Research.js - User records
backend/models/User.js
Other components
- Visitor / user
- MongoDB
- OpenStreetMap tiles
Connections 26
- Visitor / user → App routing: uses
- App routing → Login and register: routes
- App routing → Home and map: routes
- App routing → Shark catalog: routes
- App routing → Admin screens: routes
- Home and map → User routes: fetches user
- Home and map → Location routes: fetches locations
- Home and map → Sighting routes: fetches frequency
- Home and map → OpenStreetMap tiles: loads tiles
- Shark catalog → User routes: fetches user
- Shark catalog → Shark routes: fetches sharks
- Research application → User routes: fetches user
- Research application → Research requests: submits request
- Express API → User routes: mounts
- Express API → Shark routes: mounts
- Express API → Location routes: mounts
- Express API → Sighting routes: mounts
- Express API → Information routes: mounts
- Express API → Research requests: mounts
- Express API → Admin routes: mounts
- Express API → MongoDB: connects
- Research requests → JWT authentication: authenticates
- Shark routes → JWT authentication: authenticates
- JWT authentication → User records: looks up user
- Research requests → Research records: saves application
- Shark routes → Shark records: queries and saves