web | Swift Discovery

How to use FontAwesome 5 in Nextjs

Issue #802 npm i --save @fortawesome/fontawesome-svg-core \ @fortawesome/free-solid-svg-icons \ @fortawesome/free-brands-svg-icons \ @fortawesome/react-fontawesome import { faApple, faGithub, faTwitter } from '@fortawesome/free-brands-svg-icons' import { faUser, faPowerOff, faAngleDown } from '@fortawesome/free-solid-svg-icons' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' <FontAwesomeIcon icon={faCoffee} /> ...

How to use Bulma in Nextjs

Issue #801 Read https://nextjs.org/docs/basic-features/built-in-css-support#sass-support npm install bulma sass In styles/index.scss @import '~bulma/bulma'; In _app.tsx import '../styles/index.scss' ...

How to show img tag from GitHub markdown in Hugo

Issue #788 I just convert my blog https://onmyway133.com/ from Hexo.js back to Hugo again. Hugo now uses goldmark as the default markdown processor instead of blackfriday All works well, except that I use GitHub markdown to write articles, which use raw HTML img tag for uploaded images. Hugo works well with ![]() syntax but it ignores img tag <img width="574" alt="Screenshot 2021-02-26 at 10 08 38" src="https://user-images.githubusercontent.com/2284279/109279894-99d09a80-781a-11eb-9d50-10f46ba94105.png"> The solution is to tell goldmark to accept raw HTML....

How to sign in with apple for web with firebase

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...

How to use webpack to bundle html css js

Issue #645 Install webpack npm init npm install webpack webpack-cli --save-dev vim webpack.config.js module.exports = { entry: "./index.js", mode: 'production', output: { filename: "./index.js" } } To invoke webpack, run below. Your output is dist/index.js npx webpack Minify js npm install babel-minify-webpack-plugin --save-dev Minify html npm install html-webpack-plugin --save-dev 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....

How to add independent page in hexo

Issue #641 Create a new page 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. --- layout: false --- ...

How to use custom domain for GitHub pages

Issue #423 In DNS settings Add 4 A records A @ 185.199.110.153 A @ 185.199.111.153 A @ 185.199.108.153 A @ 185.199.109.153 and 1 CNAME record CNAME www learntalks.github.io In GitHub Select custom domain and type learntalks.com In source public/CNAME learntalks.com ...

App backed by website in iOS 9

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...