Skip to content

Conversation

@mattpodwysocki
Copy link
Contributor

Adds new skill showing how to use Mapbox services WITH MapLibre GL JS (hybrid architecture).

What This Skill Does

Shows MapLibre GL JS users how to leverage Mapbox's premium services while keeping their open-source renderer:

Key patterns:

  • MapLibre rendering + Mapbox vector tiles
  • MapLibre + Mapbox Search JS (no backend needed)
  • MapLibre + Mapbox APIs (Geocoding, Directions, Isochrone)

Benefits of hybrid approach:

  • ✅ Keep open-source renderer (BSD license)
  • ✅ Access premium Mapbox data/services
  • ✅ Cost optimization (free renderer + pay-per-use APIs)
  • ✅ No infrastructure management

Contents

File: skills/mapbox-maplibre-interop/

  • Architecture patterns for each integration type
  • Token management and security best practices
  • Complete integration example (restaurant finder)
  • Cost optimization strategies
  • Framework integration patterns (React, Vue, etc.)
  • AGENTS.md quick reference for AI assistants

Use Case

This skill is for MapLibre users who want to:

  • Use Mapbox's high-quality vector tiles and satellite imagery
  • Add search/geocoding without building backend infrastructure
  • Get best-in-class routing and directions
  • Leverage Mapbox APIs while maintaining open-source rendering

Complements the mapbox-maplibre-migration skill by offering an alternative to full migration.

Testing

  • ✅ Follows Agent Skills specification
  • ✅ YAML frontmatter valid
  • ✅ Code examples tested
  • ✅ AGENTS.md compressed and useful

🤖 Generated with Claude Code

Provides guidance for using Mapbox services (vector tiles, Search JS,
Geocoding, Directions, Isochrone APIs) with MapLibre GL JS renderer.

This hybrid architecture approach lets developers keep their open-source
MapLibre renderer while leveraging Mapbox's premium data and services.

Key patterns covered:
- MapLibre rendering + Mapbox vector tiles
- MapLibre + Mapbox Search JS (no backend needed)
- MapLibre + Mapbox APIs (Geocoding, Directions, Isochrone)

Benefits:
- Keep open-source renderer (BSD license)
- Access premium Mapbox data/services
- Cost optimization (free renderer + pay-per-use APIs)
- No infrastructure management

Includes:
- Architecture patterns for each integration type
- Token management and security best practices
- Complete integration example (restaurant finder)
- Cost optimization strategies
- Framework integration patterns (React, Vue, etc.)
- AGENTS.md quick reference

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
mattpodwysocki and others added 5 commits February 3, 2026 09:34
Addresses feedback that interop skill was missing the important use case
of using Mapbox Tiling Service to process, host, and serve custom vector
tilesets.

Changes:
- Added Pattern 4: MapLibre + Mapbox Tiling Service
- Shows how developers can upload custom data to MTS
- Explains MTS workflow: upload → process → host → consume
- Highlights infrastructure benefits (no tile processing, hosting, CDN)
- Added MTS to "What You Can Use" tables in both SKILL.md and AGENTS.md
- Included example use cases: real estate, store locators, delivery zones
- Added links to MTS resources (Studio, Tilesets API, CLI)

This pattern complements the existing basemap tiles pattern by showing
how to handle large custom vector tilesets using Mapbox infrastructure
with MapLibre rendering.

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
Resolves conflict in cspell.config.json by keeping both geospatial and googlemaps.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant