There is a lot to experience and discover in Berlin. Every week new restaurants open, exciting events or art exhibitions take place or there are exciting activities to try out.

Until now, I tried to manage all this information in various notes on my mobile phone. Unfortunately, with so much new information, I couldn’t keep up. When I was then faced with the question of where I wanted to go out for dinner in the evening, I could no longer see the forest for the trees. So another way of managing had to be found.

Since I’m working on the Alliance Management software in parallel and have familiarised myself deeply with React and Leaflet, it made sense to present all the information in a map. Here you will find my personal highlights.

There are the following categories:

  • Ice
  • Activities: Everything that regularly takes place or can be visited
  • Food: Divided into different categories such as: Asian, Italian, top restaurants and many more.
  • Shops
  • Bathing Lakes
  • Places: Special places that can often be visited free of charge
  • Events: Events or art exhibitions that are limited in time.
  • Camping: Campsites or fixed overnight accommodation at weekends.
  • Star: My personal highlights

Since I am a bit pedantic when it comes to the design and operation of websites 😏 and am often annoyed by immature and ill-conceived user interfaces, I naturally wanted to do better.

The following functionalities and design elements have therefore been integrated (as of end Sept. 2022):

  • Design of the map reduced to the essentials. Buttons in new morphism
  • Automatic zoom on all elements in the map after selection of criteria.
  • After clicking on an element, the map zooms in on the element.
  • The own location can be displayed. Then the map is zoomed to this location. Useful when you are on the move.
  • Recognition of whether touch device or not. The elements on the PC (with mouse) are displayed in such a way that only the title is shown when hovering over the element. A click then leads to more details via zoom.
  • On mobile touch devices, a touch does not zoom in, but the entire content is displayed directly.
  • MongoDB Atlas database that can be easily filled from anywhere

The map is not finished yet and there are still some updates/bugfixes planned:

  • The new morphism is not accessible to all groups of people as I implemented it. The contrast of the buttons needs to be strengthened to make it easier to see whether a button has been pressed or not.
  • The search bar finds the results, but clicking on the result leads to nothing. After clicking on a result, only that result should be displayed.
  • Your own location is displayed several times if the button is pressed several times.
  • Some elements still contain further background details. These still need to be displayed.
  • Code cleanup: Frequently repeating code snippets. Still needs to be improved and shortened.
  • Release on github: The repos for the client and the server are already on github, but still private. As soon as everything works and the code is halfway clean, I will publish at least the client side.
  • The map data is stored in MongoDB, which can also handle geospatial data. The data is already stored in the right form for future applications, which I still have to come up with…
1
2
3
4

location: {
type: "Point",
coordinates: [-73.856077, 40.848447]
}

Eventually I will add category Bicycle Tours, as MongoDB can also handle MultiLineStrings, which I can use to represent tours.

The map can of course be used from now on and I will regularly expand it with new elements. Have fun discovering new places and activities in and around Berlin 😃