JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;mode=debug"></script>
<div id="map"></div>

CSS

html, body, #map {
            width: 100%; height: 100%; padding: 0; margin: 0;
        }

JavaScript

ymaps.ready(init);

function init () {
    var myMap = new ymaps.Map("map", {
            center: [55.76, 37.64],
            zoom: 10
        }),
    // Создаем коллекцию геообъектов и задаем опции.
        myGeoObjects = new ymaps.GeoObjectCollection({}, {
            preset: "islands#redCircleIcon",
            strokeWidth: 4,
            geodesic: true
        });
    myGeoObjects.events.add('boundschange', function(event) {
        //undefined, WTF?
        //var bounds = event.get('newBounds');
        //bounds from collection still available, use it
        var bounds = myGeoObjects.getBounds();
        myMap.setBounds(bounds);
    });
    myMap.geoObjects.add(myGeoObjects);

// Добавляем в коллекцию метки и линию.
myGeoObjects.add(new ymaps.Placemark([13.38, 52.51]));
myGeoObjects.add(new ymaps.Placemark([30.30, 50.27]));
myGeoObjects.add(new ymaps.Polyline([[13.38, 52.51], [30.30, 50.27]]));
}