- Remark Prism: https://github.com/sergioramos/remark-prism
- Choose CSS for style markdown result at https://prismjs.com/download.html
- Line numbers: https://prismjs.com/plugins/line-numbers/
- Code highlight: https://prismjs.com/plugins/line-highlight/
———
#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-prism
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-numbers/
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-highlight/
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: https://www.youtube.com/channel/UCG2ovypNCpVOTFeY1YCocmQ/join
———
💰 Ủ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: https://www.facebook.com/nvhauesmn/
- 🎉 Fan page: https://www.facebook.com/learn.easyfrontend
- ❓ Group: https://www.facebook.com/groups/easyfrontend
- 💻 Github: https://github.com/paulnguyen-mn
- 💼 LinkedIn: https://www.linkedin.com/in/haunguyenmn/