Next.js
Create Project bash npx create-next-app@latest my-app --ts --eslint --src-dir --import-alias '@/' --use-[npm|pnpm|yarn] --yes
[Not Finished] Setup Storybook with Vitest in a project created by Next.js
Initialize storybook with a command: bash pnpm create storybook@latest After finishing setup & config, install vitest and
Running Storybook Stories contains Hooks of Next.js
I created a storybook story contains UI components which used useNavigation from Next.js inside. When I run storybook instance, it display error page instead: …
React
- next-js - react-intersection-observer
Fixing "husky" can not run git hooks (node installed by "nvm")
Part of dotfiles Add file ~/.config/husky/init.sh bash export NVMDIR="$HOME/.nvm" [ -s "$NVMDIR/nvm.sh" ] && \. "$NVMDIR/nvm.sh"
Infinite Scroll Company Logo Carousel (Using CSS Only)
First, Create the two container like this html <div id='container'> <div id='img-wrapper'> <!-- content --> </div> </div> And insert the logos html <…
Intersection Observer in React
Mostly, I use IntersectionObserver to check whether the element is in the viewpoint (the view which is currently display on the browser) jsx import { useE…
Barcode & QR Code Libraries in JS
- [qrcode](https://www.npmjs.com/package/qrcode) - [jsbarcode](https://github.com/lindell/JsBarcode)
CSS vars to TS vars
Code following make javascript and Typescript file declaration to store design tokens callable in Frontend Project Code generated by ChatGPT. I didn't check …