---
title: 2025-01-20 Web Scrape Skills
date: '2025-01-20T01:44:49.638Z'
name: oktak
description: desp
seoTitle: Web Scrape Skills
abstract: Web Scrape Skills
isPublished: true
publishedOn: '2025-01-20T01:44:49.638Z'
lastUpdated: '2025-01-20T01:44:49.638Z'
layout: Article
categories: Web excerpt
tags:
  - excerpt
photos: /uploads/2025-01/_.jpg
status: In progress
autoTags:
---

# Note Title

Content goes here...





- Why
- Concept
	- HTML
	- JS
	- Browser
- How
	- Tools
		- WebScraper (Picked)
	- Self - coding
		- Selenium
		- Puppeteer (Picked)
		- playwright
		- Scrapy
		- Cypress
	- Cloud Service
		- ScrapingBee
		- WebScraper.io
- Considerations
	- Block by the website
		- Proxy Rotator
		- Rate limit
		- Captcha
	- User login

---
title: 2025-01-19 React Sign on Web
date: '2025-01-19T15:44:24.278Z'
name: oktak
description: React Sign on Web
seoTitle: React Sign on Web
abstract: React Sign on Web
isPublished: true
publishedOn: '2025-01-19T15:44:24.278Z'
lastUpdated: '2025-01-19T15:44:24.278Z'
layout: Article
categories: Web excerpt
tags:
  - excerpt
photos: /uploads/2025-01/React Sign on Web.jpg
status: In progress
autoTags:
---

# How to have a web form to allow user to sign on iPad?

https://www.npmjs.com/package/react-signature-canvas


---
title: stock model Discounted Cash Flow Model
date: '2025-01-17T02:38:14.329Z'
name: oktak
description: desp
seoTitle: stock model Discounted Cash Flow Model
abstract: stock model Discounted Cash Flow Model
isPublished: true
publishedOn: '2025-01-17T02:38:14.329Z'
lastUpdated: '2025-01-17T02:38:14.329Z'
layout: Article
categories: Web excerpt
tags:
  - excerpt
  - stock
photos: /uploads/2025-00/_.jpg
status: In progress
autoTags:
---

# DCF 模型

DCF 模型（Discounted Cash Flow Model）是一種評估公司、項目或資產價值的金融模型，它將未來現金流的時間價值進行折扣，以此來計算其當前的價值或公平價格。

https://www.youtube.com/watch?v=gGWrQYQSORU

---
title: AI conversation workflow
date: '2025-01-15T01:07:48.050Z'
name: oktak
description: desp
seoTitle: AI conversation workflow
abstract: AI conversation workflow

isPublished: true
publishedOn: '2025-01-15T01:07:48.050Z'
lastUpdated: '2025-01-15T01:07:48.050Z'

layout: Article
categories: Web excerpt
tags:
- excerpt
- AI
photos: /uploads/2025-01-15T01:07:48.050Z/_.jpg

status: In progress
autoTags: 
---

# Note Title

Content goes here...


---
title: localhost docker
date: '2025-01-14T21:17:01+0800'
name: oktak
description: desp
seoTitle: localhost docker
abstract: localhost docker
isPublished: true
publishedOn: '2025-01-14T21:17:01+0800'
lastUpdated: '2025-01-14T21:17:01+0800'
layout: Article
categories: Prog
tags:
  - prog
  - docker
photos: /uploads/2025/01/macos-apple-intelligence.jpg
---




開咗 focus mode，再 allow 返想 summarize 嘅 app 出 notification ,先會做 summary; 唔開 focus mode  我等咗好耐都冇嘢 sum 到，直出。

---
title: localhost docker
date: '2025-01-13T21:17:01+0800'
name: oktak
description: desp
seoTitle: localhost docker
abstract: localhost docker
isPublished: true
publishedOn: '2025-01-13T21:17:01+0800'
lastUpdated: '2025-01-13T21:17:01+0800'
layout: Article
categories: Prog
tags:
  - prog
  - docker
