JavaScript's new Promise and Promise.all counterpart in C#

The result starts with:

and then simultaneously:

task 2 waits for task 1, and then run after 4 seconds, so the event fired at the 6nd second.
taks 3 starts at the beginning, and fired at the 6nd second.

Pyinstaller --- executable file with Google API --- obstacles I have:

• The first one we come across in many cases should be:

  pkg_resources.DistributionNotFound: The [distribution name] distribution was not found 
  

  where [distribution name] is among $\{$google-*-core, google-cloud-* $\}$ for various possible *. The first strategy is reinstallation. To somebody reinstalling the package in trouble will do. To me, I completely reinstall Python from 3.8 to just 3.7.5.
  
  And in order to keep projects' dependency separate enough, the first package I download is pipenv and installation of the second first package is done in pipenv shell.
• No module named [sth], to me [sth]'s are respectively google and then google.cloud. I have tried to edit .spec to include these packages as hiddenimports then pyinstaller xxx.spec.
  
  If problem persists, try to pip show [missing package] to get the location of problematic package, then add this location to pathex. In my case reinstalling Python gets rid of all the problems in this bullet point.
• After reinstallation, we have a very clean environment, the only problem left to me is again the google-cloud-vision, which is solved by adding hook-google.cloud.py the following
  
  
     data += copy_metadata('google-cloud-vision')


• After we get through all the trouble and successfully build an executable file, we may next encounter :

  Error: Exception in 'grpc._cython.cygrpc.ssl ............ pem_root_certs != nullptr

  To this we create a hook-grpc.py and type the following:

  from PyInstaller.utils.hooks import collect_data_files
  datas = collect_data_files('grpc')
  

At this point my journey battling with pyinstaller and google api is done, which spent me half of a day to get around all of these problems..., hope this article helps.

Find all required python library inside a project

I was using Python3.8 throughout a project but suddenly one of the required library require Python3.7 to work with, therefore I need to mirgrate everything to another virtual environment.

So I need to know the dependency that I was using in order to do migration, just do the following:

We start off installing

pip install pipreqs

Next cd into working directory and then

[working directory]>pipreqs .

which yields a message:

INFO: Successfully saved requirements file in .\requirements.txt

that looks like the following:

now switch into our virtual environment and pip install them:

pipenv shell
pip install -r requirements.txt

and we are done.

installation of pytesseract

By pip install tesseract we can install a wrapper of an application based on C++ library. It would not install the tesseract application into our computer. If we run import pytesseract and related API, we will get the following error:

TesseractNotFoundError: tesseract is not installed or it's not in your path

Derivation of Important formulas in backward propagation

In Andrew Ng's first course of deep learning one will encounter the following formulas that we need to translate in Python:

On Logistic Regression

Denote $\sigma(z)$ the sigmoid function defined by $z\mapsto 1/(1+e^{-z})$, for a given feature $X\in \R^n$ the estimator of $\mathbb{P}(y = 1 |X)$  is given by \[\hat y= a =
\sigma(w^TX+b),
\] where $w\in \R^n$ and $b\in \R$.

phaser and react

Surprisingly phaser and react can work perfectly, for future reference I record the following:

We start off creating a Game component which is almost the place we position our canvas:

polyfill for IE11

At the top of index.js, add:

import "react-app-polyfill/ie11";
import "react-app-polyfill/stable";

//yarn add react-app-polyfill
//yarn add babel-loader @babel/core --dev

and in package.json, add "ie 11" as below:

 "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version",
      "ie 11"

Record react template for own use

Hierarchy of files in this record:

record

https://stackoverflow.com/questions/53657920/i-cant-install-react-using-npx-create-react-app

Javascript Library that Swap <div> Elements

I am responsible for creating a simple game that involve an interchange of div objects. I record an approach modified from a source code from the net:

In the function defined in property onDragEnd the saveSortOrder is created such that upon each drag event, an array is created to store the current position of each div element, for example, [1, 0, 3 , 2, 4] means div of id 1, 0, 3, 2, 4 are at position 0, 1, 2, 3, 4 respectively.

Scene Loader in Unity

For loading scenes:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;

public class SceneLoader : MonoBehaviour
{
    [SerializeField] int startScene = 0;

    public void LoadNextScene()
    {
        int currentSceneIndex = SceneManager.GetActiveScene().buildIndex;
        SceneManager.LoadScene(currentSceneIndex + 1);
    }

    public void ReturnStartScene()
    {
        SceneManager.LoadScene(startScene);
    }

    public void QuitGame()
    {
        Application.Quit();
    }

    public void LoadGameOver()
    {
        SceneManager.LoadScene(2);
    }
}

.reduce

之前有人給我這様的一道題，設 A, B 為 string，編寫一個程序使得，當 B 的字母都在 A 出現過時，傳出 true，否則 false。例如 A = "abcde", B = "abc", 因為 B 中的 a, b, c 都在 A 出現過，因此我們的 funtion 要傳出 true。

因為沒有 .every 或 .reduce 等等的概念，第一次做的時候寫了兩個 for loop。然後答案使用 .every，嗯，知道多一個 method 也是好的。

最近在學習 .reduce，只要是需要對整個 array 的 entry 作 "consecutive action" (一個一個順序作一些 action)，都可以用 reduce 來解決。例如剛剛講到的 function 除了用 .every 外，還可以這様寫:

const containment = (string1, string2) => {
  const string1Array = string1.toLowerCase().split("");
  const string2Array = string2.toLowerCase().split("");

  return string2Array.reduce((A, char) => {
    return A && string1Array.indexOf(char) > -1;
  }, true);
};

好像有點太複雜 w? 我們來看看更簡單的例子，我們編寫 function maximum 來取得一個 number array 最大的數值:

const maximum = (...numbers) => {
  return numbers.reduce((A, b) => {
    return A > b ? A : b;
  });
};

這様一來 maximum(2, 3, 11, -2) 會 return 11。還是看不懂？我們現在就來講講 reduce 的概念﹗為了講得更仔細，無可避免要用數學一點的精確語言來解析。

從零開始建立 React 需要用到的 Config

結合上一篇 youtube 的 webpack + bable 教學，這篇

https://dev.to/dance2die/setting-up-a-react-environment-for-aspnet-mvc-44la

在假設我們理解 webpack 跟 bable 是甚麼的前提下直接教授怎様做 configuration 令我們可以開始運行 react。加上一些自己的小修改 (例如文章沒有提到，處理 async function 還要引入其他 package，解法有好幾個，其中一個是引入 polyfill 來完事)，終於算是可以把 express.js 做到的東西都搬到 asp .net 做了。

這是我送到 server 的資料

在 WebApiConfig.cs 做一些手腳，camel case 變成 pascal case，然後用 debugger 看看

最後回傳到前端的結果:

算是差不多了解怎様建立運行 react 的環境。知識總算開始結合起來了 ...。雖然還沒搞懂用 asp.net 的好處。

React and WebPack

We would not use

npm create-react-app

to initiate a react project any more because it is built by a bunch of CLI that we don't understand. Instead we can build a react object on our own by using webpack and babel (that transpiles ES6 Javascript into ES5, a version that is friendly to most browser).

The steps are essentially taken form a youtube tutorial:

https://www.youtube.com/watch?v=deyxI-6C2u4

but unforturnately a few amendment is required to make things work, so I go through what I have done below.

Before going any further, our directory will look like:

Tutorial on Using Session to do Authetication

Record:
https://www.youtube.com/watch?v=EyrKUSwi4uI

Screenshots of several codes that I want to record:

In connection string, the intial catalog is the same as the name of database.

Interface, Delegate and Predicate

• Inside a class, when we write
  

  public class PhotoFilter
  {
      public deletegate void PhotoFilterHandler(Photo phpto);
  }
  

Nice Blog

https://medium.com/@hulitw

Web Api Config | Json Pascel Case 與 Camel Case 的轉換

如果新建一個 api project，所有設定檔都會自動妥當地設定好，但想在現有 mvc project 加上一個 api controller 則有可能像我那様，奇怪地少了很多必要的 config。在這裏紀錄一下缺少檔案時必須要加回來的設定檔:

在 App_Start 必須要有 WebApiConfig.cs:

Standard CRUD in .NET

Just a record:

ASP.NET 中的 Form

可能有些 old-school，現在我們都 post json format 到 server，但 project 裏有遇見過 form data 處理速度比 json 快的事例 (我還懵懂的在奇怪為甚麼 project 裏的 post request 在 network 的 xhr section 裏甚麼也看不到，多按幾次才發現按 "all" 就找到了，原來變成了 form data 在傳輸 ...)，本着熟習 .net 的心態來學一下 form。

首先我們為一個 form 的頁面 (一個 view) 定義以下 ViewModel:

Visual Studio 新 Tab 從右邊插入

Visual Studio 從左邊插入這種設定不太符合自己處理 tabs 的習慣，我們可以到 tools > options 修改:

GULP

https://www.youtube.com/watch?v=vyI-Ko6fvKU 

第一次接觸 gulp，項目都在用 webpack 壓縮才看得到結果，最後還是得研究 webpack，發現 --watch 這個 flag，再仔細查一下 gulp 如何啟用 watch 選項，最終{watch: true} 保全家 (不用只作小修改，整個 project 都得再壓縮一次)。 終於可以安心寫 jsx 了...

For Code-First Approach in Entity Framework 6.0:

        1 Setup. Entity Framework is more or less an analogue of Knex.js that accesses the database with "sequel like" methods. In knex we have yarn knex migrate:make, yarn knex migrate:latest, etc, and they all have a counterpart in .net framework. If our application is chosen to be "NO AUTHETICATION", we need to add a class file written as:

Useful Links for my Work:

1. Handle json file in C# using dynamic type:
   https://stackoverflow.com/questions/3142495/deserialize-json-into-c-sharp-dynamic-object
   
   json format that C# framework can accept:
   
   "{test:\"test\",test2:2}"
2. Throughout introduction to MVC:
   https://ithelp.ithome.com.tw/users/20105694/ironman/1329
3. LINQ to SQL
   https://dotblogs.com.tw/tsxz2009/2013/05/08/103155

Blog 復活

由以前研究數學，到突然想當美術，再到去大陸當美術之前，這個 blog 累積了不少內容。現在在香港當 developer，想嘗試把所學的東西整合放在這裏，也為了方便自己工作做個紀錄。例如怎様 init 一個 react project 都已經忘了 ...，如果以前有在這邊做紀錄的話就可以直接 copy and paste 了。也由於有在上 data science course 的關係，基於自己的數學背景沒有辦法不執着背後定理的證明(接受不了把定理當成理所當然)，所以也會順便把有深入研究到的相關證明寫到這裏。

看到以前那些不堪入目的畫作 ...，練畫真的有血有淚啊。

為了熟習 C# 的 syntax 所以做了一些簡單的 Leetcode 題目，
以下測試 syntaxhighlighter，我的 code 是解答這題:
https://leetcode.com/problems/longest-substring-without-repeating-characters/

using System;
using System.Collections.Generic;

namespace Leetcode
{
    public class Solution
    {
        public int LengthOfLongestSubstring(string s)
        {
            if (s.Length < 2)
            {
                return s.Length;
            }
            else
            {
                var resultingLengths = new List<int>();
                for (int i = 0; i < s.Length - 1; i++)
                {
                    int count = 1;
                    string substring = Convert.ToString(s[i]);
                    for (int j = i + 1; j < s.Length; j++)
                    {
                        if (substring.IndexOf(s[j]) != -1)
                        {
                            break;
                        }
                        else
                        {
                            substring += s[j];
                            count++;
                        }
                    }
                    resultingLengths.Add(count);
                }
                return resultingLengths.Max();
            }
        }
    }
}

復活這 Blog，先貼一張最近無聊時畫的畫!