JavaScript

Learn JavaScript
Learn JavaScript

Easily learn JavaScript in 10 minutes!

2023-10-24

ESLint Auto Fix via CLI

最近有時間執返好D code 開始set 返好D ESLint 發現 update 左 eslint config後.. 有很多files 要fix 如果有command / function 可以一次過scan and fix 曬便好 解決方法 我們只需要在 CLI 上執行這個 eslint command 便可 npx eslint --fix --ext .js . 同埋可以在 package.json 的 script 上加多一個command 就會更放便

2023-02-08

NextJs - How to change port

最近想 Upgrade 現有的 NextJs Project 所以諗住用 npx create-next-app@latest 來建立一個新的 project 來做 migration 問題出現了… NextJs 的 default port 是 3000 那麼怎樣可以更改其中一個project 的 starting port 呢? 解決方法 我們只需要更新 package.json 上的 dev script 加 -p [PORT_NUMBER] 便可

2023-02-05

NodeJs - SyntaxError Cannot use import statement outside a module

嘗試起個新既 NodeJs project 用 import rather than require 時出現以下 Exception.. SyntaxError: Cannot use import statement outside a module 解決方法: 原來只要係 package.json 上 加返以下 property 便可.. "type": "module", hope you find it useful

2023-02-03

Upgrade ReactJS - module build failed - Cannot find module 'js-levenshtein'

用了 ReactJS 一段時間…想看看有沒有更新可以使用.. 希望可以使用 yarn upgrade 來更新… 但是更新了 package.json 的 dependencies 之後便出現了很多webpack 的 error 最後到了create-react-app page 的 CHANGELOG.md …跟著他的 migration guide 便可以更新到了… 原來解決方法十分簡單… 我們只需要跟著 mirgration guide 的 command 來更新 react-script 便可以 e.g.

2020-05-03

redux - uncaught TypeError: Cannot read property 'apply' of undefined(…)

剛剛在寫 reactjs publish 上去 Firebase 之後出現了以一的 error message `` 之後便顯示唔到這個 react page 了 做了一會 research 之後發現應該是 redux compose 既問題 解決方法: 我改了之前的 const store = createStore( reducers, initialState, compose( applyMiddleware(...middleware), window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() ) ); 改成這樣便可以了 const store = createStore( reducers, initialState, compose( applyMiddleware(...middleware), window.REDUX_DEVTOOLS_EXTENSION ? window.REDUX_DEVTOOLS_EXTENSION() : (f) => f ) ); Hope you find it useful

2020-05-02

JS format JSON

如何用 Javascript format JSON 解決方法: 我們可以使用JSON.stringify 來 format e.g. var c = {a : "test", b:{ data: "asdada"}} JSON.stringify(c, null, 4) "{ "a": "test", "b": { "data": "asdada" } }" Hope you find it useful

2019-11-23

Useful Heroku command

最近又多用了 Heroku 無左 Microsoft Azure 既 subscription 又怕佢 charge 貴 用 free tier 時發現好似好多野都要收錢咁 剛剛 deploy 了一個 NodeJS project 時 Load 唔起.. 又唔知可以點睇 log. 由於同一隻 App 都是放在 githu 月 Login heroku login List Application

2019-11-22

How to get distinct values from an array of objects in JavaScript

今日有個 task 其中一個地方要在 Array of Json object 中 Distinct 一個 property const data = [ { id: 1, category: 'fruit', name: 'Apple', }, { id: 2, category: 'fruit', name: 'Banana', }, { id: 3, category: 'herb', name: 'Basil', }, { id: 4, category: 'herb', name: 'Rosemary', }, { id: 5, category: 'fruit', name: 'Dragon Fruit', }, ]; 解決方法: (ES5)

2019-06-25

Firebase ReactJs routing issue - Page not found

使用 firebase hosting 來 host reactjs 既時候 出現了以下問題 當我直接在 browser 輸入 ReactJs 的 route 既時候 出現了 Page Not Found This file does not exist and there was no index.html found in the current directory or 404.html in the root directory firebase page not found

2019-06-25