photos: /uploads/2025/01/docker.jpg
---

## Running matrix

**Environment**
- Linux
- Mac/Windows

**Command**
- docker run
- docker compose



### docker run

> Mac/Windows -> no idea yet
```bash
docker run --add-host host.docker.internal:host-gateway ...
```

> Linux -> use host
```bash
docker run -it --network host ...
```

### docker compose

> Mac/Windows use `host.docker.internal`, cannot use `localhost` / `127.0.0.1`

docker-compose.yaml
```yaml
# ...
services:
  serviceName:
    build:
      context: .
      dockerfile: ./Dockerfile


    ## For macos/Windows
    extra_hosts:
      - "host.docker.internal:host-gateway"
# ...
```

> Linux use host or bridge, and then can use `localhost` / `127.0.0.1`
docker-compose.yaml
```yaml
# ...
services:
  serviceName:
    build:
      context: .
      dockerfile: ./Dockerfile


    ## For Linux
    network_mode: host
# ...
```


## References

- [# Docker 容器如何访问宿主机服务 - Link](https://www.linkinstars.com/post/c924c8b9.html)

---
title: start carefully to save time
date: '2025-01-04T21:17:01+0800'
name: oktak
description: desp
seoTitle: start carefully to save time
abstract: start carefully to save time
isPublished: true
publishedOn: '2025-01-04T21:17:01+0800'
lastUpdated: '2025-01-04T21:17:01+0800'
layout: Article
categories: Theory
tags:
  - theory
  - lifeHack
photos: /uploads/2025/01/_.jpg
---
At first, I only use the minimal way to tackle the issues, then spent lots of time to trial and errors. Eg, only rely on the complete build. 

Turn out start to read the document, or google for different terms for the issues. 

But the key is: try to use debugger! Why don't I use it at the first beginning?
- it can hot reload
- it can show the log
- it shows the Error message
- the variable watches and breakpoint can help to monitor if the things is going good, step by step. this can help to make changes progressively!

---
title: when where what
date: 2024-12-29T21:17:01+0800
name: oktak
description: desp
seoTitle: when where what
abstract: when where what, using vite
isPublished: true
publishedOn: 2024-12-29T21:17:01+0800
lastUpdated: 2024-12-29T21:17:01+0800
layout: Article
categories: Theory
tags:
  - thoery
  - lifeHack
photos: /uploads/2024/12/_.jpg
---

take 2 of three!
中文都是一個很好的語言，如果有一天朋友約大家出外遊玩，但是有些人原來並不需要很明確的時地人，反而是 大約一個時間做些東西便好了，到時再算更好玩。

```js
var activity = Maths.random() * 19 + 1
```

---
title: anime fullmetal alchemist
date: '2023-04-05T21:17:01+0800'
name: oktak
description: desp
seoTitle: anime fullmetal alchemist
abstract: anime fullmetal alchemist, using react-app-rewired
isPublished: true
publishedOn: '2023-04-05T21:17:01+0800'
lastUpdated: '2023-04-05T21:17:01+0800'
layout: Article
categories: Anime
tags:
  - anime
  - Fullmetal
photos: /uploads/2023/04/_.jpg
---

**Feeling**
8/10

### Feeling

**The good**
Comparing with the version of 2003, FA version (2009 ver) is more positive. It praise the coverage can overcome all the difficulties, just like stainless steel. It also renders that what people is actually want is the connection and relationship between friends, relatives and colleagues, not the power nor money.

**The not good**
However, this "positive" is kind of too simplified I think. Though the anime does not give the main character super-power to win the enemy, to me, it is still a type of traditional anime style that when friendship build through out the journey, they will finally come to help at the end in different ways by their means. Undeniably, this is very admirable acts. But in my opinion, no longer my cup of tea at my age now.

I like the storyline explaining the mysteries bit by bit and giving a full answer. I feel this shows the completeness of the story settings, which is very good.

#Spoiler 
2003 version ending was Edward and Alphonse separating in two different world. It was to sad. And their father was too unlikable in 2003 version. On the contrary, the FA version is more respectable.



---
title: 'Hacktoberfest: Rules of Contributing'
date: 2022-10-05T12:11:52+0800
name: oktak
description: Joining Hacktoberfest Rules of Contributing
seoTitle: 'Hacktoberfest: Rules of Contributing'
abstract: Joining Hacktoberfest Rules of Contributing

isPublished: true
publishedOn: 2022-10-05T12:11:52+0800
lastUpdated: 2022-10-05T12:11:52+0800

layout: Article
categories: 888_Inspried
tags:
  - hacktoberfest
  - programming
photos: /uploads/2022/01/happy_hour.jpg
---

https://github.com/search?o=desc&q=hacktoberfest+state%3Aopen+comments%3A0+is%3Aissue&s=updated&type=Issues

[Guide lines](https://github.com/firstcontributions/first-contributions)
https://gist.github.com/Chaser324/ce0505fbed06b947d962
https://github.com/h2oai/wave/issues/1634

- repo: https://github.com/HwangTaehyun/react-native-lottie-splash-screen/pull/50/files
- https://pyautogui.readthedocs.io/en/latest/screenshot.html
- https://github.com/IRLToolkit/obs-websocket-http

- \*\*\* https://github.com/qascade/yast/blob/main/tests/configutils_test.go

- (take) https://github.com/thieleju/statsbot

# Rules of Contributing

PRs must meet the Hacktoberfest Quality Standards.

Verify that you have read the home page, and Readme.md on GitHub.

You understand that this project is to connect maintainers with developers, not a way to get all the swag you can.

Steps

1. Fork the repository
2. Clone the forked repository to your local machine
3. Develope your code and keep the code sync with upstream
4. Commit your modified code
5. Create pull request
6. Code review from repository owner

Target: https://github.com/TARGET-USER/PROJECT-NAME.git
Your forked repository:

## 1. Fork the repository

```
# Clone your fork to your local machine
git clone https://github.com/YOUR-USERNAME/PROJECT-NAME.git
```

## 2. Clone the forked repository to your local machine

## 3. Develope your code and keep the code sync with upstream

```
# Add 'upstream' repo to list of remotes
git remote add upstream https://github.com/TARGET-USER/PROJECT-NAME.git
```

## 4. Commit your modified code

## 5. Create pull request

## 6. Code review from repository owner


---
title: 'Inspried by: 中大創業者聯盟Happy Hour 創業訪談系列︰唱彈社企樂與路'
date: 2022-01-27T00:11:52+0800
name: oktak
description: WeWah音樂家 圍唱音樂 中大校友
seoTitle: 'Inspried by: 中大創業者聯盟Happy Hour 創業訪談系列︰唱彈社企樂與路'
abstract: WeWah音樂家 圍唱音樂 中大校友

isPublished: true
publishedOn: 2022-01-27T00:11:52+0800
lastUpdated: 2022-01-27T00:11:52+0800

layout: Article
categories: 888_Inspried
tags:
  - video-clip
  - startup
  - charity
  - social-enterprise
photos: /uploads/2022/01/happy_hour.jpg
---

中大創業者聯盟 Happy Hour 創業訪談系列︰唱彈社企樂與路
Date: 2021-04-30

- Link1: https://www.facebook.com/cuhkaao/posts/10159104096204061
- Link2: https://youtu.be/rvTq8IA12PQ
- Link3: https://youtu.be/rvTq8IA12PQ

## What I have inspired

[WeWahMusic](https://www.facebook.com/WeWahMusic)

- The vision of an NGO
- What activities can be held to run the NGO and help the needs
  - Recruit volunteers to teach musical instruments
  - Offer a show time for the assisted children
  - Renewal second hand musical instruments with artists and re-sell in higher price. Support artists and the operation of NGO.
- Cooperate with multiple charity groups
- Original idea: is to help, need to recruit volunteers. So, not aim for profit.
- But need to cover the operation cost, so use the social enterprise mode
- Most high cost is to delivery of piano, HKD $1,000 once.
- Source of income: selling of folder
- Difficulties:
  - vision is important
  - is the teaching for piano exam?
  - registration of organization? s.88?
  - screening of the piano teachers
  - how to sustain the piano teachers
- How to sustain?

  - "The society is too bad, if we not do, then keep all worse. So, just continue to do it."

- For better society

[圍唱音樂 Wai Sing Music](https://www.facebook.com/waisingmusic/)

- A documentary project about urban renewal, inspired by a course of cultual stuidies
- A cappella when film playing
- Line-up secondary students to learn music, set up NGO
- Difficulties:
  - allocate time to compose songs
  - what's next, the future road
    - choose the road that no one is going to go: A cappella + Production + Social enterprise

Q&A

1. Technology in Art?

- now is already in art production
- Education is still working, like teaching children to open camera
- AR in art performance

2. Moment of touching

- Single mum listen to her child playing piano
- Seeing the students make friends

3. How to do Market research

- Service gap
- upcycling of piano is large market
- art taste in Hong Kong is too focus on the money
- Facebook, find the needs
- Funding website, looking what last year done, to fill up


---
title: 'Two Forms of Pre-rendering'
date: 2021-10-21T01:41:52+0800
name: oktak
description: AR(Augmented Reality) has over more than ten years of history. My first touch is the ARToolKit. And now there are AR.js on browsers, ARKit for Apple devices, ARCore for Google's... Now I would have a taste on AR.js
seoTitle: How I Built my Blog using MDX, Next.js, and React
abstract: An in-depth look at the technical structure for my blog.

isPublished: true
publishedOn: 2021-10-21T09:15:00+0800
lastUpdated: 2021-10-21T09:15:00+0800

layout: Article
categories: 01_Test
tags:
  - my-thought
  - Tips
photos: /uploads/2019/08/cheatsheet.jpg
---

> Keras "Failed to call ThenRnnForward with model config"

（重磅）Internal: Failed to call ThenRnnForward with model config 问题的解决（Keras 2.4.3 和 Tensorflow2.0 系列）
https://www.cnblogs.com/xiaojieshisilang/p/13636648.html

# No!!!!

Just the GPU's RAM are all occupied by another process.

nvidia-smi to check.

Still the RAM are goes to one process.

Maybe there are already some GPU load balancer could help...eg multiple user use cases

> Tensorflow "Could not load dynamic library libcudart.so.10.1"

https://www.cxyzjd.com/article/qq_19707521/107384416

1. Step 1

```bash
export LD_LIBRARY_PATH=/usr/local/cuda/lib64${LD_LIBRARY_PATH:+:${LD_LIBRARY_PATH}}
```

2. Step 2

```bash
cd /usr/local/cuda/lib64

sudo cp libcublas.so.10.0 libcublas.so.10
sudo cp libcufft.so.10.0 libcufft.so.10
sudo cp libcurand.so.10.0 libcurand.so.10
sudo cp libcusolver.so.10.0 libcusolver.so.10
sudo cp libcusparse.so.10.0 libcusparse.so.10
```

> Keras "cannot import name 'get_config'"

Instead of

```python
import keras
import keras.xxx
```

use

```
import tensorflow.keras
import tensorflow.keras.xxx
```


---
title: 'Catch up adult man!'
date: 2021-09-26T22:07:52+0800
name: oktak
description: Primary student is catching up with the World
seoTitle: Primary student is catching up with the World
abstract: Primary student is catching up with the World

isPublished: true
publishedOn: 2021-09-26T22:07:00+0800
lastUpdated: 2021-09-26T22:07:00+0800

layout: Article
categories: 01_Test
tags:
  - my-thought
  - beAMan
photos: /uploads/2019/08/cheatsheet.jpg
---

When you see primary student is teaching other primary students
how to code, people are enthusiatic to 係咁先喇...

幾多歲學負數呢？小六？
幾多歲學 cos sin tan? 中二?

然後看到[這份文件](https://www.edb.gov.hk/attachment/en/curriculum-development/kla/ma/curr/pri_maths_compare.pdf) (google search 而已)
2000 年時建議從小六數學課程中刪去正負數章節...

但小學生現在已懂了，並用在 Scratch programming 中，而且教人添。
超級超前部署。可能是好事。但我這老人來看感覺怪怪，但世界發展已是這樣，只能跟上去，不然就要被世界淘汰，that's it.

唔好剩係「係咁先喇，再來玩過吖」，追上去。

## Reference

The online tutorial by Kingsley Cheng:
[HoCHK 小老師教室 [Kingsley]: Scratch #1 Earth Invasion 地球反擊戰](https://www.youtube.com/watch?v=fbD1Lg6a1gA&ab_channel=HourofCodeHongKong)


---
title: 'Live streaming by OBS + iPhone'
date: 2021-09-25T14:32:52+0800
name: oktak
description: Learn live-streaming from iPhone
seoTitle: How I Built my Blog using MDX, Next.js, and React
abstract: An in-depth look at the technical structure for my blog.

isPublished: true
publishedOn: 2021-09-25T14:32:00+0800
lastUpdated: 2021-09-25T14:32:00+0800

layout: Article
categories: 01_Test
tags:
  - my-thought
  - skills
photos: /uploads/2019/08/cheatsheet.jpg
---

專業的製作公司或媒體公司可以有很多資源和器材去做 OB online broadcasting, 甚至戶外直播都沒問題。

大陸早些年的「網上帶貨」早已如日天中。

2019 年香港媒體開始多了很多現場直播。拿起手提電話案裝一個 App 已經可以開始做直播。

有聽過戶外做直播的行內人稱，要做得高清又穩定，要 4 張不同電訊商的 SIM 卡可夠。

OBS Studio 已經很張大，但是專業的要用 Xpress/XSplit，有錢的更要一套 BlackMagic

## 窮鬼只能用 OBS Studio

IG 都做到 live, 也有很多玩法

但如果想有多個 source 或 切換畫面不同鏡頭，OBS Studio 仍是窮鬼之選。

手上一部 iPhone 如何成為 web cam?

Google 一找很易找到這個 [Camera for OBS Studio Stream high quality video using your iOS Device](https://obs.camera/)

但要收錢。有沒有其他的窮鬼方法呢，找了找 [Streaming With SRT Protocol](https://obsproject.com/wiki/Streaming-With-SRT-Protocol), 不是想要的東西。

最後找到了 [VDO.ninja](https://obs.ninja/)

竟然為是如何做到的呢？看看它的技術文件的第一句：

> VDO.Ninja relies heavily on webRTC, a secure peer-to-peer streaming technology that exists in most modern web browsers.

**當然最好不要用來拍不能公開的東西吧！**

## 跟著做 Step-by-step

0. 很重要！很重要！很重要！如需要橫置影片，請解除 iOS 裝置螢幕置放鎖定，容許畫面橫置。除非你打算直置影片。

1. 使用 iOS 裝置，如 iPhone，打開 Safari Browser，去 [VDO.ninja](https://obs.ninja/)

2. 按「Add your Camera to OBS」

3. 此時，瀏覽器會詢問你是否允許瀏覽器存取你裝置的咪高峰，請按允許。然後瀏覽器會再詢問你是否允許瀏覽器存取你裝置的攝影鏡頭。如不允許，則不能進得錄影，需要重新打開瀏覽器，甚至重設 Safari Browser 選項。

4. 在版面上選擇你想要的來源，例如選擇前鏡頭還是後鏡頭；是否開啟收音咪高峰

5. 建議輸入密碼，以免不必要的亂入

6. 然後到影像下方一個綠色「START」

7. 此時畫面會跳入影像，請複製上方的 URL 並貼到 OBS

8. OBS Studio 上新增一個 Browser Source ，貼上剛才複製的 URL，然後按「OK」

9. 此時 OBS Studio 主畫面便會有 iOS 裝置正在錄影的畫面

10. 只要設定好 Streaming 的 RTMP 設定，便可以「Start Streaming」，愉快直播嚕～

11. 完結後在 iOS 裝置 Safari Browser 按紅色「電話掛斷」圖示，便可以結束了。然後關閉瀏覽器分頁。

## 後記

iPhone SE2 (battery health 87%) 100% 直播 15 分鐘剩下 90%電，建議大家要充電。


---
title: '獨木舟準備'
date: 2021-09-18T01:41:52+0800
name: oktak
description: AR(Augmented Reality) has over more than ten years of history. My first touch is the ARToolKit. And now there are AR.js on browsers, ARKit for Apple devices, ARCore for Google's... Now I would have a taste on AR.js
seoTitle: How I Built my Blog using MDX, Next.js, and React
abstract: An in-depth look at the technical structure for my blog.

isPublished: true
publishedOn: 2021-09-18T09:15:00+0800
lastUpdated: 2021-09-18T09:15:00+0800

layout: Article
categories: 01_Test
tags:
  - my-thought
  - Tips
photos: /uploads/2019/08/cheatsheet.jpg
---

最好準備以下東西

- 午餐 (飯團, 生果, 麵包)

- 衫 x 2
- 底褲
- 短褲 (走人時著)
- 長褲 (for 爬時用, 太陽超曬, 太陽油保唔到幾耐)
- 防曬衣
- Cap 帽 (太陽超曬, 最好緊頭免吹走, 但又要透氣)

- Crocs 鞋 (或者可入水厚底鞋, 蠔殼超𠝹)
- 手套 (蠔殼超𠝹, 拎槳也很磨手皮)
- 泳鏡/浮潛鏡 (睇海底生物)

- 太陽油 (記得開始前搽, 最好半個鐘補)
- 遮 (走人時落雨用)

- 防水袋 (20L+ for 全部 + 5L for 電話)
- 防水電話套 (水中影相)
- 環保袋/膠袋 (放嘢, 放濕咗嘢)

- 充電 (走人時電話都要有電)


---
title: 'Two Forms of Pre-rendering'
date: 2020-09-18T01:41:52+0800
name: oktak
description: AR(Augmented Reality) has over more than ten years of history. My first touch is the ARToolKit. And now there are AR.js on browsers, ARKit for Apple devices, ARCore for Google's... Now I would have a taste on AR.js
seoTitle: How I Built my Blog using MDX, Next.js, and React
abstract: An in-depth look at the technical structure for my blog.

isPublished: true
publishedOn: 2021-09-18T09:15:00+0800
lastUpdated: 2021-09-18T09:15:00+0800

layout: Article
categories: 01_Test
tags:
  - my-thought
  - Tips
photos: /uploads/2019/08/cheatsheet.jpg
---

Next.js has two forms of pre-rendering: **Static Generation** and **Server-side Rendering**. The difference is in **when** it generates the HTML for a page.

- **Static Generation** is the pre-rendering method that generates the HTML at **build time**. The pre-rendered HTML is then _reused_ on each request.
- **Server-side Rendering** is the pre-rendering method that generates the HTML on **each request**.

Importantly, Next.js lets you **choose** which pre-rendering form to use for each page. You can create a "hybrid" Next.js app by using Static Generation for most pages and using Server-side Rendering for others.


Sidebar