Posted on | Edited on |
  1. Use React.PureComponent, it implement shouldComponentUpdate() by shallow compare prop and state, it is powerful with Immutable.js.
  2. Use Chrome extension and checked highlight updates in dev tool to find any unnecessary updates.
  3. Use React-virtualized for render huge list in small chunk at a time.

  4. Use Production build, for example with webpack you need following config:

    1
    2
    3
    4
    new webpack.DefinePlugin({
        'process.env.NODE_ENV': JSON.stringify('production')
    }),
    new webpack.optimize.UglifyJsPlugin()

Posted on | Edited on |

Before Start

Make sure the server has internet access or you will have to download and upload packages manually. If the server doesn’t, I recommend CCProxy to grant temporary internet access.

Install JDK

1
2
wget -c --header "Cookie: oraclelicense=accept-securebackup-cookie" http://download.oracle.com/otn-pub/java/jdk/8u161-b12/2f38c3b165be4555a1fa6e98c45e0808/jdk-8u161-linux-x64.rpm
rpm -ivh jdk-8u161-linux-x64.rpm

Elasticsearch

  1. Download and install

    1
    2
    wget https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-6.2.3.rpm
    rpm -ivh elasticsearch-6.2.3.rpm

  2. Start service

    1
    2
    3
    4
    5
    6
    7
    # Auto start elasticsearch when computer start
    systemctl daemon-reload
    systemctl enable elasticsearch.service

    # start service
    systemctl start elasticsearch
    systemctl status elasticsearch

  3. Verify Elastic search is running

    1
    2
    3
    4
    curl http://localhost:9200

    # If not working, you could try reboot
    reboot -r

    You could check log files under /var/log/elasticsearch/

  4. Reference : https://www.elastic.co/guide/en/elasticsearch/reference/current/rpm.html

Kibana

  1. Download and install

    1
    2
    wget https://artifacts.elastic.co/downloads/kibana/kibana-6.2.3-x86_64.rpm
    rpm -ivh kibana-6.2.3-x86_64.rpm

  2. Modify kibana config

    1
    2
    3
    4
    5
    vi /etc/kibana/kibana.yml
    # Kibana port
    server.port: 5601
    # Bind to all ip address
    server.host: "0.0.0.0"

  3. Start service

    1
    2
    3
    4
    systemctl daemon-reload
    systemctl enable kibana.service
    systemctl start kibana
    systemctl status kibana

  4. Verify installation

    1
    curl localhost:5601

    You can check log file under /var/log/kibana/

  5. Reference : https://www.elastic.co/guide/en/kibana/current/rpm.html

Logstash

  1. Download and install

    1
    2
    wget https://artifacts.elastic.co/downloads/logstash/logstash-6.2.3.rpm
    rpm -ivh logstash-6.2.3.rpm

  2. Modify logstash.yml to enable auto reload config

    1
    2
    3
    vi /etc/logstash/logstash.yml
    config.reload.automatic: true
    config.reload.interval: 3s

  3. Add first logstash config

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    cd /etc/logstash/conf.d/
    cat > default.conf
    input {
      beats {
        port => 5044
      }
    }
    output {
      elasticsearch {
        hosts => ["http://localhost:9200"]
      }
    }

  4. Start service

    1
    2
    3
    4
    systemctl daemon-reload
    systemctl enable logstash.service
    systemctl start logstash
    systemctl status logstash

  5. Verify installation

    1
    telnet 127.0.0.1 5044

    You could check log file under /var/log/logstash/

  6. Reference : https://www.elastic.co/guide/en/logstash/current/installing-logstash.html

Posted on | Edited on |

It is painful to install something on server without internet access, you need to download package manually and upload it. CCProxy could help your server use your computer internet temporarily, here is the steps :

  1. Download CCProxy
  2. Go through CCProxy setup wizard
  3. Open CCProxy > Options to check your port and your ip address.
  4. Login to your linux server, use your CCProxy as proxy server, then you can curl to check if it works. 
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    [[email protected] ~]# export http_proxy=http://172.16.49.170:808/
    [[email protected] ~]# export https_proxy=http://172.16.49.170:808/
    [[email protected] ~]# curl http://www.google.com
    <!DOCTYPE html>
    <html lang=en>
    <meta charset=utf-8>
    <meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
    <title>Error 404 (Not Found)!!1</title>
    <style>
        *{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
    </style>
    <a href=//www.google.com/><span id=logo aria-label=Google></span></a>
    <p><b>404.</b> <ins>That’s an error.</ins>
    <p>The requested URL <code>/1.1</code> was not found on this server.  <ins>That’s all we know.</ins>

Posted on | Edited on |

TL;DR

  1. yarn why contextify
  2. Remove/Update the result dependency from step 1. by modify package.json.
  3. npm install

Full scenario

Today I encounter an error when npm install, the error look like this : 

1
2
3
4
error M:\Github\asing1001.github.io\node_modules\contextify: Command failed.
...
...
..\src\contextify.cc(150): error C2039: 'SetAccessCheckCallbacks': is not a member of 'v8::ObjectTemplate'

This is caused by the package contextify too old, to find out which package dependent on contextify, I use yarn why contextify in command prompt :

1
2
3
4
5
6
7
8
M:\Github\asing1001.github.io> yarn why contextify
yarn why v0.22.0
[1/4] Why do we have the module "contextify"...?
[2/4] Initialising dependency graph...
[3/4] Finding dependency...
[4/4] Calculating file sizes...
info This module exists because "hexo-migrator-blogger#to-markdown#jsdom" depends on it.
Done in 2.30s.

Obviously it is refenrence by dependency hexo-migrator-blogger, I update package.json to remove this package and npm install again, it is fixed :)

