Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/technologiestiftung/erfrischungskarte-frontend
Interactive map of Berlin that shows 🕶 shade areas, 💨 wind and 🌡 temperature intensities across the day
https://github.com/technologiestiftung/erfrischungskarte-frontend
berlin odis open-data
Last synced: about 2 months ago
JSON representation
Interactive map of Berlin that shows 🕶 shade areas, 💨 wind and 🌡 temperature intensities across the day
- Host: GitHub
- URL: https://github.com/technologiestiftung/erfrischungskarte-frontend
- Owner: technologiestiftung
- License: mit
- Created: 2021-06-13T18:08:30.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-11-12T13:19:34.000Z (about 2 months ago)
- Last Synced: 2024-11-12T14:25:18.633Z (about 2 months ago)
- Topics: berlin, odis, open-data
- Language: TypeScript
- Homepage: https://erfrischungskarte.odis-berlin.de
- Size: 13 MB
- Stars: 33
- Watchers: 8
- Forks: 1
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# _Berliner Erfrischungskarte_
> The [_Berliner Erfrischungskarte_](https://erfrischungskarte.odis-berlin.de) (Berlin refreshment map) is an interactive map of Berlin that shows shadows, cold wind areas and temperature intensities across a typical summer day.
## Context
Climate change is causing increasingly hot, dry weather in many places. In recent years, Berlin has also experienced more hot days than ever before.
This map shows you where, when and how you can find refreshment on such days, because due to the differentiated topography there can be considerable differences within the city. For each hour from 10 a.m. to 9 p.m., it shows you where it tends to be cool, where a fresh breeze usually blows and where there is shade. Also discover refreshing places like swimming spots, drinking fountains and parks. With one click via the share function, you can share your new favorite place with others.
This application is completely based on open data, much of which is administrative data. Open data is now an important part of Berlin's administrative activities and not only creates transparency and openness, but also enables analysis and applications like this to make everyday life a little bit more pleasant. You can find more open data at the [Berlin Open Data Portal](https://daten.berlin.de/).
## Tech stack
This website is a NextJS app configured with:
- [Typescript](https://www.typescriptlang.org/)
- Linting with [ESLint](https://eslint.org/)
- Formatting with [Prettier](https://prettier.io/)
- Linting, typechecking and formatting on by default using [`husky`](https://github.com/typicode/husky) for commit hooks
- Testing with [Jest](https://jestjs.io/) and [`react-testing-library`](https://testing-library.com/docs/react-testing-library/intro)
## Data
This repository contains the **frontend** code of the _Berliner Erfrischungskarte_ app. The **data** and the data processing scripts are contained in another repository: [erfrischungskarte-daten](https://github.com/technologiestiftung/erfrischungskarte-daten). There you can also find further information about the original data sources.
## Install and contribute
### Requirements
#### [Mapbox](https://www.mapbox.com/)
You will need a [Mapbox](https://www.mapbox.com/) account to render the map locally. You will need to put your [Mapbox](https://www.mapbox.com/) access token into the `NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN` environment variable. Make also sure to add whatever URL the app is run on to the list of allowed URLs in your [Mapbox](https://www.mapbox.com/) configuration.
#### [Matomo](https://matomo.org/)
We use the Google Analytics alternative [Matomo](https://matomo.org/), which is more respectful of the users' privacy, in order to track the page-visits on the page.
You will need a [Matomo](https://matomo.org/) account if you wish to use page analytics as well and configure the environment variables `NEXT_PUBLIC_MATOMO_URL` and `NEXT_PUBLIC_MATOMO_SITE_ID` for this purpose.
### Installation
```bash
# Clone the repo
git clone [email protected]:technologiestiftung/erfrischungskarte-frontend.git
# Move into the repo
cd erfrischungskarte-frontend
# Install the npm dependencies
npm install
# Create your own .env file
cp .env.example .env
# Edit the .env file with your own values
vim .env # Use your favourite editor here
# To start developing use
npm run dev
```
## Deployment
_Berliner Erfrischungskarte_ is deployed to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
## Contributors
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
Dennis Ostendorf
💻 📖
Lisa-Stubert
💻 🔣
Lucas Vogel
💻 📖
lucasoeth
💻
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
## Content Licencing
Texts and content available as [CC BY](https://creativecommons.org/licenses/by/3.0/de/).
## Credits
Together with:
A project by:
Supported by:
