Monday, March 29, 2021

Upgrade Flutter project from Old to New version

  •  ประเด็นคือ ตอนเริ่มหัดพัฒนา Flutter เริ่มกับ version 1 แต่พอเขียนไปสักพัก เค้าออก version 2 แหละ
  • เลยลองลง Flutter version2 ในเครื่องส่วนตัว พยายาม Migrate โปรเจคจากเครื่องทำงานที่ Flutter version 1 ไปเครื่องส่วนตัวที่ Flutter version 2

Env เครื่องทำงานที่เริ่มทำโปรเจค Flutter

  • Ubuntu 18.04
  • Flutter 1.22.3
  • Dart 2.10.3
  • openjdk-11-jdk
  • Android Studio 4.1.3

Env เครื่องส่วนตัวที่จะย้ายโปรเจคไปเขียนต่อ

  • Ubuntu 20.04
  • Flutter 2.0.2
  • Dart 2.12.1
  • openjdk-11-jdk
  • Android Studio 4.1.3

Step migrate
  • sudo apt install openjdk-11-jdk (ไม่ต้องใช้ openjdk-11-jdk เพราะอีกที่เราพัฒนาโปรเจคเวอร์ชั่นเก่าใช้ 11 ทดสอบใช้ 14 แล้วรัน Flutter project เราที่ย้ายมาไม่ได้เลย ติดปัญหาที่ Java)
  • ติดตั้ง Android Studio ที่เครื่องใหม่ให้เรียบร้อย 
  • ดาวน์โหลด Flutter SDK มาแตกไฟล์ไว้ยังพาธที่ต้องการ (Dart SDK ร่วมใน Flutter แล้ว)
  • ติดตั้ง Plugin Flutter, Dart สำหรับ Android Studio ให้เรียบร้อย
  • ทดสอบสร้าง Flutter proejct ขึ้นมาเพื่อทดสอบ  Flutter SDK , Dart SDK ว่าใช้ได้จริง
  • คัดลอกไฟล์ project Flutter จากเครื่องที่เขียนด้วยเวอร์ชั่นเก่า
  • วางในพาธของเครื่องที่ลงเวอร์ชั่นใหม่ที่เราต้องการ 
  • จากนั้นเปิด Android Studio เลือกแบบ Exist project ไฟยังพาธที่วาง Project flutter ของเรา
  • ใน Flutter project ให้เปิดไฟล์ main.dart ขึ้นมา
  • แถวขวาบน เราจะเห็น  Enable Dart support และ Open Dart settings ให้เลือก Enable Dart
  • support อันนี้แหละ มันจะปรับ config file ของ project ให้ใช้ SDK พาธเครื่องใหม่เราให้อัตโนมัติ 
  • แต่ถ้าเราไปเลือก Open Dart settings อันนี้เหมือนเราต้องไป set Flutter, Dart SDK ด้วยตัวเราเองนะ ถ้าจำไม่ผิด
  • จากนั้นสั่ง flutter clean
  • และ flutter pub get
  • หลังจากนั้น Close project และ Open project ใหม่
  • เพียงเท่านี้ก็สามารถรัน Flutter project ที่เขียนด้วย Flutter 1 มาพัฒนาต่อบน Flutter 2 ได้แล้ว แต่ตอนรันอาจเจอ Note: เรื่อง Deprecate ของ lib ที่เราใช้ใน pubspec.yaml 

Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: /home/jui/snap/flutter/common/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_local_notifications-2.0.2/android/src/main/java/com/dexterous/flutterlocalnotifications/FlutterLocalNotificationsPlugin.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: /home/jui/snap/flutter/common/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_ringtone_player-2.0.0/android/src/main/java/io/inway/ringtone/player/FlutterRingtonePlayerPlugin.java uses or overrides a deprecated API.
ข้อควรจำ
  • เครื่องแรกที่ใช้พัฒนาโปรเจคใช้ Java เวอร์ชั่นใหน เครื่องใหม่ที่เราจะเปลี่ยนไปใช้พัฒนาแทนต้องใช้ เวอร์ชั่นเดียวกัน
  • โปรเจคนี้เครื่องที่ที่ใช้พัฒนาใช้ sudo apt install openjdk-11-jdk
  • พอเครื่องใหม่จะลองใช้ sudo install openjdk-14-jdk มันรันไม่ผ่าน มันขึ้นประมาณ Java Compiler error
  • ต้อง sudo apt remove openjdk-14-* เอาออกแล้ว sudo apt install openjdk-11-jdk เท่านี้ก็รันโปรเจคได้แล้วคับ
  • และอีกเรื่องแนะนำ ไม่ควรไปอัพเดทเปลี่ยน เวอร์ชั่น ของ lib ใน pubspec นะ มันก็ยังรันได้อยู่
  • ถ้าเราไป upgrade lib ใน pubspec ของโปรเจคเราที่นี้แหละ งานเข้าเลย ต้องไล่แก้โค้ดที่ เยอะเลยคับพี่น้อง

