myclub App is the way for floorball, handball & volleyball clubs in switzerland to manage their club. Based on real data from swissunihockey, swiss volley and swiss handball association, we generate real value for the users, so they can focus an what matters most, their success!

todo :)

myclub App's architecture follows these principles:

• mobile first
• always bet on the web the latest version of the app is always available as PWA. In a second stage we also support iOS and Android Apps.

We use a GraphQL API for Sports Data. Check this repository.

• Generate your app icon and splash screens using cordova-res --skip-config --copy
• Icon generator for manifest Link
• Favicon generator Link
• Install Asset generator: npm install --global pwa-asset-generator and run commands: Light Mode: pwa-asset-generator ./resources/icon.png -i ./src/index.html -m ./src/manifest.webmanifest --splash-only --dark-mode -p 0%
• Dark Mode: pwa-asset-generator ./resources/icon_dark.png -i ./src/index.html -m ./src/manifest.webmanifest --splash-only -p 0%

• Run ionic capacitor add to add a native iOS or Android project using Capacitor

• Run ionic serve within the app dpy

• Tailwind CSS (npm install -D tailwindcss@latest postcss autoprefixer)
• Capacitor JS (V3)
• Ionicframework (V6)
• Angular PWA (ng add @angular/pwa --project _project-name_)
• Apollo Angular (ng add apollo-angular)
• Angular Localize -- de-CH German (Switzerland) -- fr-CH French (Switzerland) -- it-CH Italian (Switzerland) -- en-US English
• Angular Fire ng add @angular/fire
• Fontawesome Icons
• Ionicons

• Kadetten Unihockey Schaffhausen Link
• UHC Winterthur United Link

Go to CUSTOM_THEMES and copy default folder. Then create icons and the following files change:

• index.html
• tailwind.config.js [This is still an issue]
• webmanifest.manifest

firebase target:apply hosting app-unihockey unihockey

firebase target:apply hosting app-FIREBASE_SITE_MYAPP FIREBASE_SITE_MYAPP

firebase target:remove hosting FIREBASE_SITE_MYAPP

Run commands to generate custom icons: pwa-asset-generator ./resources/app-CUSTOM_icon.png --splash-only --dark-mode -p 0% pwa-asset-generator ./resources/app-CUSTOM_icon.png --splash-only -p 0% pwa-asset-generator ./resources/app-CUSTOM_icon.png --icon-only --dark-mode -p 0%

then, copy icons to src/custom_themes/app-CUSTOM/assets

• /icons
• /splash

Also upload login.jpg to /bg and create favicon.

App build:

Backend build: