spotlightcam/docs/archive/RESOURCES.md

# Resources - spotlight.cam

**Learning resources, documentation links, and useful references**

---

## 📚 Official Documentation

### Backend (Node.js + Express)
- **Express.js** - https://expressjs.com/
  - Best practices: https://expressjs.com/en/advanced/best-practice-performance.html
  - Security: https://expressjs.com/en/advanced/best-practice-security.html
- **Node.js** - https://nodejs.org/docs/
- **Socket.IO** - https://socket.io/docs/v4/
  - Rooms: https://socket.io/docs/v4/rooms/
  - Emit cheatsheet: https://socket.io/docs/v4/emit-cheatsheet/

### Database
- **PostgreSQL** - https://www.postgresql.org/docs/
  - Best practices: https://wiki.postgresql.org/wiki/Don't_Do_This
  - Performance tips: https://wiki.postgresql.org/wiki/Performance_Optimization
- **Prisma** - https://www.prisma.io/docs
  - Schema reference: https://www.prisma.io/docs/concepts/components/prisma-schema
  - Migrations: https://www.prisma.io/docs/concepts/components/prisma-migrate
- **Knex.js** - https://knexjs.org/
  - Migrations: https://knexjs.org/guide/migrations.html

### Frontend
- **React** - https://react.dev/
  - Hooks: https://react.dev/reference/react
  - Context: https://react.dev/reference/react/useContext
- **Vite** - https://vitejs.dev/
  - Config: https://vitejs.dev/config/
  - Env variables: https://vitejs.dev/guide/env-and-mode.html
- **Tailwind CSS** - https://tailwindcss.com/docs
  - Configuration: https://tailwindcss.com/docs/configuration
  - Customization: https://tailwindcss.com/docs/theme
- **React Router** - https://reactrouter.com/en/main
  - Protected routes: https://reactrouter.com/en/main/start/tutorial#adding-a-loader

### Docker
- **Docker Compose** - https://docs.docker.com/compose/
  - Compose file reference: https://docs.docker.com/compose/compose-file/
  - Networking: https://docs.docker.com/compose/networking/
- **nginx** - https://nginx.org/en/docs/
  - Reverse proxy: https://docs.nginx.com/nginx/admin-guide/web-server/reverse-proxy/
  - WebSocket: https://nginx.org/en/docs/http/websocket.html

---

## 🎥 WebRTC Resources

### Getting Started
- **WebRTC.org** - https://webrtc.org/
  - Getting started: https://webrtc.org/getting-started/overview
  - Use cases: https://webrtc.org/getting-started/use-cases
- **MDN WebRTC API** - https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API
  - RTCPeerConnection: https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection
  - RTCDataChannel: https://developer.mozilla.org/en-US/docs/Web/API/RTCDataChannel
  - Simple peer-to-peer data: https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Simple_RTCDataChannel_sample

### Tutorials
- **WebRTC samples** - https://webrtc.github.io/samples/
  - File transfer sample: https://webrtc.github.io/samples/src/content/datachannel/filetransfer/
  - Basic RTCDataChannel: https://webrtc.github.io/samples/src/content/datachannel/basic/
- **HTML5 Rocks - WebRTC** - https://www.html5rocks.com/en/tutorials/webrtc/basics/

### Advanced Topics
- **STUN/TURN Servers**
  - Understanding STUN/TURN: https://bloggeek.me/webrtcglossary/stun/
  - Free STUN servers: https://gist.github.com/mondain/b0ec1cf5f60ae726202e
  - Coturn (self-hosted TURN): https://github.com/coturn/coturn
- **NAT Traversal**
  - ICE explained: https://bloggeek.me/webrtcglossary/ice/
  - Trickle ICE: https://webrtc.org/getting-started/trickle-ice
- **WebRTC for the Curious** (free book) - https://webrtcforthecurious.com/

---

## 🔐 Security Resources

### Authentication
- **JWT** - https://jwt.io/
  - Introduction: https://jwt.io/introduction
  - Debugger: https://jwt.io/#debugger-io
  - Best practices: https://curity.io/resources/learn/jwt-best-practices/
