FredsRoadtripStoryteller
Hear local historical markers as you travel on your road-trip. 100% Shared Compose UI, Kotlin native cross-platform codebase. Includes Cocoapods, Google Maps, GPS Location, notifications, background location tracking, In-App purchases, web-scraping, networking, persistent storage, CommonFlow
Install / Use
/learn @realityexpander/FredsRoadtripStorytellerREADME
<img src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/7e226e7c-30e1-4a27-904a-dbc0646590fa" width="200"> <img src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/52544e04-3a4d-4e72-8054-915ae0a09985" width="204">
Fred's Roadtrip Storyteller
Listen to historical markers as you travel - Learn about local history as you drive.
- KMP (Kotlin Multi-Platform) Compose-based Proof-of-concept experimental app using Google Maps for iOS and Android.
- Pure Kotlin App using SHARED core and SHARED Compose based UI, running in native Kotlin.
YouTube series following the development of the app:
Assets
- Wiki: Fred's Roadtrip Storyteller Wiki
- Link to Marketing site source: https://github.com/realityexpander/FredsRoadtripStorytellerWebsite
- Link to Marketing Site: https://FredsRoadtripStoryteller.com
Screen Shots
Android Screenshots
<img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/369d81f1-8f53-4cb5-bc25-31ff502ae2cc"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/70a85983-d1d2-4fc9-b5f5-88f5272fb45c"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/b635ec05-b117-43e2-8f8b-12a250f1496f"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/4f420a44-7d64-473b-96c8-3ee3fe3e96a9"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/12fe1588-9b5c-4273-84d6-82750936211d"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/cc77fc6d-eb68-4d1e-a650-d696a2a5151e"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/47c5320c-4c5c-4cef-890e-f83fdf985a24"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/109718d8-fabd-458f-bd86-66da31bac411"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/891531d1-2487-41df-b282-c8c506b39141"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/d5178c01-0e3c-4d47-a68e-05a4ab6562e0">
iOS Screenshots
note: screenshots may differ slightly from current version
<img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/b339bbd0-2b22-4931-abd2-c61a70aa6474"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/dce44c86-1de3-434c-a5b1-91ca0582788f"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/abeca974-ca70-4fcb-b4a3-f06b25cd7db9"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/72b42050-a43a-4069-8f11-3bd14746a851"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/44cb0711-e4e0-4022-80a6-1acbba1ddbb3"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/da8bf05f-be04-40f5-b290-5f1be1c0dc9f"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/9c064296-a82c-4967-bf95-93d0b5fb4aed"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/74428757-4981-45f6-a67b-0da51146cd16"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/6e4a2427-66f1-4ed8-984f-32f3066b882c"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/c977ad13-4d0e-4f6f-b2d3-fe6572efc630"> <img width="200" alt="image" src="https://github.com/realityexpander/FredsRoadtripStoryteller/assets/5157474/7d6ec8fa-de16-4732-a5ff-9ba03f7eb464">
External Locations for Promoting Project
-
https://medium.com/@chrisathanas/
-
https://www.youtube.com/@ChrisAthanas
-
Join the KMP Developers Group:
- Twitter/X: https://twitter.com/i/communities/1739883885658607808
- LinkedIn: https://www.linkedin.com/groups/14367209
- FaceBook: https://www.facebook.com/groups/913147236893976
-
Support email:
- info@fredsroadtripstoryteller.com
- Email forwarding service (Free): https://app.improvmx.com/
- Hostinger hosting dashboard: https://hpanel.hostinger.com/ realityexpanderdev acct
Application Architecture
Developer notes
INSTALLATION
-
Secrets Files
- Check the
*.examplefiles for proper placement - Must create
AppSecrets.plistfrom within Xcode - in password vault, for google maps account ID's. - Can get
google-services.jsonfrom Google Cloud Console for google maps account ID's.- Get a Google Maps API key
- Check the
-
Add to
local.propertiesfile located in the root directory (create if it doesn't exist):MAPS_API_KEY=YOUR_KEYwhereYOUR_KEYis your key from previous step;sdk.dir=YOUR_SDK_PATHwhereYOUR_SDK_PATHis a path to Android SDK in your system.
-
From root dir, must run
./gradlew :shared:generateDummyFramework. -
Must run
pod updatethenpod installin theiosAppfolder. -
Must build the Android app before running the iOS app.
-
Open project in IntelliJ IDEA or Android Studio and run the
androidAppconfiguration. -
Note: There are many spurious warning messages from the AS IDE and pop-up warnings.
- It seems these can be safely ignored. (I assume they will address these issues in upcoming releases)
Source: (Code snapshot taken 10/8/23) https://github.com/JetBrains/compose-multiplatform/tree/master/examples/cocoapods-ios-example
Latest commit Ran & Built with:
- Android Studio Koala | 2023.3.2 Canary 2
- Build #AI-233.14475.28.2332.11606850, built on March 21, 2024
- Runtime version: 17.0.10+0-17.0.10b1087.21-11572160 aarch64
- VM: OpenJDK 64-Bit Server VM by JetBrains s.r.o.
- macOS 14.4
- GC: G1 Young Generation, G1 Old Generation
- Memory: 4096M
- Cores: 10
- Metal Rendering is ON
- Registry:
- ide.tooltip.initialDelay=812
- ide.browser.jcef.gpu.disable=true
- debugger.new.tool.window.layout=true
- analyze.exceptions.on.the.fly=true
- ide.experimental.ui=true
- Non-Bundled Plugins:
- com.c5inco.modifiers (1.0.15)
- dev.j-a.swift (0.21.0.336-233)
- wu.seal.tool.jsontokotlin (3.7.4)
- idea.plugin.protoeditor (233.13135.65)
- com.wakatime.intellij.plugin (14.3.11)
- com.github.airsaid.androidlocalize (3.0.0)
- DBN (3.4.3073.0)
- net.seesharpsoft.intellij.plugins.csv (3.3.0-233)
- com.jetbrains.kmm (0.8.2(233)-8)
- com.squareup.sqldelight (2.0.1)
- com.developerphil.adbidea (1.6.15)
- org.jetbrains.compose.desktop.ide (1.6.1)
- by.overpass.svg-to-compose-intellij (0.14)
- com.github.copilot (1.5.0.5148)
- mobi.hsz.idea.gitignore (4.5.2)
- com.abeade.plugin.figma.import (1.0.8)
Code style
- https://github.com/realityexpander/FredsRoadtripStoryteller/blob/main/raw_assets/CodeStyle.md
KMP Stuff
-
KMP Jetbrains Wizard (basic)
- https://kmp.jetbrains.com/#newProject
-
KMP Wizard
- https://terrakok.github.io/Compose-Multiplatform-Wizard/
-
All kinds of libraries
- https://github.com/terrakok/kmp-awesome
-
Settings
- https://github.com/russhwolf/multiplatform-settings
-
Storage (Store5)
-
https://github.com/MobileNativeFoundation/Store
-
Location KMM implementation concept
- https://github.com/line/abc-kmm-location
-
kSoup - HTML parser for scraping web pages
- This thing is a hack and a half way of scraping, but until jSoup is ported, its what we got. -https://github.com/MohamedRejeb/ksoup
-
Painter resources
- https://github.com/JetBrains/compose-multiplatform/blob/master/tutorials/Image_And_Icons_Manipulations/README.md
-
Material Design 3
-
https://material.io/blog/material-3-compose-1-1
-
Drawers
-
https://developer.android.com/jetpack/compose/components/drawer
-
WebView
-
https://github.com/KevinnZou/compose-webview-multiplatform/blob/main/sample/shared/src/commonMain/kotlin/com/kevinnzou/sample/BasicWebViewSample.kt
-
Screen Orientation
-
https://youtrack.jetbrains.com/issue/KT-58292
-
https://
