仿¥ã¯ãæ·±å€åŠç¿ããšç§°ããŠeasy-notion-blogã®lintãtestã«ã€ããŠãã£ãã¹ãããšå€ãªå€ãªããåãããªããçè§£ãæ·±ããå 容ãç§ãªãã«æŽçãããŠãã®èšäºã«ãŸãšããŠã¿ãããšæããŸãã
â» ã¹ã¬äž»ã¯ãã£ãã¹ããã§ãm(_ _)m
æç« ããã¹ã¯ã·ã§ããã€ãŒãå€ãã§ãm(_ _)m
éäžéäžç¥èããŸã æµ ãéšåãããã®ã§ããïŒïŒãã£ãŠæããããšããããããããŸããã
ããããTwitterã§æããŠäžããã
é ã®æŽçãããããã«æžããªãã£ãŠã¿ãã
éçãã¹ããšã¯ãããã°ã©ã ã³ãŒããå®è¡ããã«ãããã¥ã¡ã³ãããœãŒã¹ã³ãŒããªã©ã®ãã§ãã¯ã«ãã£ãŠèª€ããè匱æ§ãæ€åºãããã¹ãææ³ã®ããšã§ãã
ä»ããèããªããåçãã¹ãããéçãã¹ãããšã¯ïŒ
https://github.com/otoyo/easy-notion-blog/pull/36
ðœÂ Add linterã®PRã§è¡ãããããšïŒ
ç¹ã«eslintã®ãã©ã°ã€ã³ã®æšå¥šèšå®ãããŠãã.eslintrc.json
ã®èšè¿°ãèŠããšESlintã§äœãããŠãã®ããåãããŸããã
ããã±ãŒãžå
ããã±ãŒãžå/æå®å
ããã±ãŒãžå/æå®å
<ïŒã€ããã«ãŒã«ã®ã¬ãã«>
å€ | æå³ | å€ |
---|---|---|
0 | ãªã | off |
1 | èŠå | warn |
2 | ãšã©ãŒ | error |
ãåèã«ãªã£ãèšäºã
next/core-web-vitals
ã£ãŠãªãã ããâŠ..Next.jsã®åºæ¬ESLintèšå®ãšããã峿 ŒãªCore Web Vitalsã«ãŒã«ã»ãããå«ãŸããŠããŸãã
ããã¯ãESLintãåããŠã»ããã¢ããããéçºè ã«æšå¥šãããæ§æã§ãã
https://nextjs.org/docs/basic-features/eslint
https://nextjs.org/docs/basic-features/eslint
ðœããããš
package.json
ã«next lintã远èšyarn lint
ã§èµ·åæ¬å®¶ã®ã³ãŒããèŠãŠã¿ããšâŠ..
https://github.com/otoyo/easy-notion-blog/commit/8423f4dd2a11cda131ab3434c38552fb7e45fb9b
ãããå®ã¯easy-notion-blogãªããžããªãå§ãã«commitãããæããååšããŠããããã§ã ð±
ãã©ãŒããããä¿®æ£ããŠãããpretterãåãææã«ååšããŠããããšãä»ã«ãªã£ãŠç¥ããŸããâŠ.ã
PRããæã«ïŒã€ãã§ãã¯é ç®ããã£ãŠåããŠãããŠãããããã(ÂŽã»Ïã»`)
çµãããšããæ¶ãã¡ããã®ã§èŠã€ããæã«ã¹ã¯ã·ã§ã远å ããŸããããåŸ ã¡ãã ð
æ¬å®¶ã®PRã確èªãããšâŠ..
https://github.com/otoyo/easy-notion-blog/pull/37
ðœÂ GitHub actionsã®PRã§è¡ãããããšïŒ
yarn lint
ã䜿ããããšãæèšãã®PRã§ã®èŠåã»ãšã©ãŒã¡ãã»ãŒãžã«ã€ããŠã®å€æŽãèŠãŠã¿ããšâŠâŠ
ãµãŒããŒ(Node.js)ã®ç°å¢å€æ°ãšæ¬çªç°å¢ãåãããããã«ææããŠããéšåãã
GitHub Actionsã远å ããŠãã§ãã¯ããããã«å€æŽããã£ãŠããããšã¿ããã
ã·ã§ã«ã£ãŠã¿ãŒããã«ã®ãŠã£ã³ããŠã®ããšã ã£ãâŠ..
(ÂŽïŒÏïŒïœ)ãã£ãšåãã£ãâŠâŠ
é ããã¡ã€ã«ã«ãããªèšè¿°ããã£ããšã¯âŠ.
https://github.com/otoyo/easy-notion-blog/pull/37/commits/af5d7535ab7314093a886306ce36cb0793dc5e48
ããŠããããŸã§ãESLintã
æ¬é¡ã¯ããããã§ã ðïžââïž
æ¬å®¶ã®PRã確èªãããšâŠ..
https://github.com/otoyo/easy-notion-blog/pull/38
ðœÂ Setup Jestã®PRã§è¡ãããããšïŒ
yarn jest
ã§èµ·å__mocks__ãš__tests__ã¯ãŠããããã¹ãé¢é£ã®ããŒã¿ãªã®ã§ãä»»ãããã°ããð¯
https://nextjs.org/docs/testing
jest以å€ã«installããã©ã€ãã©ãªã«ã€ããŠèª¿ã¹ãŠã¿ããšâŠ.
https://testing-library.com/docs/react-testing-library/intro/
React Testing Libraryã¯ãDOM Testing Libraryã®äžã«ãReactã³ã³ããŒãã³ããæäœããããã®APIã远å ããŠæ§ç¯ãããŠããŸãã
https://testing-library.com/docs/ecosystem-jest-dom/
jest-domã¯ãã¹ãã£ã³ã°ã©ã€ãã©ãªã«ãšã£ãŠé£ãã®ãããªã©ã€ãã©ãªã§ãã(ãžãæèš³)
Jestçšã®ã«ã¹ã¿ã DOMèŠçŽ é©åãæäŸããŸãã
https://nextjs.org/docs/testing#setting-up-jest-with-the-rust-compiler
æ¬å®¶ãèŠãŠã¿ããšâŠ..
https://github.com/otoyo/easy-notion-blog/pull/38/commits/06f926fccc6de0b5b751d583b8198cbb3ab00942
åãã ãããã(^o^)ïŒ
ä»åã¯NODE_ENVãæå®ããŠããªã
確ãã«ã©ãã«ããªãã
testç°å¢ãªã®ã§.env.localã¯èªã¿èŸŒãŸããªã
å ã«exportããŠããNEXT_PUBLIC_URL ããã¹ãã®æã䜿ããã
ã¢ã«ãã«å çã®ãã€ãŒãã®ããããïŒ
ä»å㯠NODE_ENV ãæå®ããŠããªãã®ã§ãã®ããã©ã«ãå€ã䜿ãããŸãã
test ç°å¢ãªã®ã§ .env.local ã¯èªã¿èŸŒãŸããããŸã .env.test ããªãã£ãã®ã§èªã¿èŸŒãŸããŸããã§ãããããããã£ãã¹ããã®å Žåã¯å ã« export ããŠãã NEXT_PUBLIC_URL ããã¹ãã®éã«ã䜿ããããšããããšã ãšæããŸãã
ããã©ã«ãã䜿ãããäºå®ã ã£ãâŠ.
ð
testç°å¢ã§ã¯äœãèªã¿èŸŒãŸããäºå®ã¯ãªãã£ãâŠ..
ð
ã§ãåªå é äœã®é«ãç°å¢å€æ°ãèªã¿èŸŒãã§ããŸã£ã
ð
testã§äœ¿ããã
https://github.com/otoyo/easy-notion-blog/pull/2/commits/2435733799b45282be0bcebb0de2cb9e730406ce
æ¬¡ã®æé ããã£ãŠã¿ãŠãã ããã
(1)Vercelã«ç»é²ããŠããNEXT_PUBLIC_URLã確èª
(2)Jest ãèµ°ãããŠããã³ã³ãœãŒã«ã§ export NEXT_PUBLIC_URL="確èªããURL" ãå®è¡
(3)åãã³ã³ãœãŒã«ã§å床 updateSnapshot ãã
(4)ã¹ãããã·ã§ããã®å·®åãã³ãããã㊠push
snapshotã¯åºåãã¹ã¯ã·ã§ããŠç¢ºèªããŠãããã£ãŠã€ã¡ãŒãž
ä»åã®åå ã¯NEXT_PUBLIC_URLã ã£ããã©ã
åå ããšã©ãŒã¡ãã»ãŒãžããæ¢ã£ãŠã
ä¿®æ£ãããâŠ.
Jestãåããäžã®ã·ã§ã«ã§yarn jest --updateSnapshot
ãããŠã
æŽæ°ãããå·®åãpushããã°OK(^o^)ïŒ
ã£ãŠããããšã ãªã£ãŠããšãåãããŸããããããããð¶
ïŒåšåã£ãŠãã®ã¹ã¬ãããé¡ããšâŠ.
ïŒçºç®ã®ã¢ã«ãã«å çã®è¿ãã§ãã解決ããŠããå 容ã§ãããããã
äœåºŠãäœåºŠãã¢ã«ãã«å çãèšèãå€ããªããã³ã¡ã³ãããŠãã ãã£ãŠããããšã«
ïŒæ¥çµã£ãŠæ°ã¥ããå¯åæ³ã«æããŠãããžãã»ãã§ãð
ãããããç¬ããæ¢ãŸããªããªããããã®ç¹°ãè¿ãã®ããåãã§ããâŠ..(ïŒã»âã»)ãããŸãã
ãã ãéçºç°å¢ãšæ¬çªç°å¢ãšã§ç°å¢å€æ°ãåãæ¿ãã£ãŠããéšåãããã«å ããŠãã¹ãç°å¢ãšããã§ãç°å¢ããç°å¢ããç°å¢ããç°å¢ãâŠâŠäœããªãã ãåãããªããªã£ãŠããŸã£ãã®ãçºç«¯ã§âŠ..(ÂŽã»Ïã»ïœ)
exportã»ã¹ãããã·ã§ããã»Lintã»Jestã»ã³ã³ãœãŒã«ã»ã·ã§ã«ãšãã£ãåèªãã®ã©ããæªããŸãŸé°å²æ°ã§çè§£ã
ãããŠä»åºŠã¯ãèµ°ãããâŠ..(;O;)(äœãèµ°ã£ãŠããããããšãªããŸããâŠ)
話ãåã¿åã£ãŠããããã§åã¿åã£ãŠããªããããšããããŠããŸã£ãŠæ¬åœã«ç³ãèš³ãªããªãšæããšåæã«ããã«ä»ãåã£ãŠããããã£ãã¹ãããã¢ã«ãã«å çã®å倧ãã«æ¹ããŠæ°ä»ããããã®ã§ããâŠ..(ÂŽã»Ïã»ïœ)(ïŒã»âã»)
ç§ãªãã«ãã®åŸèª¿ã¹ãé ã®äžãæŽçããŠãã£ãšèšäºã®ç¶æ ã«ã§ããã®ã¯ïŒé±éåŸã
åºå£ãèŠããã®ã¯å «æããã®ãã€ãŒããããã«ã±ã§ããã
å «æããããããšããããã(ÂŽïŒÏïŒïœ)
ãã®ãã€ãŒãã¯Gitã®ãšã©ãŒã調ã¹ãããã«Vercelããã¥ã¡ã³ããèŠè¿ãããæåããã£ãŠããæµãã®äžéšã®ãã€ãŒããªãã ãã©ãä»äººäºã ãšãã©ãããŠãæããç§ã®äžã§ãã£ãšçªã£ããã£ãŠããŸãããããã
( ïŸÐŽïŸ)ïŸïœ¯!
ãESLintãšJestã®èšå®ã§åãããªãã®ã£ãŠVercelããã¥ã¡ã³ãã«ããããããªãïŒïŒã
ãšæ¥ã«ç¹ãã調ã¹ãããã³ãŽã§ããã
å «æããããããããããããã
å€äŒã¿ã®å®¿é¡ããããã£ãæã§ã«ããŸãã§ãâ
ããŒã¹ãããªã
⌠ãã£ãã¹ããã®ã¹ã¬ããã§ã¯ãããã®ã®ããªãæããŸãããŸããâŠ
ä»ã«ãªã£ãŠæ°ã¥ããã®ã§ããã
ãã£ãã¹ããã®ãšã©ãŒãéã£ãŠãã§ãããã§ãããªé°å²æ°ã ã£ããšããã
ç§ã質åããŠããŸã£ããããã«ã©ãã©ãæã£ãŠãã£ãâŠ.ãšããããšã«æ·±ãåçããŠãããŸãm(_ _;)m
次åãããªãã€ãŒãã§èªåã®ã¹ã¬ãããçšæããŠããå§ããã»ããè¯ãããã§ããâŠ..ðµ
ãã£ãã¹ããã®ããã°ã§ã¯å®éã«ã©ããªããšãåå ã«ãªã£ãŠäœãããã解決ãããâŠ
ãšãã£ãå ·äœçãªéçšãå«ããŠè§£èª¬ãããèšäºãåŸæ¥æçš¿ãããŠããŸãã
åãããšãããŒãã«èšäºã«ããã®ã«åãå£ãéããšãããªã«éã£ããã®ã«ãªãã®ããšæåãããžãã»ãã§ãã
ããã°ã£ãŠã€ãã¥ãé¢çœããªãšæããŸãã(*ÂŽÏ`*)
è©±ãæ»ããŠâŠ.
ðœÂ ç¿æ¥èªåã®ã¹ã¬ããã§ã¢ã€ã¢ã€ãè§£æ¶ããŠãããŸãã
èå³ã®ããæ¹ã¯ã®ãããŠã¿ãŠãã ããããããã(âÂŽÏ`â)
ð äœè«âŠ..
ãæ·±å€åŠç¿ããšã¯âŠ.
ç§ãåæã«æãä»ããŠå é±ãããããåŠç¿ã¹ã±ãžã¥ãŒã«ãæç€ºããŠããã®ã§ããâŠ.
æ·±å€é£å ã奜ããªã®ã§é£å ãåŠç¿ã«å€ããŠããã ãã§ãã(ÂŽã»Ïã»ïœ)
ãªãããã®èœã¡çããé°å²æ°ã奜ããªãã§ããããð¶
ïŒäººãªãã ãã©å€ãªå€ãªã飯é£ã¹ã«è¡ãâŠ.ã¿ãããªã
æ·±å€é£å ã®ãããªèœã¡çããé°å²æ°ã®ãæ·±å€ããšããæå³ãããã°
ãæ·±ããããšããæå³ã«ããªãåŠç¿æéã«ã§ããããããªã£ãŠæã£ãŠæãã€ãã§äºåãã€ãŒãããŠããŸãâ
åºæ¬çã«ã¯ïŒäººã§äœæ¥äžã«ããããèšã£ããããã¯ããŒã¯æãããããæããªãã§ããã
èå³ããå 容ã§åæå»ã«æŽ»åãããŠããæ¹ããããšããããããšçµ¡ã¿ã«è¡ãããç¥ããŸããð
(ä»åããããã£ãã¹ããã ã£ãâŠwww)
ESLintãããæ¥œããã£ãã§ããããã(^o^)ïŒïŒŒ(^o^)ïŒ
ã²ã€ããããã¬ãã¥ãŒã®ãèªãããŠãããŠå¬ããã£ãã§ãð¶ð¶
Xã§ã¯ããŸãã«ããæŽæ°ã®ãç¥ãããè¡ã£ãŠããŸã
èå³ããæ¹ã¯Let'sãã©ããŒââŒããã®èšäºã«èå³ããã£ããåãã¿ã°ããé¢é£èšäºãã®ãããŠã¿ãŠã
RSSãªãŒããŒã«atomã®ãªã³ã¯ãç»é²ãããšéç¥ãè¡ããð
https://herohoro.com/atom
ãã£ãŠã¿ãŠã(*ÂŽÏ`*)(*ÂŽÏ`*)
ãã©ããŒå€§æè¿ïŒŒ(^o^)ïŒ
ãã©ããŒå€§æè¿ïŒŒ(^o^)ïŒ