-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
# Conflicts: # package.json # pnpm-lock.yaml
- Loading branch information
Showing
16 changed files
with
308 additions
and
202 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,58 +1,58 @@ | ||
| # Q & A - Musings on the "Why?" | ||
|
|
||
| ## Q: This app has very little functionality. Huh? Why? | ||
|
|
||
| A: It is a starter app to quickly get all infrastructure for new apps and start coding and designing pages and user interactions. It brings together cohesive and full technology stack which is mostly invisible, and it is ready to be deployed from a single codebase to any platform. Yes, ANY platform: | ||
|
|
||
| - iOS | ||
| - Android | ||
| - Windows | ||
| - MacOS | ||
| - Linux | ||
| - Web | ||
|
|
||
| ## Q: Is it Native? | ||
|
|
||
| A: It can be relased into Apple AppStore / Google PlayStore / Microsoft Store as any native app, but it is not native - at the core it uses JavaScript / TypeScript (and some Rust) and modern tooling to create blazingly fast websites, web apps, native apps and allow installation from web browser as an offline app on any of the major platforms. It is very powerful to have that flexibility to choose how to deliver your app. | ||
|
|
||
| ## Q: Is it SPA? SSR? PWA? | ||
|
|
||
| A: Yes, Yes, and Yes, and more - it is flexible. | ||
|
|
||
| See, each technique on its own is not so great, trading off one improvement or functionality for lower performance in other areas. | ||
|
|
||
| SPA (Single Page App) is bad for SEO with no routes for search crawlers and bad for UX / user experience with slow first loads (as the server will only give client an "/index.html" page and all routing is done on the client AFTER a lot of files are done loading - index.html and all framework Javascript and stylesheets, etc.). | ||
|
|
||
| SSR (Server-Side Rendering) is slow for navigation after first page load, as each new page transition has to load whole page and its decorations like NavBars. | ||
|
|
||
| PWA (Progressive Web App) gives experience similar to native apps with offline mode, but has many tradeoffs when SSR and SPA is not included. | ||
|
|
||
| This app allows to mix and match SSR, CSR, SPA, PWA as best serves the purpose. It can be done for the whole app or on each individual page to have a best combination of SSR with background Offline caching for slick UX with very quick deep links / landing pages, and once any route is loaded on the client, all navigation is local as in a SPA for quick transitions without heavy server reloads. PWA offline caching provided by Service Worker allows seamless online / offline app experience when the app can work without Internet as any standalone app would. | ||
|
|
||
| ## Q: Then how this app Technology can be described? | ||
|
|
||
| A: This technology does not have an established name, and parts of this mix were called "Universal Application" (former "Isomorphic Application") and parts are called "Progressive Web App" (PWA) with Server-Side Rendering (SSR) and client-side navigation". Ugh! We need a better name... | ||
|
|
||
| ## Q: Why is it called "Total App"? | ||
|
|
||
| A: That lack of a good name situation (see previous question) gives me freedom to coin a new term: "TotalApp", since it unifies various technolofies to bring the best where it's needed. | ||
|
|
||
| Out of the box features: | ||
|
|
||
| - SEO and integration with Social Networks. | ||
| - SSR / Server-Side Rendering [[1]](https://www.sanity.io/glossary/server-side-rendering) - for fast first load of any route and great SEO. | ||
| - SPA / Single Page App [[2]](https://www.sanity.io/glossary/single-page-application) - for fast client-side navigation. | ||
| - PWA / Progressive Web App [[3]](https://www.sanity.io/glossary/progressive-web-application) with Offline mode - can work without Internet connection (after the user visits the app when connected, the app's service worker caches all files for offline operation). | ||
| - Support native features (camera, GPS, etc.) - Capacitor included. Check Geolocation and QR Scanner tabs for demo. | ||
| - Support deep links, in online and in offline modes. | ||
| - Great DX (developer experience) with Svelte and Codebase support features - Linting, Formatting, Unit Testing, End-to-End testing. | ||
| - Great DDX (designer/developer experience) - Prepared for Isolated Component Development (Storybook). | ||
| - Great DevOps - Instrumented for quick deployment - Netlify, Vercel, NGINX, etc. (CI/CD coming). | ||
| - Prepared for UDX (UI designer experience) - see UI integrations below. | ||
| - All deployment methods are included - build for standalone apps (iOS/Android/Windows), make a Website or a Web App, or Offline Web App, or all of them. | ||
|
|
||
| ## Q: I found a bug, what shall I do? | ||
|
|
||
| A: Please understand that this project currently follows bleeding edge of Svelte 5 development, and gets all the bugs from early release candidate / pre-alpha versions. Once upstream stabilizes and gets released, many things will be fixed, so your patience will be greatly appreciated. | ||
|
|
||
| To help this project, file issues and submit PRs on [Github](https://github.com/iva2k/total-app/issues). | ||
| # Q & A - Musings on the "Why?" | ||
|
|
||
| ## Q: This app has very little functionality. Huh? Why? | ||
|
|
||
| A: It is a starter app to quickly get all infrastructure for new apps and start coding and designing pages and user interactions. It brings together cohesive and full technology stack which is mostly invisible, and it is ready to be deployed from a single codebase to any platform. Yes, ANY platform: | ||
|
|
||
| - iOS | ||
| - Android | ||
| - Windows | ||
| - MacOS | ||
| - Linux | ||
| - Web | ||
|
|
||
| ## Q: Is it Native? | ||
|
|
||
| A: It can be relased into Apple AppStore / Google PlayStore / Microsoft Store as any native app, but it is not native - at the core it uses JavaScript / TypeScript (and some Rust) and modern tooling to create blazingly fast websites, web apps, native apps and allow installation from web browser as an offline app on any of the major platforms. It is very powerful to have that flexibility to choose how to deliver your app. | ||
|
|
||
| ## Q: Is it SPA? SSR? PWA? | ||
|
|
||
| A: Yes, Yes, and Yes, and more - it is flexible. | ||
|
|
||
| See, each technique on its own is not so great, trading off one improvement or functionality for lower performance in other areas. | ||
|
|
||
| SPA (Single Page App) is bad for SEO with no routes for search crawlers and bad for UX / user experience with slow first loads (as the server will only give client an "/index.html" page and all routing is done on the client AFTER a lot of files are done loading - index.html and all framework Javascript and stylesheets, etc.). | ||
|
|
||
| SSR (Server-Side Rendering) is slow for navigation after first page load, as each new page transition has to load whole page and its decorations like NavBars. | ||
|
|
||
| PWA (Progressive Web App) gives experience similar to native apps with offline mode, but has many tradeoffs when SSR and SPA is not included. | ||
|
|
||
| This app allows to mix and match SSR, CSR, SPA, PWA as best serves the purpose. It can be done for the whole app or on each individual page to have a best combination of SSR with background Offline caching for slick UX with very quick deep links / landing pages, and once any route is loaded on the client, all navigation is local as in a SPA for quick transitions without heavy server reloads. PWA offline caching provided by Service Worker allows seamless online / offline app experience when the app can work without Internet as any standalone app would. | ||
|
|
||
| ## Q: Then how this app Technology can be described? | ||
|
|
||
| A: This technology does not have an established name, and parts of this mix were called "Universal Application" (former "Isomorphic Application") and parts are called "Progressive Web App" (PWA) with Server-Side Rendering (SSR) and client-side navigation". Ugh! We need a better name... | ||
|
|
||
| ## Q: Why is it called "Total App"? | ||
|
|
||
| A: That lack of a good name situation (see previous question) gives me freedom to coin a new term: "TotalApp", since it unifies various technolofies to bring the best where it's needed. | ||
|
|
||
| Out of the box features: | ||
|
|
||
| - SEO and integration with Social Networks. | ||
| - SSR / Server-Side Rendering [[1]](https://www.sanity.io/glossary/server-side-rendering) - for fast first load of any route and great SEO. | ||
| - SPA / Single Page App [[2]](https://www.sanity.io/glossary/single-page-application) - for fast client-side navigation. | ||
| - PWA / Progressive Web App [[3]](https://www.sanity.io/glossary/progressive-web-application) with Offline mode - can work without Internet connection (after the user visits the app when connected, the app's service worker caches all files for offline operation). | ||
| - Support native features (camera, GPS, etc.) - Capacitor included. Check Geolocation and QR Scanner tabs for demo. | ||
| - Support deep links, in online and in offline modes. | ||
| - Great DX (developer experience) with Svelte and Codebase support features - Linting, Formatting, Unit Testing, End-to-End testing. | ||
| - Great DDX (designer/developer experience) - Prepared for Isolated Component Development (Storybook). | ||
| - Great DevOps - Instrumented for quick deployment - Netlify, Vercel, NGINX, etc. (CI/CD coming). | ||
| - Prepared for UDX (UI designer experience) - see UI integrations below. | ||
| - All deployment methods are included - build for standalone apps (iOS/Android/Windows), make a Website or a Web App, or Offline Web App, or all of them. | ||
|
|
||
| ## Q: I found a bug, what shall I do? | ||
|
|
||
| A: Please understand that this project currently follows bleeding edge of Svelte 5 development, and gets all the bugs from early release candidate / pre-alpha versions. Once upstream stabilizes and gets released, many things will be fixed, so your patience will be greatly appreciated. | ||
|
|
||
| To help this project, file issues and submit PRs on [Github](https://github.com/iva2k/total-app/issues). |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,6 @@ | ||
| // DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN | ||
| include ':capacitor-android' | ||
| project(':capacitor-android').projectDir = new File('../node_modules/.pnpm/@[email protected].0_@[email protected].0/node_modules/@capacitor/android/capacitor') | ||
| project(':capacitor-android').projectDir = new File('../node_modules/.pnpm/@[email protected].1_@[email protected].1/node_modules/@capacitor/android/capacitor') | ||
|
|
||
| include ':capacitor-geolocation' | ||
| project(':capacitor-geolocation').projectDir = new File('../node_modules/.pnpm/@[email protected]_@[email protected].0/node_modules/@capacitor/geolocation/android') | ||
| project(':capacitor-geolocation').projectDir = new File('../node_modules/.pnpm/@[email protected]_@[email protected].1/node_modules/@capacitor/geolocation/android') |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| require_relative '../../node_modules/.pnpm/@[email protected].0_@[email protected].0/node_modules/@capacitor/ios/scripts/pods_helpers' | ||
| require_relative '../../node_modules/.pnpm/@[email protected].1_@[email protected].1/node_modules/@capacitor/ios/scripts/pods_helpers' | ||
|
|
||
| platform :ios, '13.0' | ||
| use_frameworks! | ||
|
|
@@ -9,9 +9,9 @@ use_frameworks! | |
| install! 'cocoapods', :disable_input_output_paths => true | ||
|
|
||
| def capacitor_pods | ||
| pod 'Capacitor', :path => '../../node_modules/.pnpm/@[email protected].0_@[email protected].0/node_modules/@capacitor/ios' | ||
| pod 'CapacitorCordova', :path => '../../node_modules/.pnpm/@[email protected].0_@[email protected].0/node_modules/@capacitor/ios' | ||
| pod 'CapacitorGeolocation', :path => '../../node_modules/.pnpm/@[email protected]_@[email protected].0/node_modules/@capacitor/geolocation' | ||
| pod 'Capacitor', :path => '../../node_modules/.pnpm/@[email protected].1_@[email protected].1/node_modules/@capacitor/ios' | ||
| pod 'CapacitorCordova', :path => '../../node_modules/.pnpm/@[email protected].1_@[email protected].1/node_modules/@capacitor/ios' | ||
| pod 'CapacitorGeolocation', :path => '../../node_modules/.pnpm/@[email protected]_@[email protected].1/node_modules/@capacitor/geolocation' | ||
| end | ||
|
|
||
| target 'App' do | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.