JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<div id="map" style="border: 3px solid #b7c73c;width: 700px; height: 500px;"></div>

JavaScript

ymaps.ready(init);
function init() {
 myMap = new ymaps.Map('map', {
        center: [59.938628, 30.306974], // Москва
        zoom: 11,
 controls: ['zoomControl', 'typeSelector', 'fullscreenControl']
 });
 counter = 0,
				// Создание метки 
            myPlacemark0 = new ymaps.Placemark([59.924194,30.350233], { // Создаем метку с такими координатами и суем в переменную
			  hintContent: "Безымянный остров",
			  balloonContentHeader: "Безымянный остров",
			  balloonContentBody: [ // Содержимое баллуна
			  'Санкт-Петербург, Россия',
			  ].join(''),
			  balloonContentFooter: '<a href="#">Подробнее<a>'
			 }, { //Конец содержимого балуна{
			  iconLayout: 'default#image', //Свое изображение метки
			  iconImageHref: 'http://icons.iconarchive.com/icons/icons-land/vista-map-markers/256/Map-Marker-Marker-Outside-Pink-icon.png', //URL файла с меткой
			  iconImageSize: [32, 31], //Размер изображения
			  iconImageOffset: [-11, -31], //Смещение ножки
			  balloonCloseButton: true, //Кнопка закрыть на баллуне есть
			  balloonPanelMaxMapArea: 'Infinity', //Баллун открывается в виде панели снизу
			  balloonPane: 'outerBalloon'
			 }), // конец метки

                /* Добавляем метки на карту */
            myMap.geoObjects
                .add(myPlacemark0);
    
                myPlacemark1 = new ymaps.Placemark([59.943491,30.288434], { // Создаем метку с такими координатами и суем в переменную
			  hintContent: "Васильевский остров",
			  balloonContentHeader: "Васильевский остров",
			  balloonContentBody: [ // Содержимое баллуна
			  'Санкт-Петербург, Россия',
			  ].join(''),
			  balloonContentFooter: '<a href="#">Подробнее<a>'
			 }, { //Конец содержимого балуна{
			  iconLayout: 'default#image', //Свое изображение метки
			  iconImageHref: 'http://icons.iconarchive.com/icons/icons-land/vista-map-markers/256/Map-Marker-Marker-Outside-Pink-icon.png', //URL файла с меткой
			  iconImageSize: [32, 31], //Размер изображения
			  iconImageOffset: [-11, -31],...