- **bcrypt** - https://github.com/kelektiv/node.bcrypt.js
  - How bcrypt works: https://auth0.com/blog/hashing-in-action-understanding-bcrypt/

### General Security
- **OWASP Top 10** - https://owasp.org/www-project-top-ten/
- **Helmet.js** - https://helmetjs.github.io/
- **express-rate-limit** - https://github.com/express-rate-limit/express-rate-limit
- **express-validator** - https://express-validator.github.io/docs/
- **CORS** - https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

### WebRTC Security
- **WebRTC Security** - https://webrtc-security.github.io/
- **DTLS/SRTP** - https://webrtc.org/getting-started/security

---

## 🧪 Testing Resources

### Backend Testing
- **Jest** - https://jestjs.io/
  - Getting started: https://jestjs.io/docs/getting-started
  - API testing: https://jestjs.io/docs/testing-asynchronous-code
- **Supertest** - https://github.com/ladjs/supertest
  - Express testing guide: https://github.com/ladjs/supertest#example

### Frontend Testing
- **Vitest** - https://vitest.dev/
  - Getting started: https://vitest.dev/guide/
- **React Testing Library** - https://testing-library.com/react
  - Cheatsheet: https://testing-library.com/docs/react-testing-library/cheatsheet/
- **Playwright** - https://playwright.dev/
  - Getting started: https://playwright.dev/docs/intro
- **Cypress** - https://www.cypress.io/
  - Getting started: https://docs.cypress.io/guides/getting-started/installing-cypress

---

## 📱 PWA Resources

### Service Workers
- **MDN Service Worker API** - https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API
- **Workbox** - https://developers.google.com/web/tools/workbox
  - Getting started: https://developers.google.com/web/tools/workbox/guides/get-started

### PWA Features
- **Vite PWA Plugin** - https://vite-pwa-org.netlify.app/
  - Guide: https://vite-pwa-org.netlify.app/guide/
- **Web App Manifest** - https://developer.mozilla.org/en-US/docs/Web/Manifest
- **Web Push Notifications** - https://developer.mozilla.org/en-US/docs/Web/API/Push_API

---

## 🚀 Deployment Resources

### Cloud Platforms
- **Vercel** - https://vercel.com/docs
  - React deployment: https://vercel.com/docs/frameworks/vite
- **Netlify** - https://docs.netlify.com/
- **Render** - https://render.com/docs
- **DigitalOcean** - https://docs.digitalocean.com/
  - App Platform: https://docs.digitalocean.com/products/app-platform/
  - Droplets: https://docs.digitalocean.com/products/droplets/
- **AWS** - https://aws.amazon.com/getting-started/
  - EC2: https://docs.aws.amazon.com/ec2/
  - RDS: https://docs.aws.amazon.com/rds/

### SSL/TLS
- **Let's Encrypt** - https://letsencrypt.org/
  - Certbot: https://certbot.eff.org/
  - Documentation: https://letsencrypt.org/docs/

### Docker Production
- **Docker Production Best Practices** - https://docs.docker.com/develop/dev-best-practices/
- **Multi-stage builds** - https://docs.docker.com/build/building/multi-stage/

---

## 🎓 Video Tutorials

### WebRTC
- **WebRTC Crash Course** - https://www.youtube.com/watch?v=WmR9IMUD_CY (Traversy Media)
- **WebRTC File Transfer** - https://www.youtube.com/watch?v=WmR9IMUD_CY
- **Build a Video Chat App** - https://www.youtube.com/watch?v=DvlyzDZDEq4 (Fireship)

### MERN Stack (Similar to our stack)
- **MERN Stack Tutorial** - https://www.youtube.com/watch?v=7CqJlxBYj-M (freeCodeCamp)
- **Socket.IO Tutorial** - https://www.youtube.com/watch?v=ZKEqqIO7n-k (Web Dev Simplified)

### React
- **React Course for Beginners** - https://www.youtube.com/watch?v=bMknfKXIFA8 (freeCodeCamp)
- **React Hooks** - https://www.youtube.com/watch?v=O6P86uwfdR0 (Codevolution)