Posted on | Edited on |

Before start

To enable Gitlab-CI, you need to install runners, it is an external service to help build your project. Make sure network between Gitlab server and runner is accessible.

Install

  1. Download gitlab-runner.exe to a folder, ex:C:\GitLab-Runner

  2. Run Command prompt(Administrator):

    1
    gitlab-runner.exe register

  3. Enter URL and token from Project > settings > CI/CD > Runners settings, choose executor as shell.

  4. After register succeed, run

    1
    2
    gitlab-runner install
    gitlab-runner start

  5. Go to Project > settings > CI/CD > Runners settings again, you should find your runner here

  6. Start using the runner by creating first .gitlab-ci.yml in your project root folder

Update

  1. Stop service:

    1
    2
    cd C:\GitLab-Runner
    gitlab-runner stop

  2. Download the newest binary and replace current gitlab-runner.exe.

  3. Start service:

    1
    gitlab-runner start

Uninstall

Command prompt (Administrator):

1
2
3
4
5
cd C:\GitLab-Runner
gitlab-runner stop
gitlab-runner uninstall
cd ..
rmdir /s GitLab-Runner

Reference

https://docs.gitlab.com/runner/

Posted on | Edited on |

To create same environment in python, you must know requirements.txt, it includes packages dependencies and let you install by a single command, a requirements.txt looks like this :

1
2
3
beautifulsoup4==4.6.0
certifi==2018.1.18
chardet==3.0.4

To generate requirements.txt

1
2
3
4
5
6
# Without using virtual environment
pip install pipreqs
pipreqs /path/to/project

# With virtual environment
pip freeze > requirements.txt

Install packages from requirements.txt :

1
pip install -r requirements.txt

pip install bypass SSL certificate :

1
2
3
4
pip install --trusted-host pypi.python.org <package_name>

# Combine with requirements.txt
pip install --trusted-host pypi.python.org -r requirements.txt

Reference

https://github.com/bndr/pipreqs
pip install --help is your friend.

Posted on | Edited on |

Directly copy db from ip :

1
2
3
mongo <ip>
use admin
db.runCommand({copydb:1, fromdb:"<DB Name>", todb:"<DB Name>", fromhost:"<DB HOST IP>"})

Export / Restore DB

1
2
3
4
5
6
# Export
mongodump --db <dbname>

# Restore
mongorestore --port <port number> <path to backup folder>
# e.g. mongorestore --port 27017 X:\dump

Note :

  1. Run commands in administrator mode
  2. If commands not found, excute commands under mongodb bin folder, windows default path : C:\Program Files\MongoDB\Server\3.2\bin\

Reference :

https://docs.mongodb.com/manual/tutorial/backup-and-restore-tools/

Posted on | Edited on |
  • ctrl + alt + / : Show Keyboard Shortcut
  • ctrl + 口|| : Screenshot
  • ctrl + shift + 口|| : Screenshot region
  • ctrl + shift + i : Open developer tools
  • alt + search : Toggle Caps Lock
  • alt + shift + m : Open file manager
  • ctrl + space : Change input method
  • shift + esc : Open task manager
  • ctrl + alt + t : Open terminal
  • search + button between esc and power : F1~F10

Posted on | Edited on |

Recently I found that AWS Cloud9 is so good that help me coding in my chromebook.
Here I want to share how I use it with my nodejs project, it is free, fast and easy.

  1. Go to https://aws.amazon.com/tw/cloud9/
  2. Click Create environment and choose your preference
  3. Wait seconds to see your cloud9 IDE
  4. To switch keyboard setting, go to Edit > Keyboard mode > Sublime Vim Emac

  5. Setup nodejs developement environment via terminal

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    # Clone repo 
    git clone repo

    # Switch node version
    nvm install --lts

    # Use new version
    nvm use stable

    # Install yarn
    sudo npm install -g yarn

    # Install package
    yarn

    # Start application
    npm start

  6. To browse application webpage, go to Preview > Preview Running Application