[Viblo] Cho em hỏi viblo dùng markdown editor nào vậy ạ?
Cho phép em hỏi vi blo đang dùng markdown editor nào vậy ạ? làm sao để có thể thêm dc những tag mới như là:
- Youtube embed {@youtube: Youtube ID or URL}
- Vimeo embed {@vimeo: Vimeo ID or URL}
- Slideshare embed {@slideshare: Slideshare ID or URL}
- Google Slides embed {@googleslide: Public Google Slides URL}
- Codepen embed {@codepen: Codepen ID or URL}
- Gist embed {@gist: Gist ID or URL}
Rất mong mọi người giúp đỡ ạ. Em cảm ơn cả nhà nhiều lắm ạ!!!! :man_gesturing_ok_tone1:
1 CÂU TRẢ LỜI
Xin chào bạn.
thực hiện việc render Markdown bằng Javascript, sử dụng open source Remarkable. Bạn có thể check demo của Remarkable tại đây
Để có thể thêm các cú pháp đặc biệt, với mục đích support thêm rich contents, Viblo có sử dụng remarkable-embed
Hy vọng câu trả lời có thể giúp ích được cho bạn
Em cảm ơn @VibloTeam nhiều ạ
Em đã check và vẫn chưa biết cách install và conf sao cho render hiển thị được hết ạ.. Mong Viblo team giúp đỡ ạ.
@minhtuancnttk39 Ý bạn là bạn chưa install, và sử dụng được được package Remarkable với remarkable-embed à? Cụ thể bạn đang gặp vướng mắc ở bước nào, và có lỗi gì nhỉ?
Dạ, khi e vào documentation của Remarkable thì hiển thị là import ...
import Remarkable from 'remarkable';
import { Plugin as Embed, extensions } from 'remarkable-embed';
const md = new Remarkable()
const embed = new Embed()
embed.register('youtube', extensions.youtube)
md.use(embed.hook)
md.render('This vid is gr8 m8 {@youtube: dQw4w9WgXcQ}')
// Output: '<p>This vid is gr8 m8 </p><iframe type="text/html" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0"></iframe>'
Như thế, mình phải code đoạn đó như thế nào ạ...
E chưa quen với những plugin như thế này...
Em cám ơn Viblo team
@minhtuancnttk39 À đoạn code trên là dùng cú pháp ES6
bạn ạ, xong bạn cần một công cụ bundler, ví dụ như webpack, hay gulp, để transform từ ES6 về ES5 để có thể chạy được trên các trình duyệt cũ hơn.
Viblo's Javascript SDK thì được viết bằng Typescript, xong cũng cần phải chạy webpack để transform codes.
Nếu bạn chưa quen với mấy khái niệm này thì có thể bắt đầu tìm hiểu bằng:
- Javascript ES6 https://viblo.asia/p/ecmascript-es6-la-gi-overview-es6-gAm5y9RA5db
- Typescript https://viblo.asia/p/tim-hieu-typescript-va-kien-thuc-co-ban-PmeRQpnyGoB
- Webpack: https://viblo.asia/p/hoc-webpack-co-ban-trong-15-phut-ByEZkLaolQ0
và còn rất nhiều các bài viết khác về các chủ đề này trên Viblo, bạn có thể tìm và tham khảo qua nhé
@VibloTeam Có cách nào để có thể sử dụng Remarkable và remarkable-embed trong ứng dụng rails không ạ ?
@huuhung96 Remarkable
và remarkable-embed
thì đều là những package javascript thôi, nên bạn có thể dùng ở bất kỳ ứng dụng nào, PHP, Rails, hay Nodejs cũng được mà
Có điều nó sẽ thực hiện việc render Markdown ở phía client (bằng Javascript), nên nếu bạn muốn render Markdown ở phía server (để tối ưu hoá cho SEO chẳng hạn), thì bạn cần làm cả Server Side Rendering nữa.
anh @thangtd90 ơi có thể trả lời giúp em được ko ạ