JSON.stringify() And JSON.parse()
...
文章 - 第 30 頁
有興趣想買的課
...
上傳圖片
純html＋JavaScript的圖片上傳功能很簡單，可以看這篇 How To Display Uploaded Image In Html Using Javascript ? 可是假設又有「拖曳上傳」需求的話，這篇就沒辦法滿足，所以用套件先擋擋...
react-select 小教學
react-select import React, { Component } from 'react' import Select from 'react-select' const options = [ { value: 'chocolate', label: 'Chocolate' }, ...
stackoverflow && github 問問題扣比句子貼上
Same problem here. Same here....
手工皂心得
正宗敘利亞 Najel 月桂油12% 阿勒坡手工古皂 180g (±10g) 姆，覺得洗了身體油油的不太好沖...
peerDependencies, devDependencies, dependencies
dependencies 跑這個程式需要的套件 devDependencies 開發的時候需要的套件，例如Jest之類的測試工具，但是執行的時候不需要（例如babel） peerDependencies 告訴安裝這個套件的人，需要自己安裝什麼套件 --save-dev 存到devDependenci...
安裝套件
npm install git+https://git….....
npm 套件製作
6/16的時候開始研究怎麼做npm套件，爬了一些文章，發現網路很多文章沒有交代很多 細節，需要爬很多文章才知道怎麼做。 在babel編譯的過程中也蠻多問題的 如果使用create-react-app的話，babel的config這樣設定就好 "babel": { "presets": [ [ "re...
How to clean npm cache
Just paste it: npm cache clean -- force...
How to Update npm Packages to their Latest Version
delete the package key/value in package.json reinstall it !...
webstorm React snippets
為了開發方便還是記一下好了！...
flex 必讀文章
A Complete Guide to Flexbox | CSS-Tricks A Visual Guide to CSS3 Flexbox Properties ― Scotch.io Flexy Boxes — CSS flexbox playground and code generatio...
react 視覺化工具
https://github.com/react-component/spider...
promise
promise是一個根據你給的callback function回傳的物件 ．callback在目前的promise沒跑完前，絕對不會執行 ．在then()裡的callback，不管promise有沒有成功，絕對會執行 參考文章： Using Promises...
react 不錯用的咚咚
react-spring/react-spring...
slick react jest
在react裡使用slick.js雖然簡單又方便，可是加入Jest snapshot test就錯誤百出了，亂試了一下解決方法。第一個錯誤解決了之後又有其它的錯誤。 第一個錯誤可以從issue看到有人也有一樣問題 Testing with Jest causes error #472 Jest te...
Jest手把手教學
首先開啟一個資料夾，乃做做Jest的測試。 mkdir jest-try 開啟好資料夾，在裡面開新專案 npm init -y 接下來就可以安裝Jest yarn add --dev jest 安裝好之後要幹麻？寫一個JavaScript檔案囉！ 開一個檔案叫 double.js function ...
storybook
利用storybook可以更直觀的知道元件在各種UI互動狀態下應該怎麼呈現！ 下面的那些就是stories啦！ 下面這三個就是它的test cases title（螢光筆劃線的地方）不能重複 title在這裡定義(export default是寫metadata的地方) Task.stories.j...
JavaScript需定期複習的觀念
什麼是deep copy、shallow copy ？ call、apple的原理及使用 Function.prototype.call() Promise...
JavaScript 字串轉成數字
parseInt() parseFloat() Number()...
英文句句背
Both ways work. 兩個方法都行。...
JavaScript var v.s let
const arr1 = []; for(var i = 0; i < 3; ++i) { arr1.push(() => i); } const arr2 = arr1.map(x => x()); const arr3 = []; for(let i = 0; i < 3; ++i) { arr...
2020面試心得
《華奧科技有限公司》 一開始先簡單的自我介紹一下，我覺得我在講工作的部份應該再講仔細一點， 例如前幾年比較多工作在切版、做特效，用jQuery維護網站， 這幾年用的是前端框架，學習它的ecosystem，也會不時上網查看新知 應該說明一下我除了工作之外還會多上網看有出什麼新東西… 1. React....
react-addons-update
react-addons-update 這個套件legacy嘍，要做新專案可以改用 immutability-helper 可以解決深淺拷𢭲的問題，這本書有寫一個應用例子： ReactJS by Example – Building Modern Web Applications wi...
deep copy & shallow copy
A deep copy means that all of the values of the new variable are copied and disconnected from the original variable. A shallow copy means that certain...
moment.js
const yes = moment().subtract(3, 'days').startOf('day'); const no = moment().subtract(1, 'days').endOf('day'); 最後面沒加 .format() 的話，出來的是物件，想要有字串或時間，要加上 ...
telegram 機器人使用
@Customize_Captcha_Bot 自訂型入群驗證 加入群組之後，記得輸入 /switch 機器人才會切換到你目前的群組 接下來新增問題，在機器人那邊打 / new 1.先輸入問題： 你是什麼？ 2.輸入選項： 天才 白痴 3.輸入答案: 白痴...
Test React
https://codepen.io/Tingmeow/pen/OJyyMmw?editors=0011 今天測試React，發現點擊事件，越裡面的越先觸發！...
react
Uncaught RangeError: Maximum call stack size exceeded...