NextJS: 05-10 Remark Prism
Hướng dẫn highlight code cho remark code-block với plugin của remark mang tên remark-prism.
Remark Prism: https://github.com/sergioramos/remark...
Choose CSS for style markdown result at https://prismjs.com/download.html
Line numbers: https://prismjs.com/plugins/line-numb...
Code highlight: https://prismjs.com/plugins/line-high...
———
#nextjs
#remark_prism
#nextjs_tutorial
———
VIDEO CHAPTERS:
Made by: Sinh Bùi Đình
Cảm ơn bạn nhiều nhé! ❤️
00:10 Introduce format code by remark-prism
00:50 Try to apply some basic from document https://github.com/sergioramos/remark...
03:50 Analyze why code not formatted & how remark-prism work.
05:45 Choose CSS for style markdown result at https://prismjs.com/download.html
07:10 Introduce some plugin of prismjs
08:40 Import CSS global in __app.tsx
09:50 Add line number into md to check. See more at https://prismjs.com/plugins/line-numb...
12:35 Use line number format plugin supported by remark-prism & Restrictions on use
14:00 Use format by plugin by import js
16:00 highlight example, look more at: https://prismjs.com/plugins/line-high...
17:30 Summary
———
Easy Frontend - Code xịn hơn mỗi ngày
🔥 Khoá học Javascript: https://course.ezfrontend.com/javascript
🎁 Khoá học ReactJS: https://course.ezfrontend.com/reactjs
🎯 Fan cứng Easy Frontend: / @easyfrontend
———
💰 Ủng hộ mình làm videos thì đóng góp qua MoMo/ZaloPay: 0901 309 729 nhé
———
Kết nối với mình:
✅ Follow facebook: / nvhauesmn
🎉 Fan page: / learn.easyfrontend
❓ Group: / easyfrontend
💻 Github: https://github.com/paulnguyen-mn
💼 LinkedIn: / haunguyenmn