Portfolio Website & tech blog of Bharathi Kannan Live at https://www.bharathikannan.com/
Please refer to Projects
npm install
npm run dev
Windows:
Run ipconfig
and get the ipaddress of your localhost
MAC:
Run ifconfig
and get the ipaddress of your localhost
Open that address on the mobile with the same portnumber.
Ex: 192.168.1.9:3001
npm run analyze
- This will generate server and client bundle overviews.
If we want to dive deeper into each bundle, use the following technique with source-map-explorer
Enable productionBrowserSourceMaps: true
in next.config.js
Next Source Maps
and then npm run build
then run the source-map-explorer command
Then navigate to ./next/static/chunks/pages/
directory and run the following command
source-map-explorer <chunk_name>.js
Make sure you have installed source-map-explorer:
npm install -g source-map-explorer
More details on Bundle Sizes, Next Build output and, etc. can be found in this PR - Replace Chakra with Tailwind
Sitemap file gets updated automatically by this awesome package - next-sitemap
npm run build
would be executed during deployment.postbuild
script would be executed, which updates sitemaps.Its tricky to generate screenshots when tests are running in Github actions.
To update screenshots for blog posts in CI (Github actions), we need to build the screenshots via docker in local.
๐ Check this PR for instructions on first time set up.
Run npx playwright test --update-snapshots
, it will generate new screenshot files for -darwin.png
docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.33.0-jammy /bin/bash
.
rm -rf node_modules
- Deletes node_modules
npm install
npx playwright install --with-deps
- Reinstall playwright dependenciesnpx playwright test --update-snapshots
- Runs and updates screenshots
-linux.png
).exit
[!NOTE] The downside of this approach is, after updating linux screenshots, on local we again need to remove
node_modules
and do freshnpm install
for running the app.
Method 1: npx npm-check
Method 2: npx depcheck
Ran this script after removing chakra
npm uninstall @chakra-ui/icons @chakra-ui/react @emotion/react @emotion/styled classnames framer-motion lucide-react --save
Eslint, Prettier Configs provided by Arpit Bharti