The best Slider Carousel in React, Swappable in mobiles, zoom images and Popup slider using Swiper
This is the 14th part of our React MERN Travel Project. In this video, we added two sliders the main one in the room single page with all the details of the room. And the small popup slider on the mapbox map with short information about the room when you click on the user's avatar who added this room. We also used Reverse Geocoding to convert the room location longitude and latitude to a human readable real address with the place name. Also we made the room page opens automatically when we add new room after the successful creation of this room in our database to show the user the details of his/her new added room.
Swiper
SwiperSlide
react-swipeable-views
Reactjs
Material UI5 (MUI5)
Mapbox
Reac-Map-GL
Popup
Navigation
Autoplay
EffectCoverflow
Lazy
Zoom
Pagination
Slider Gallery with Zoom
Zoomable Slider Carousel
The whole videos playlist of the project:
• React MERN Project with Node, Expres...
Source Code on github:
https://github.com/codelikepro22/plac...
00:00 Introduction
01:38 Creating Dialog with AppBar that slides from bottom to top
08:42 Building Main Slider using Swiper
15:40 Adding room details
19:35 using reversed geocoding to change longitude and latitude to real address
23:25 Building popup Slider
37:37 Opening the room detailed page automatically after adding new room by the user
Смотрите видео The best Slider Carousel in React, Swappable in mobiles, zoom images and Popup slider using Swiper онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Code Like Pro 10 Июнь 2022, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 4,66 раз и оно понравилось 5 людям.