---

## 📦 Useful npm Packages

### Backend
- **express** - Web framework
- **socket.io** - WebSocket library
- **@prisma/client** / **knex** - Database ORM/query builder
- **bcryptjs** - Password hashing
- **jsonwebtoken** - JWT authentication
- **dotenv** - Environment variables
- **helmet** - Security headers
- **express-rate-limit** - Rate limiting
- **express-validator** - Input validation
- **cors** - CORS middleware
- **winston** / **pino** - Logging
- **nodemon** - Dev server auto-restart

### Frontend
- **react** - UI library
- **react-dom** - React DOM renderer
- **react-router-dom** - Routing
- **socket.io-client** - Socket.IO client
- **lucide-react** - Icons (already using)
- **react-hook-form** - Form handling
- **zod** - Schema validation
- **axios** - HTTP client

### Testing
- **jest** - Testing framework
- **supertest** - HTTP testing
- **vitest** - Vite-native testing
- **@testing-library/react** - React component testing
- **@testing-library/user-event** - User interaction simulation
- **playwright** / **cypress** - E2E testing

---

## 🛠️ Development Tools

### API Development
- **Postman** - https://www.postman.com/
- **Insomnia** - https://insomnia.rest/
- **Thunder Client** (VS Code extension) - https://www.thunderclient.com/

### Database Tools
- **pgAdmin** - https://www.pgadmin.org/
- **DBeaver** - https://dbeaver.io/
- **Prisma Studio** - Built-in with Prisma

### WebRTC Testing
- **Trickle ICE** - https://webrtc.github.io/samples/src/content/peerconnection/trickle-ice/
- **WebRTC Troubleshooter** - https://test.webrtc.org/

### Performance
- **Lighthouse** - Chrome DevTools
- **WebPageTest** - https://www.webpagetest.org/

---

## 📖 Articles & Guides

### WebRTC
- **WebRTC File Transfer with Progress** - https://bloggeek.me/webrtc-file-transfer/
- **Understanding WebRTC Data Channels** - https://bloggeek.me/webrtc-data-channel/
- **WebRTC for Real-World Applications** - https://webrtchacks.com/

### Socket.IO
- **Socket.IO Best Practices** - https://socket.io/docs/v4/performance-tuning/
- **Scaling Socket.IO** - https://socket.io/docs/v4/using-multiple-nodes/

### Authentication
- **JWT Authentication Best Practices** - https://blog.logrocket.com/jwt-authentication-best-practices/
- **Session vs Token Authentication** - https://security.stackexchange.com/questions/81756/session-authentication-vs-token-authentication

### Docker
- **Docker for Node.js Developers** - https://nodejs.org/en/docs/guides/nodejs-docker-webapp/
- **Docker Compose for Development** - https://docs.docker.com/compose/gettingstarted/

---

## 🌐 Community

### Forums
- **Stack Overflow** - https://stackoverflow.com/
  - Tag: [webrtc] - https://stackoverflow.com/questions/tagged/webrtc
  - Tag: [react] - https://stackoverflow.com/questions/tagged/react
  - Tag: [node.js] - https://stackoverflow.com/questions/tagged/node.js

### Discord/Slack
- **Reactiflux** (React community) - https://www.reactiflux.com/
- **Node.js Discord** - https://discord.com/invite/nodejs

### Reddit
- **/r/webdev** - https://www.reddit.com/r/webdev/
- **/r/reactjs** - https://www.reddit.com/r/reactjs/
- **/r/node** - https://www.reddit.com/r/node/

---

## 📚 Recommended Reading

### Books
- **Node.js Design Patterns** - Mario Casciaro
- **Learning WebRTC** - Dan Ristic
- **React Up & Running** - Stoyan Stefanov

### Blogs
- **webrtcHacks** - https://webrtchacks.com/
- **BlogGeek.me** - https://bloggeek.me/ (WebRTC expert)
- **Kent C. Dodds** - https://kentcdodds.com/blog (React expert)

---

**Last Updated:** 2025-11-12
**Note:** Links verified as of last update. Some may change over time.