Google Blogger iOS App

List posts with infinite scroll from Google Blogger API in MVVM architecture, and using SwiftUI to design like Medium iOS App, which could read, search, save, comment posts, and so many excellent features！

Demo GIF：iPhone 13 Pro Max

YouTube Demo Video：youtu.be/xL209rnT73M

Overview

1. How To Use
2. Architecture Design、Features、Explanation
   • Models／BloggerFeedJSONModel
   • ContentView
   • HomeView
     • HomeTagView
     • AddTagButtomSheetView
     • EntryRowView
     • PostView
   • ExploreView
   • SavedView
   • AuthorView
   • Widget：iPad Pro（12.9-inch、5th generation）
   • Watch：Apple Watch Series 7 - 45mm
3. License：MIT

How To Use

1. Simply click on the green「Code」button on top right
2. click「Open with Xcode」
3. Having fun to explore this Google Blogger iOS App！

if nothing happen：

• Download this repository via git clone or from Releases

git clone https://github.com/5j54d93/Google-Blogger-iOS-App --depth

Architecture Design、Features、Explanation

Models／BloggerFeedJSONModel

• use CodingKey to change label in JSON data fetched from API

ContentView

• TabView：HomeView()、ExploreView()、SavedView()、AuthorView()
• use .environment(\.symbolVariants, .none) to prevent tabItem with default .fill icon type
  • only change tabItem icon type to .fill when selected

HomeView

• Show「You're offline」if we can't fetch data from API
• .scrollTo() top when user click on TabView's tabItem
• when there's more posts to load, show ProgressView() at list bottom with .onAppear to achieve infinite scroll
• use .refreshable to let list could refresh when been pull down

HomeTagView

• display tags with ScrollView(.horizontal, showsIndicators: false)
• click first plus button could triger bottomSheet（AddTagButtomSheetView）to add tag to Core Data
• show tags that store in Core Data
• .onLongPressGesture tag could show delete icon aside which on click could delet tag form Core Data

AddTagButtomSheetView

• couldn't add the same tag multiple times

EntryRowView

• use .prefix(3) to only show the first 3 items in array with ForEach
• deal with post's thumbnail url to get higher resolution image

let resVarId = thumbnail.url.lastIndex(of: "s") ?? thumbnail.url.endIndex
let fullResUrl = thumbnail.url[..<resVarId]
AsyncImage(url: URL(string: fullResUrl + "s480")) { image in
    image
        .resizable()
        .scaledToFill()
} placeholder: {
    Color.gray.overlay { ProgressView() }
}
.frame(width: 75, height: 75)
.clipped()

• onClink to show fullScreenCover PostView
• long press to show contextMenu

PostView

• use WebKit：WKWebView to show web

ExploreView

• recommended search words（posts topics）with ScrollView(.horizontal, showsIndicators: false) from API
• search post from API
• show recommendation posts with different UI if there's no search word

SavedView

• if there's no posts saved in Core Data, click「Start browsing」could change tab to ExploreView
• only show post title & post thumbnail when List：editMode.isEditing

AuthorView

• if user click on version tag 5 times could change Blogger url in API to change this app's content！

Widget

Widgets：iPad Pro（12.9-inch、5th generation）

• 4 different size
• UI design like Apple News
• data fetch from API to get the newest posts
• we also call API on getSnapshot in addition to getTimeline

Watch

watchOS：Apple Watch Series 7 - 45mm

• UI design with SwiftUI
• data fetch from API
• two clickable Button in a row of List

License：MIT

This package is MIT licensed.