We are going to create two Angular components for this step—one called MappingcontainerComponent, and another called MapViewComponent.

I broke these up because I wanted to use MappingcontainerComponent to contain the bootstrap infrastructure, while MapViewComponent will just contain the map itself. If you want to, you can combine these together, but for the purposes of establishing a clear delineation to describe what is going on with each part, it was easier for me to create two components here. This does mean that we need to introduce some coordination between the two components, which will reinforce the EventEmitter behavior we covered in Chapter 5, Angular ToDo App with GraphQL and Apollo.

Before we add any body to these components, we have some models and services that we need to write to provide the infrastructure that our map and data access will need.