Skip to content

Commit

Permalink
Blogpost: new app (#752)
Browse files Browse the repository at this point in the history
  • Loading branch information
naltatis authored Mar 1, 2025
1 parent f2dc790 commit 45c9384
Show file tree
Hide file tree
Showing 4 changed files with 158 additions and 0 deletions.
Binary file added blog/2025-03-01/evcc-app-banner.webp
Binary file not shown.
79 changes: 79 additions & 0 deletions blog/2025-03-01/evcc-app-for-ios-android.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
---
title: "evcc App für iOS & Android"
authors: [naltatis]
tags: [release]
hide_table_of_contents: false
---

Geschafft!
Die erste Version der evcc App für iOS und Android ist fertig.
Sie kann jetzt im [Apple App Store](https://apps.apple.com/de/app/evcc-io/id6478510176) und [Google Play Store](https://play.google.com/store/apps/details?id=io.evcc.android) heruntergeladen werden.

[![evcc App für iOS und Android](evcc-app-banner.webp)](/blog/2025/03/01/evcc-app-for-ios-android)

{/* truncate */}

## Was macht die App?

Die evcc App ist ein nativer Wrapper für die evcc Benutzeroberfläche, der dir ein optimiertes Nutzungserlebnis auf deinem Smartphone oder Tablet bietet.
Sie bringt einige praktische Funktionen mit, die die Bedienung deiner evcc-Installation deutlich komfortabler machen:

### Einfaches Onboarding
- **Automatische Erkennung**: Die App findet evcc-Instanzen in deinem lokalen Netzwerk automatisch über mDNS.
- **Manuelle Einrichtung**: Du kannst deine evcc-Instanz auch manuell über die URL hinzufügen.
- **Demo-Modus**: Neugierig? Probiere die App einfach mit der Demo-Instanz aus.

### Optimierte Benutzeroberfläche
- **Vollbild-Ansicht**: Nutze die evcc UI im Vollbildmodus ohne störende Browser-Elemente.
- **Angepasstes Design**: Die Benutzeroberfläche respektiert die Besonderheiten deines Geräts (Notch, abgerundete Ecken, etc.).
- **Verbesserte Gestensteuerung**: Wische und navigiere intuitiv durch die App, ohne dass Browser-Zoom oder Überscroll-Effekte stören.

### Zuverlässige Verbindung
- **Online/Offline-Erkennung**: Die App zeigt einen Ladebildschirm, wenn deine evcc-Instanz nicht erreichbar ist.
- **Automatische Wiederverbindung**: Sobald deine Instanz wieder verfügbar ist, stellt die App die Verbindung automatisch wieder her.
- **Keine Fehlbedienungen**: Vermeidet irreführende Situationen, in denen die Benutzeroberfläche angezeigt wird, aber bspw. mangels Netzwerk nicht funktionsfähig ist.

### Flexibilität
- **Server wechseln**: Du kannst die konfigurierte URL jederzeit ändern - entweder im Offline-Modus oder über den Menüpunkt "Server wechseln".
- **Helles und dunkles Design**: Die native Benutzeroberfläche passt sich automatisch den Systemeinstellungen deines Geräts an.

Die App ist ein weiterer Schritt, um die Bedienung von evcc noch einfacher und intuitiver zu gestalten.
Du behältst deine Ladestation, PV-Anlage und den Energiefluss in deinem Zuhause jetzt noch besser im Blick - direkt von deinem Smartphone aus.

P.S.: Hast du einen Mac mit Apple Silicon? Dann kannst du die iOS App auch direkt dort verwenden.

## Die Technik dahinter

Bei der Entwicklung der App haben wir auf bewährte Technologien gesetzt.
Im Kern ist die App ein nativer Wrapper um unsere bestehende Web-Ansicht.
Wir haben uns für React Native in Kombination mit Expo entschieden, was uns ermöglicht, die App für iOS und Android mit einer gemeinsamen Codebasis zu entwickeln.
Dies reduziert den Entwicklungsaufwand erheblich und stellt sicher, dass neue Funktionen schnell auf beiden Plattformen verfügbar sind.

Die nativen Komponenten sind in TypeScript geschrieben und auf ein Minimum beschränkt.
Für das Design-System nutzen wir UI Kitten / Eva, was uns hilft, eine konsistente und ansprechende Benutzeroberfläche zu gestalten.

Wie alle unsere Projekte ist auch die App Open Source.
Der Quellcode ist auf [GitHub](https://github.com/evcc-io/app) verfügbar.
Fehlermeldungen, Verbesserungsvorschläge und Pull Requests sind willkommen!

## Wo geht die Reise hin?

Die erste Version der App ist ein wichtiger Meilenstein, aber wir haben noch einige spannende Ideen für die Zukunft:

### Fernzugriff vereinfachen
Aktuell funktioniert die App nur im gleichen Netzwerk wie deine evcc-Installation.
Für den Fernzugriff musst du selbst eine sichere Verbindung herstellen.
Mit VPN-Lösungen wie Wireguard (in Kombination mit einer FritzBox) oder Tailscale (mit On-Demand-Verbindungen und Magic DNS) ist das heute schon möglich, erfordert aber zusätzliche Konfiguration.
Wir haben noch keine konkreten Pläne für eine direkte Integration in die App, aber es ist definitiv ein Thema, um das wir uns in mittlerer Zukunft kümmern wollen.

### Plattformspezifische Funktionen
Die native App bildet die Grundlage für weitere plattformspezifische Funktionen, die mit einer reinen Web-Anwendung nicht möglich wären.
Dazu gehören Push-Benachrichtigungen, um dich über wichtige Ereignisse zu informieren, und Widgets für den Homescreen, die dir einen schnellen Überblick über den aktuellen Status deiner Ladestation und PV-Anlage geben.

💚 Ein großer Dank an alle, die dieses Projekt finanziell oder durch aktive Mitwirkung unterstützen.

🌟 Achja, gebt gerne eine Bewertung im [App Store](https://apps.apple.com/de/app/evcc-io/id6478510176) oder [Play Store](https://play.google.com/store/apps/details?id=io.evcc.android) ab, wenn euch die App gefällt!

**Viele Grüße**<br/>
Das evcc Team<br/>
Michael, Andi & Uli
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
---
title: "evcc App for iOS & Android"
authors: [naltatis]
tags: [release]
hide_table_of_contents: false
---

We did it!
The first version of the evcc app for iOS and Android is ready.
It can now be downloaded from the [Apple App Store](https://apps.apple.com/de/app/evcc-io/id6478510176) and [Google Play Store](https://play.google.com/store/apps/details?id=io.evcc.android).

[![evcc App for iOS and Android](evcc-app-banner.webp)](/blog/2025/03/01/evcc-app-for-ios-android)

{/* truncate */}

## What does the app do?

The evcc app is a native wrapper for the evcc user interface, providing you with an optimized user experience on your smartphone or tablet.
It comes with several practical features that make using your evcc installation much more comfortable:

### Easy Onboarding
- **Automatic Detection**: The app automatically finds evcc instances in your local network via mDNS.
- **Manual Setup**: You can also add your evcc instance manually via URL.
- **Demo Mode**: Curious? Just try out the app with our demo instance.

### Optimized User Interface
- **Full-Screen View**: Use the evcc UI in full-screen mode without distracting browser elements.
- **Adapted Design**: The user interface respects the peculiarities of your device (notch, rounded corners, etc.).
- **Improved Gesture Control**: Swipe and navigate intuitively through the app without browser zoom or overscroll effects getting in the way.

### Reliable Connection
- **Online/Offline Detection**: The app shows a loading screen when your evcc instance is not reachable.
- **Automatic Reconnection**: As soon as your instance is available again, the app automatically reconnects.
- **No Misoperations**: Avoids misleading situations where the user interface is displayed but not functional, e.g., due to network issues.

### Flexibility
- **Change Server**: You can change the configured URL at any time - either in offline mode or via the "Change server" menu item.
- **Light and Dark Design**: The native user interface automatically adapts to your device's system settings.

The app is another step towards making evcc even easier and more intuitive to use.
You can now keep an even better eye on your charging station, PV system, and energy flow in your home - directly from your smartphone.

P.S.: Do you have a Mac with Apple Silicon? Then you can use the iOS app directly there as well.

## The Technology Behind It

We relied on proven technologies when developing the app.
At its core, the app is a native wrapper around our existing web view.
We chose React Native in combination with Expo, which allows us to develop the app for iOS and Android with a shared codebase.
This significantly reduces development effort and ensures that new features are quickly available on both platforms.

The native components are written in TypeScript and kept to a minimum.
For the design system, we use UI Kitten / Eva, which helps us create a consistent and appealing user interface.

Like all our projects, the app is also open source.
The source code is available on [GitHub](https://github.com/evcc-io/app).
Bug reports, suggestions for improvements, and pull requests are welcome!

## Where are we headed?

The first version of the app is an important milestone, but we still have some exciting ideas for the future:

### Simplifying Remote Access
Currently, the app only works on the same network as your evcc installation.
For remote access, you need to establish a secure connection yourself.
This is already possible today with VPN solutions like Wireguard (in combination with a FritzBox) or Tailscale (with on-demand connections and Magic DNS), but it requires additional configuration.
We don't have concrete plans for direct integration into the app yet, but it's definitely a topic we want to address in the medium term.

### Platform-Specific Features
The native app forms the foundation for additional platform-specific features that wouldn't be possible with a pure web application.
These include push notifications to inform you about important events, and widgets for the home screen that give you a quick overview of the current status of your charging station and PV system.

💚 A big thank you to everyone who supports this project financially or through active participation.

🌟 One last thing: Please leave a rating in the [App Store](https://apps.apple.com/de/app/evcc-io/id6478510176) or [Play Store](https://play.google.com/store/apps/details?id=io.evcc.android) if you like the app!

**Best regards**<br/>
The evcc Team<br/>
Michael, Andi & Uli

0 comments on commit 45c9384

Please sign in to comment.