前端優化專門站
把它k完 MDN – Web performance https://developer.mozilla.org/en-US/docs/Web/Performance Web Performance Calendar » 2024 https://www.debugbear.com/bl...
科技
讀Next.js文件
貼一些讀文件的備註心得。 Rendering: Server Components | Next.js Data Fetching : Server Components allow you to move data fetching to the server, closer to your da...
Next.js搭配的DatePicker
DatePicker | NextUI – Beautiful, fast and modern React UI Library 雖然第一個搜會搜到它，可是可以客製化的選項不多， 有可能是出來不久的關係，去它的dc問也沒有人回，實在是能看不能用啊〓〓 Flowbite – ...
學習LIFF
https://developers.line.biz/en/docs/liff/overview...
Spine相關
學習影片： https://www.youtube.com/watch?v=zZIpC9lwgPM&list=PLwGl7Ikd_6GRFo7d0uRu_fN2RIlvkxW7b 套用上spine發現有點透明的感覺，本來是以為有用了什麼濾鏡，後來想一想去檢查assetpack，才發現原來是asset...
Premiere
這裡是source monitor，按空白鍵可以開始播放，移動左右的藍方塊可以縮減範圍 （移動後要按I跟O它才會裁切）I = In , O = Out 這裡要按住Ctrl來移動影片出現的順序，不然會變成取代 要刪除中間的影片又想要影片沒有斷層，按住中間的影片 Alt + Backspace 也可以直...
Devtool教學
點＾之後這邊可以切換，Page是當前頁面...
Pixi.js 學習
網路上有人分享bit font用法 https://www.pixiplayground.com/#/edit/zx72y62OBKjx76xs49UdF 來源： https://discord.com/channels/734147990985375826/734150275467706510/1...
Enable Node.js
...
Learning XState
這邊的紅字就是Event To read: XState v5 is here | Stately...
給予寬度，算出圖片等比例高度
Here’s a simple JavaScript example to calculate the proportional height of an image when you set a fixed width: function calculateProportionalHe...
等比例縮放的圖
The goal is to make the sprite fit the width of the screen while keeping its proportions (aspect ratio) the same. To do this, we use the formula: this...
copy JSON way
structuredClone() global function – Web APIs | MDN (mozilla.org) https://t.me/c/1309855268/102160/142440...
tauri有時候build不成功
原來是打包後的檔案，系統刪不掉？ 要用sudo再刪一次，就可以成功打包惹 單純rm -rf 不行...
JS Quiz
Question: What is the result of 10,2 ; in JavaScript? When you write 10,2; in JavaScript, this is using the comma operator. The comma operator evaluat...
重構書閱讀心得
正在看重構的書，寫一下條例重點…（本文持續更新） 面對很混亂不好加功能的程式，首先先改成好加功能，後來再加功能 如果程式不需要維護了，就放著不管它 重構前需要先有測試 重構一小段程式就跑測試，才不會到時候有問題不知道要改哪裡。 把一個大的switch case抽出來獨立成一個function，叫Ex...
debug in app browser
https://www.browserstack.com 這實在太貴了，還是年繳的，買不下去 只好繼續查要怎麼debug 後來發現safari debug功能要開，然後要裝Xcode來模擬，也要裝這個git repo，這下面這個 點第二個比較新，支援新的Xcode 後來發現用這程式，判斷是fb瀏覽器...
各種圖形線條
Using Lines and Curves in Design Projects | Design Shack...
如果想要花俏一點的terminal
https://t.me/c/1309855268/102154/266686...
localhost變https
安裝brew之後，參考這篇文章 Use HTTPS for local development | Articles | web.dev 在package.json的start加這行就有https惹 HTTPS=true SSL_CRT_FILE=~/localhost.pem SSL_KEY_FI...
macOS必備
Homebrew — The Missing Package Manager for macOS (or Linux)...
mac設定
記得要用一條線把手機跟電腦連起來！！不要插錯洞了！！插到充電的沒有用！！！！ 一插上去在Safari馬上就可以看到惹啦！！！！！！！！！ 更新： 最重要的是要打開Air Drop，好像要Sign in with Apple才能打開 一打開馬上就能看到這個驚喜的咚咚 將safari設定成打dev to...
iphone連windows
把iphone用USB插入Windows電腦...
windows => mac 鍵盤設定
透過「啟動切換」在 Windows 中使用 Apple 鍵盤 – Apple 支援 (台灣) 不能打波浪符號： 原來是要點這個…然後要點擊shift旁邊的鍵（例如我的外接鍵盤的左邊的shift的右邊是ｚ，右邊的shift的左邊是？符號鍵… 我本來以為那是空白鍵或特殊鍵，看不懂操作說明～ ...
Webstorm
同時編輯一樣的字 Edit Text in Multiple Places at Once 使用快捷鍵 alt + J (windows) 選中就可以一起編輯...
RPG game
LunaGoodnight/honey-play (github.com) pixel art 編輯軟體： Aseprite – Animated sprite editor & pixel art tool Pizza RPG Part 7 – Walls & Collis...
runtime
JavaScript Engine and Runtime Explained...
找開發工作的網站
indeed CakeResume yourator Meet.jobs Linkedin...
前端面試集錦
列出一些前端面試題目 What is the difference between left in CSS and transform in CSS? Answer: The left property and the transform property in CSS both deal with...
React.js + .NET Chatroom
上傳FTP的時候一定要先關掉site, restart pool再上傳，然後檢查有沒有傳輸成功 本來開chrome會擋 https://localhost:7176/ 的API，直接在網址列輸入這個網址，它讓進去，重整之後就可以打了。 要更新DB也很簡單，打EF的指令就好 加TAG： dotnet ...