diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..9735178 --- /dev/null +++ b/.gitignore @@ -0,0 +1,36 @@ +# Created by https://www.toptal.com/developers/gitignore/api/macos +# Edit at https://www.toptal.com/developers/gitignore?templates=macos + +### macOS ### +# General +.DS_Store +.AppleDouble +.LSOverride + +# Icon must end with two \r +Icon + +# Thumbnails +._* + +# Files that might appear in the root of a volume +.DocumentRevisions-V100 +.fseventsd +.Spotlight-V100 +.TemporaryItems +.Trashes +.VolumeIcon.icns +.com.apple.timemachine.donotpresent + +# Directories potentially created on remote AFP share +.AppleDB +.AppleDesktop +Network Trash Folder +Temporary Items +.apdisk + +### macOS Patch ### +# iCloud generated files +*.icloud + +# End of https://www.toptal.com/developers/gitignore/api/macos diff --git a/README.md b/README.md index 086b8b8..18de22f 100644 --- a/README.md +++ b/README.md @@ -1 +1,64 @@ -# server-side-swift-workout-real-world \ No newline at end of file +# How does Server Side Swift Workout in the Real World? +1. [Introduction](docs/01-introduction.md) + 1. Brief overview of Heartwitch: The inspiration behind gBeat + 2. Introduction to gBeat: A health and fitness live streaming app +2. [The Power of Full Stack Swift](docs/02-full-stack-swift.md) + 1. Unified Language Ecosystem + 2. Type Safety Across the Stack + 3. Performance Benefits + 4. Apple's Ecosystem Integration + 5. Growing Server-Side Swift Community + 6. Simplified Deployment and Scaling + 7. Developer Productivity + 8. Future-Proofing + 9. Case Study: gBeat's Experience with Full Stack Swift +3. [The gBeat Ecosystem](docs/03-gbeat.md) + 1. How the applications work + 2. Integration with Apple Watch + 3. User experience highlights +4. [Technical Deep Dive: Full Stack Swift Implementation](docs/04-technology) + 1. [Authentication system with Sign in with Apple](docs/04-technology/01-authentication.md) + 1. Implementation across iOS and watchOS + 2. Challenge: Sign in with Apple not available on Apple Watch simulator + 1. Impact on development and testing process + 2. Workarounds and solutions + 2. Development Server Auto-discovery (emphasize this as a key technical issue) + 3. Communication with Redis and WebSockets + 4. Implementing Apple Push Notification System (APNs) + 5. OpenAPI Integration + 1. Generating API documentation + 2. Ensuring consistency between API specification and implementation + 3. Benefits for frontend-backend communication and third-party integrations + 6. Web Development: Building the gBeat Website + 1. Choosing VueJS as the frontend framework + 1. Advantages for a fitness streaming application + 2. Integration with Swift backend + 2. Implementing TypeScript for improved type safety + 1. Benefits in a large-scale application + 2. Synergies with Swift's strong typing + 3. Utilizing Vite for build tooling + 1. Fast development experience + 2. Optimized production builds + 4. Webpack configuration for advanced scenarios + 5. Challenges and solutions in creating a responsive fitness streaming interface + 6. Performance optimizations for live video streaming +5. Challenges and Solutions + 1. Android integration + 1. Integrating Firebase Cloud Messaging (FCM) for cross-platform support + 2. Implementing Sign in with Google + 2. Creating a White Label app + 1. Issues with React Native and how Swift addressed them + 3. Developing a Chrome Extension for YouTube Workouts + 1. Bridging the gap between gBeat and popular YouTube fitness content + 2. Technical challenges in integrating with YouTube's player + 3. User experience considerations for seamless workout tracking + 4. How this extension complements the core gBeat application +6. Deployment and CI/CD + 1. Deploying to Heroku + 2. Setting up Continuous Integration with GitLab and GitHub +7. Future Plans + 1. Upcoming features or improvements + 2. Potential expansions of the gBeat platform +8. Conclusion + 1. Recap of key learnings + 2. Encouragement for attendees to explore Full Stack Swift for their projects \ No newline at end of file diff --git a/docs/01-introduction.md b/docs/01-introduction.md new file mode 100644 index 0000000..a2a0fee --- /dev/null +++ b/docs/01-introduction.md @@ -0,0 +1,17 @@ +# Why + +It's one thing to create a server-side app which works for your iPhone and runs a simple service but I wanted to create an app which was dynamic and used Apple's tiniest device - the Apple Watch. + + +## Brief overview of Heartwitch: The inspiration behind gBeat + + +I am a fan of classic retro video games and over the last 10 years a culture of speed running `What is Speed running` has emerged. As one can imagine when you are trying to beat `a video game` in record time, your heart rate can get high. There are a class of devices which specifically for this. However if one were to already wear a smart device which read the user's heart rate while speed running, it would remove the need for third party devices and remove one extra layer of inconvenience. + +This became the genesis of **Heartwitch** an app dedicated to Twitch live streamers who wished to share their heart rate while playing video games. not just speed runners but also horror games as well. + +## Introduction to gBeat: A health and fitness live streaming app + + in 2021 I was contracted by founders, Chris Hart `photo` and Chelsea Kmiec `photo` about a new app for the Apple Watch - gBeat. With a pandemic gripping the world, people weren't visiting their local gyms. What if there was an app, which could allow people to work out from home and share their heart rate in real time. `photo of gBeat in use`. + + Having heard me speak about Heartwitch on social media and my podcast, Chris was convinced gBeat could co-opt much of the same APIs and technologies in gBeat. \ No newline at end of file diff --git a/docs/02-full-stack-swift.md b/docs/02-full-stack-swift.md new file mode 100644 index 0000000..71addf3 --- /dev/null +++ b/docs/02-full-stack-swift.md @@ -0,0 +1,41 @@ +# The Power of Full Stack Swift + +As has been stated there's a lot of benefit to building a Full Stack Swift app. + +## Unified Language Ecosystem + +We have one language for passing models and sharing business logic across devices and servers. + + +## Type Safety Across the Stack + +We can take advantage of the safety Swift has to offer for developer. + + +## Performance Benefits + +There's plenty of benefits when it comes to performance especially when going with a more budget-friendly host. + + +## Apple's Ecosystem Integration + +Along with sharing server-side code, we have the ability to port our app to all of Apple's devices easily. + + +## Growing Server-Side Swift Community + + + + +## Simplified Deployment and Scaling + +Server-Side Swift is friendly to services like Heroku but importantly Docker which is universally accepted and well supported. + +## Developer Productivity + +Being able to easily debug and analyze server-side and device side code via Xcode is a huge boost to developer productivity. + + +## Case Study: gBeat's Experience with Full Stack Swift + +Let's now talk about how gBeat took advatage of this. diff --git a/docs/03-gbeat.md b/docs/03-gbeat.md new file mode 100644 index 0000000..f5468a2 --- /dev/null +++ b/docs/03-gbeat.md @@ -0,0 +1,39 @@ +# The gBeat Ecosystem + +## How the applications work + +```mermaid +flowchart TD + A(Apple Watch) -->|Sends Health Stats| B(Vapor Server) + B --> |Sends Health Stats| C + C(Web Browser) --> |Opens Web Socket| B +``` + 2. Integration with Apple Watch + 3. User experience highlights + +![How it works Diagram](/media/gBeat-Works-2024-08-20-142518.svg) + +### Participant +1. User Signs in with Apple +2. User Enters Code for Workout Class +3. User Starts Workout + +### Instructor +1. Instructor Signs In With Apple +2. Instructor Creates a Workout Class with an optional schedule. +3. Instructor Starts the Class +4. Instructor Shares Web Browser in Streaming Platform +5. Instructors Shares Workout Class Code +6. Class Begins! + +## Integration with Apple Watch + +1. Restricts User Interface to Simplest Possible +2. (Independent without iPhone App) Reduces exposure to App Store +3. Developer Challenges +4. Wish there was another way without the code. + +## User experience highlights + +1. Simple Authentication Experience on Apple Watch. +2. Quick ... diff --git a/docs/04-technology/01-authentication.md b/docs/04-technology/01-authentication.md new file mode 100644 index 0000000..3f32157 --- /dev/null +++ b/docs/04-technology/01-authentication.md @@ -0,0 +1,25 @@ +# Authentication with no UI + +- It's difficult to enter information on the Apple Watch - let alone username and password +- How can we avoid the user having to enter anything +- Heartwitch solution was to link their account via iCloud +- gBeat used Sign in with Apple + +## Implementation across iOS and watchOS + +- gBeat uses Sign in with Apple for the user to authenticate via iPhone and Apple Watch + +## Challenge: Sign in with Apple not available on Apple Watch simulator + +- Developing for the Apple Watch can be a challenge `how is Apple Watch a challenge` +- Using the Simulator makes it even easier +- Simulator can fake HealthKit stats be not Sign In With Apple `what happens` +- How can we fake **sign in with apple** + +### Impact on development and testing process + +- On development server save the token as a file on the Mac and copy it to the simulator directly +- Login via web site +- Simulator then watches for the file and _logs in_ + +### Workarounds and solutions \ No newline at end of file diff --git a/docs/04-technology/README.md b/docs/04-technology/README.md new file mode 100644 index 0000000..28c2be1 --- /dev/null +++ b/docs/04-technology/README.md @@ -0,0 +1 @@ +# Technology Deep Dive diff --git a/media/gBeat-Works-2024-08-20-142518.svg b/media/gBeat-Works-2024-08-20-142518.svg new file mode 100644 index 0000000..3d83cc4 --- /dev/null +++ b/media/gBeat-Works-2024-08-20-142518.svg @@ -0,0 +1 @@ +

Sends Health Stats

Sends Health Stats

Opens Web Socket

Apple Watch

Vapor Server

Web Browser

 \ No newline at end of file