Create ISO file from DVD by command line Ubuntu 18.04

  • sr0 คือ drive DVD

sudo cat /dev/sr0 > ./server2008.iso

Thursday, March 4, 2021

How to scroll up and down in MacBook Pro 13-inch

  • ครั้งแรกกับ MacBook 13-inch เครื่องที่ทำงาน
  • แค่จะเลื่อนดู content ด้านล่างก็ scroll down กะบ่เป็น
  • User(ผม) คง low class ไม่เหมาะกับ device ตัวนี้แฮะ 

Solved

  • วาง 2 นิ้วบน touchpad แล้วไถ่ขึ้น-ลง  เพื่อ scroll up-down

Ref

  • https://support.apple.com/en-us/HT204895#:~:text=Slide%20two%20fingers%20up%20or%20down%20to%20scroll.&text=Pinch%20with%20two%20fingers%20to%20zoom%20in%20or%20out.&text=Move%20two%20fingers%20around%20each,a%20photo%20or%20other%20item.&text=Swipe%20left%20or%20right%20with,the%20previous%20or%20next%20page.


Run flask app in localhost with SSL

  • ปกติทดลองเขียน RESTFul โดย Python อาศัย FLASK ทำเป็น web server  ไปแล้วรอบหนึ่งโปรเจค https://juuier.blogspot.com/2020/09/restful-api-python.html
  • แต่โปรเจคนี้  คือ อยากให้ FLASK รัน https ได้โดย cer fake นี่แหละ โดยไม่ต้องทำอะไรให้ยุ่งยาก

Environment

  • Ubuntu 18.04
  • Python3

Pre

  • $ pip flask
Sovled 1 : Run Flask with ssl_context='adhoc'
  • ปกติรัน app แบบนี้

if __name__ == '__main__':

    app.run(port=1234)

  • เปลี่ยนเป็น

app.run(host='127.0.0.1', port='1234', debug=True, ssl_context=('adhoc'))

  • แบบนี้มันจะรันเว็บที่ https://localhost:1234
  • ถ้าเราไม่ระบุ port ค่าเริ่มต้นจะเป็น 5000

Solved 2 : Using Self-signed .pem certificate (Subject Type=CA)

  • สร้าง cer .pem ด้วย openssl หาวิธีติดตั้ง openssl เอาเองนะคับ
  • เปิด terminal แล้ว เข้าไปยังพาธไฟล์ .py ของเรา
  • และใช้คำสั่งสร้าง cer ปลอมคือ

$ openssl req -x509 --newkey rsa:4096 -nodes -out cert.pem -keyout key.pem -days 365

  • จากนั้นใน .py เราให้เขียน ประมาณด้านบน แต่เพิ่ม .pem ที่เราสร้างไว้เองเข้าไป

app.run(host='192.168.1.127', port='8282', debug=True, ssl_context=('cert.pem', 'key.pem'),)

Solved 3 : Using Self-signed .crt certificate

$ openssl genrsa -des3 -out server.key 1024
$ openssl req -new -key server.key -out server.csr
$ cp server.key server.key.org
$ openssl rsa -in server.key.org -out server.key
$ openssl x509 -req -days 365 -in server.csr -signkey server.key -out server.crt

  • ใน .py เขียนประมาณนี้

app.run(
    host='192.168.1.127', port="8282", debug=True,
    ssl_context=('server.crt', 'server.key')
)

Related

  • https://juuier.blogspot.com/2020/09/restful-api-python.html

Ref

  • https://stackoverflow.com/questions/59861685/how-to-run-flask-app-in-localhost-with-ssl

Tuesday, March 2, 2021

เพิ่ม Effect เมื่อเราพิมพ์โค้ดบน Visual Studio Code

  • แสดง effect เก๋ๆ เมื่อเราพิมพ์โค้ดบน Visual Studio Code

Step

  • เลือกเมนูซ้าย Extenstion 
  • พิมพ์ค้นหาด้วยคำว่า power mode
  • เลือกผลการค้นหา Power Mode และ Install
  • หลังจาก Install แล้ว 
  • เปิดคอนฟิกไฟล์ของ VSCode

$ gedit ~/.config/Code/User/settings.json

  • เพิ่มคอนฟิกนี้เข้าไป "powermode.enabled": true

  • แล้วบันทึก ปิดและเปิด VSCode อีกรอบ
  • เป็นอันเรียบร้อยใช้ได้

Ref

  • https://www.aboutmonica.com/blog/how-to-make-your-vs-code-sparkle
  • https://marketplace.visualstudio.com/items?itemName=hoovercj.vscode-power-mode