Issue #668

Authenticate Using Apple with JavaScript

Use Firebase JS SDK

• https://firebase.google.com/docs/auth/web/apple

Configure Sign in with Apple for the web

• https://help.apple.com/developer-account/#/dev1c0e25352

Go to Certificates, Identifiers & Profiles -> Identifier create 2 ids: App ID and Service ID

For example: I have App ID com.onmyway133.myapp and Service ID com.onmyway133.myweb

Remember that to view App ID or Service ID, there’s dropdown menu on the right

For App ID, enable

• Associated Domains
• Sign In with Apple: Enable it as Primary App ID

For Service ID, use firebase callback url

• https://myweb.firebaseapp.com/__/auth/handler

Associate domain

Add apple-app-site-association in public folder

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

{
  "applinks": {
      "details": [
           {
             "appIDs": ["T78DK947F2.com.onmyway133.myapp"],
             "components": [
               {
                  "#": "no_universal_links",
                  "exclude": true,
                  "comment": "Matches any URL whose fragment equals no_universal_links and instructs the system not to open it as a universal link"
               }
             ]
           }
       ]
   },
   "webcredentials": {
      "apps": [ "T78DK947F2.com.onmyway133.myweb" ]
   }
}

Private key

Go to Keys and create new auth key. Configure that key with the primary App ID above

Configure in Firebase

Go to Sign in providers and enable Apple sign in.

Fill in

• Service ID identifier (com.onmyway133.myweb)
• OAuth code flow configuration: fill in your team id, key id and key secret content.

Issue #645

Install webpack

1
2
3

npm init
npm install webpack webpack-cli --save-dev
vim webpack.config.js

1
2
3
4
5
6
7

module.exports = {
    entry: "./index.js",
    mode: 'production',
    output: {
        filename: "./index.js"
    }
}

To invoke webpack, run below. Your output is dist/index.js

1

npx webpack

Minify js

1

npm install babel-minify-webpack-plugin --save-dev

Minify html

1

npm install html-webpack-plugin --save-dev

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

const MinifyPlugin = require('babel-minify-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
    entry: "./index.js",
    mode: 'production',
    output: {
        filename: "./index.js"
    },
    plugins: [
        new MinifyPlugin(),
        new HtmlWebpackPlugin({
            template: 'index.html',
            filename: 'index.html',
            minify: {
                collapseWhitespace: true
            }
        })
    ]
}

Minify css

TBD

Copy files

Copy files from dist to public folder so we can use

1

npm install copyfiles -g

Then in package.json

1
2
3

"scripts": {
    "copy": "copyfiles -u 1 dist/* ../apps/ && copyfiles *.css ../apps"
}

Then run npm run copy

Issue #641

Create a new page

1

hexo new page mydemo

Remove index.md and create index.html, you can reference external css and js in this index.html. Hexo has hexo new page mydemo --slug but it does not support page hierarchy

Specify no layout so it is independent page.

1
2
3

---
layout: false
---

Issue #423

In DNS settings

Add 4 A records

1
2
3
4

A @ 185.199.110.153
A @	185.199.111.153
A @	185.199.108.153
A @	185.199.109.153

and 1 CNAME record

1

CNAME www learntalks.github.io

In GitHub

• Select custom domain and type learntalks.com

In source

public/CNAME

1

learntalks.com

Issue #32

iOS 9 introduces new ways for your app to work better, backed by your websites

Smart App Banners

• Promoting Apps with Smart App Banners

If the app is already installed on a user’s device, the banner intelligently changes its action, and tapping the banner will simply open the app. If the user doesn’t have your app on his device, tapping on the banner will take him to the app’s entry in the App Store

To add a Smart App Banner to your website, include the following meta tag in the head of each page where you’d like the banner to appear:

1

<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

Universal Links

• Support Universal Links

When you support universal links, iOS 9 users can tap a link to your website and get seamlessly redirected to your installed app without going through Safari. If your app isn’t installed, tapping a link to your website opens your website in Safari.

Web Markup

• Mark Up Web Content

If some or all of your app’s content is also available on your website, you can use web markup to give users access to your content in search results. Using web markup lets the Applebot web crawler index your content in Apple’s server-side index, which makes it available to all iOS users in Spotlight and Safari search results.

Shared Web Credentials

• Shared Web Credentials Reference

Shared web credentials is a programming interface that enables native iOS apps to share credentials with their website counterparts. For example, a user may log in to a website in Safari, entering a user name and password, and save those credentials using the iCloud Keychain. Later, the user may run a native app from the same developer, and instead of the app requiring the user to reenter a user name and password, shared web credentials gives it access to the credentials that were entered earlier in Safari.

Reference

• WWDC 2015 Session 509 Seamless Linking to Your App
• Integrating your Site and your iOS App