I am working on a tutorial website using MERN, whereon I will be displaying tutorials on pretty much anything I know well, and new things that I learn. The backend and frontend work fine. I just don't know what to do with regards to the tutorial's body in the submission form. The kind of tutorials that I want to add will have a combination of images, specially highlighted text(i.e. code examples), and text. So, I was thinking maybe I can upload all that as a word document and have it be parsed before it is saved in the database. Is this the way to go? Are there useful libraries that can make this easier to handle?
I suspect you'll like markdown.
Markdown is a simple markup language where you enter plain old text but can render the text with styles. There are many libraries (especially for react and node) that will convert your markdown to html, and it can be easily extended to style code snippets, images, and even react components.
Related
I am writing documentation that has steps for Windows, Mac, Linux.
I want to make it look like this HTML5 tabbed HTML5 example
there is support for HTML in gitlab markdown
There is a reference to a sanitation class that validates the inline HTML in gitlab marrkdown
My question is:
Recommendations to achieve the tabbed documentation. Is there a workaround for displaying CSS correctly in markdown?
how to make this work?
Simply insert the relevant HTML/CSS/JS into your Markdown document.
As Markdown's Syntax Rules state (emphasis in original):
Markdown's syntax is intended for one purpose: to be used as a format
for writing for the web.
Markdown is not a replacement for HTML, or even close to it. Its
syntax is very small, corresponding only to a very small subset of
HTML tags. The idea is not to create a syntax that makes it easier
to insert HTML tags. In my opinion, HTML tags are already easy to
insert. The idea for Markdown is to make it easy to read, write, and
edit prose. HTML is a publishing format; Markdown is a writing
format. Thus, Markdown's formatting syntax only addresses issues that
can be conveyed in plain text.
For any markup that is not covered by Markdown's syntax, you simply
use HTML itself. There's no need to preface it or delimit it to
indicate that you're switching from Markdown to HTML; you just use
the tags.
The only restrictions are that block-level HTML elements -- e.g. <div>,
<table>, <pre>, <p>, etc. -- must be separated from surrounding
content by blank lines, and the start and end tags of the block should
not be indented with tabs or spaces. Markdown is smart enough not
to add extra (unwanted) <p> tags around HTML block-level tags.
However, there is one down side to this:
Note that Markdown formatting syntax is not processed within block-level
HTML tags. E.g., you can't use Markdown-style *emphasis* inside an
HTML block.
Finally, there is the concern that you appear to looking to have this document hosted on a third party site (perhaps in a readme on Gitlab). Most third party sites who process and host Markdown documents (including Gitlab) run the output through an HTML sanitizer for security reasons (to avoid XSS attaches, etc). Therefore, you are likely to find that various required hooks in your HTML will be stripped out and it won't work. Of course, this won't be a problem on your own site where you have total control.
The solution was tried in readme.rd from the text processor used by Microsoft VsCode and commited to gitlab. In the attached picture there is the rendering. It was not as expected. Perhaps the functionality to have tabs will be available soon.
An alternative is "collapsible sections" in GitLab Flavored Markdown. Link to documentation: link
I'm using Arabic language while designing my website and I want to wrap lines like it displays in Microsoft word (in that there is no line wider/smaller than another)
http://c.top4top.net/p_432s7e8u0.png
Without any example of your code, it's hard to say based on your personal situation but you may be looking for the following CSS property:
word-wrap: break-word
This should wrap your text in an element where this property is applied.
See the following link from W3Schools.
https://www.w3schools.com/cssref/css3_pr_word-wrap.asp
If this isn't what you're looking for, post an example of your code and we can try again!! :)
I'm not too sure whether you're talking about your actual website content or your IDE / Developer Tool. I'd assume the latter as you're talking about javascript and css (which the user wouldn't see on the page) but hey, here's a reference to how to show users it like that (on a website) anyway
"how do you change spacing of words to fit the whole line?"
https://www.cnet.com/forums/discussions/how-do-you-change-spacing-of-words-to-fit-the-whole-line-248002/
For line wrap, I suggest Googling "line wrap " + the tool you're using
For justify, it's likely not supported in the tool you're using, but you can still throw an attempt at Googling "justify text in " + the tool you're using
Note: I'd give more information, but your question lacks detail
I've recently began coding for my degree and for a project I am submitting it via a pdf created in Jupyter so that my code can be seen. It all works within Jupyter but when I export to PDF the image that I have embedded in markdown doesn't load. All that loads in Microsoft edge is a small black box with a white cross in and in chrome there is a small image of mountains in two pieces. I am not sure where I'm going wrong. My image is written in like this:
<img src="files/masterbiaspic.png" />
And I don't know how to fix it.
I really don't have a wide knowledge of code so please be simple with your answers.
Kind regards and happy new year,
E
You appear to be using raw HTML to insert your images into your document. What you may not know is that most Markdown parsers do not look at the contents of raw HTML, they simply pass it through unaltered. However, raw HTML is not understood by the PDF file format, and in fact, when converting to PDF, there is no clean way to convert raw HTML to PDF without also parsing the HTML (which is beyond the scope of Markdown parsers). Therefore, if you want to output to PDF, you should only use pure Markdown (without any raw HTML). That way the parser can easily convert everything to a proper format for PDF output.
As it turns out, Markdown includes its own syntax for images (see the documentation for details). Try this:
![alt text](files/masterbiaspic.png)
By doing that, Jupyter Notebook will know about the image and should import it into the PDF properly.
It could be that the above will not resolve the problem. It depends on which method is used to convert to PDF. Some tools may take the HTML output of Markdown and convert that to PDF, which would mean you have a different problem entirely.
I'm trying to render math equations from user input server side using MathJax in Node.js. I'm using a separate library (mathjs) to turn the input into LaTeX, but after spending an hour looking at the MathJax docs I'm no closer to turning the LaTeX into MathML.
I'm assuming I'd be using the mathjax package on NPM, and then use the MathJax.InputJax and MathJax.OutputJax classes to do the processing, but I've got no idea how to put everything together.
(In case anyone is wondering, I'm using a CSS file to polyfill MathML, rather than load MathJax in the browser and cause a delay while the processing happens.)
You want to use MathJax-node for this. It is set up to run MathJax server-side. There are a number of example command-line tools in the bin directory. You could also hook up a web service to handle the conversion. Tim Arnold made one available as mathjax-server on npmjs.com.
I have a problem where I need a way to display a repeating series of "images" on a computer monitor. Specifically, given a series of text files, I'd like a way to display the contents of said files on a screen in a way much like a powerpoint would.
My current thoughts are to find some tool that will take in a text file of some format, and then output an image which contains the text from the file. Then I'd put it in a directory and have some Slideshow program continuously go between the images in that directory. It's a very hacky solution, obviously.
So, does anyone know of tools that would do such a thing? Or is there a better way to do this? I've looked into the library libgd2, but it doesn't seem to support text-wrapping for images, which is something I'd need.
Thanks!
MagicPoint is a tool for displaying presentations. Presentations are written in a simple plain text file format, much like HTML.
You could easily generate the MagicPoint file automatically and then run it and display the presentation. You can also generate HTML, PS oder PDF from the presentation and display that.
Are you looking for powerpoint equivalent for linux? Openoffice??
have you tried some magic scripting with TeX?
a chain like
tex file | dvi2ps | ps2jpg > output
and define some TeX-Macros?
Showoff's pretty cool. It uses Markdown-formatted slides to create a simple little Sinatra app that you run (with showoff serve), and then view in a browser.
Docutils. See http://docutils.sourceforge.net/docs/user/slide-shows.html
The text syntax is reStructuredText
another idea:
text2gif
To complement the suggestions given by others, if you were going to write a program to do this, it would probably be more efficient to just render the text to the screen directly, rather than converting it to images first. It could probably be done using a canvas or text box component in a full-screen window on whatever window manager you are using (e.g. KDE or Gnome).
I give presentations with Opera's #media projection CSS support. On http://talks.webconverger.com/ you can find a template and an example which you can load in Opera's full screen mode and start sliding through.
So besides writing in a familiar language HTML, it's dead easy to share the slides and even get your audience to look at the slides as you're going through them.
If you are looking for something more flashy, there are tools on the Web to generate animations and what not, and again you would simply use a full screen browser to play it back to your audience.