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

May 19, 2021 路 1 min 路 Khoa Pham

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

May 19, 2021 路 1 min 路 Khoa Pham

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

March 2, 2021 路 1 min 路 Khoa Pham

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鈥檚 dropdown menu on the right For App ID, enable...

June 16, 2020 路 1 min 路 Khoa Pham

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

April 28, 2020 路 1 min 路 Khoa Pham

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

April 26, 2020 路 1 min 路 Khoa Pham

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

September 17, 2019 路 1 min 路 Khoa Pham

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鈥檚 device, the banner intelligently changes its action, and tapping the banner will simply open the app. If the user doesn鈥檛 have your app on his device, tapping on the banner will take him to the app鈥檚 entry in the App Store...

May 10, 2017 路 2 min 路 Khoa Pham