Hello,
I have been trying to learn Node with Express for about a week now. So far I got the basics of how to build MVC on top of it, and using JavaScript proved easier and cleaner than I would have ever gotten with another server language (except Python, maybe). But let's get into one of my first problems and one of a few I couldn't solve myself.
I'm using the Jade templating engine and I love it. I love how simple it is to input Markdown into the template. You just say :markdown and it's there!
But then I got into a problem. It's all easy to parse and print Markdown, however how am I supposed to display a blog post, for example, that's been stored as Markdown text in the database, on screen? I tried:
each entry in posts
h1 #{entry.title}
:markdown
#{entry.text}
div#post-footer
#{entry.date}
But the # gets parsed as a Markdown header, not a Jade directive. How do I make it so I can display Markdown properly?
var md = require('marked');
res.render('template', {md: md, markdownContent: markdownContent};
then inside the template use
div!= md(markdownContent);
Related
I have little developing experience and I would really appreciate it if someone could point me in the right direction with my little project.
Basically, I have this first page where the user fills a form via radio buttons. These choices all represent pieces of texts in the database. When the form is submitted, an EJS page is rendered where these texts are merged. I've managed to make it work this far using Node, Express and MongoDB.
As the next step I'm trying to give the user the option to download the generated text as a nice looking PDF file. What would you recommend me to use?
You can use tools like node-html-pdf which takes a picture from your generated html page from EJS and print it using an headless browser.
Note : Since PhamtomJS is deprectated, node-html-pdf's too.
I'm trying to create minimalistic content management system with ckeditor using node and express as a server. I would definitely want to implement the inline editing capabilities of ckeditor, but I'm having no success in sending the data to server and finally to nosql (mongodb) database.
I would like to have multiple inline editors within a page and to save to my database them simultaneously upon a POST event. I have my editor instances in invividual divs with an attribute contenteditable="true". Editor instances launch just fine, but when I'm trying to grab the data in my controller, all I have is an empty object. I can get the data from input fields, but then I lose the inline editing features. I've tried tinkering with bodyparser, but no success. All my divs containing the editable content lay under a HTML form element.
I would be more than happy is someone could at least point me to a general direction of how to accomplish this. Sorry if I was unable to make my self clear posting this question :)
tldr; How can I parse data from HTML elements, other than input-fields and text areas, in node/express with bodyparser?
Content of non-input fields won't be posted in a form, so you can't do that. A couple options come to mind:
Use JavaScript to update hidden inputs on the page as those divs change. Updated content will be posted.
Use JavaScript to make the POST, on save grab the contents, post them to the server, and then after that make the redirect from client side.
I'm currently following this Jade tutorial https://www.youtube.com/watch?v=l5AXcXAP4r8 (I know Jade is Pug now but I'm watching jade tutorials to get familiar with it since many don't exist for pug) and at 24:25 the instructor places an 'extends filename' in the middle of his index.jade file. This works fine for him but this does not work for me when executing with pug. I get an error in my terminal saying "Declaration of template inheritance ("extends") should be the first thing in the file." Is it not possible in pug to put an extends in the middle of a file and it used to be possible with jade? Is there any way to make it possible? Thank you in advance for your help!
This is not possible with pug. The error message is fairly clear, extendsmust be the first thing in the file, it cannot be placed in the middle. Without any code (or idea of what you're trying to achieve), it is difficult to tell if you could find a workaround for this (using mixins perhaps?).
I've been trying to make blueimp-image-gallery work with Jade on my Node.js server.
I've followed the instructions and came up with this .jade page:
extends layout
block content
h1 Test
div(id='blueimp-gallery-dialog', data-show='fade', data-hide='fade')
div(class='blueimp-gallery blueimp-gallery-carousel blueimp-gallery-controls')
div(class='slides')
a(class='prev') ‹
a(class='next') ›
a(class='play-pause')
div(id='links')
a(href='http://mypage.com/1.jpg' title='Frente' data-dialog)
img(src='http://mypage.com/2.jpg' alt='Frente')
a(href='http://mypage.com/6.jpg' title='Piscina' data-dialog)
img(src='http://mypage.com/6.jpg' alt='Piscina')
a(href='http://mypage.com/0.jpg' title='Garagem' data-dialog)
img(src='http://mypage.com/0.jpg' alt='Garagem')
script(src='//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js')
script(src='//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js')
script(src='http://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js')
script(src='js/blueimp-gallery.min.js')
For some reason all I see are static links to the pictures referenced above. When I click them, instead of see the galery as the example show I get redirected to the image link itself.
Blueimp-image-gallery pages states a few requirements, but I'm not sure if I need them or how to install them.
Can you help me to make it work?
Check your javascript console to see if there are any javascript errors on the page. If there are, they should give you a place to start when looking for a fix!
I believe don't re-invent the wheel unless you absolutely have to. So I don't want to start coding away something that has already been coded, or a lot of people are contributing to it already.
I have just recently emigrated to planet Node.js (sorry php/apache), and need to put resources together to bring things up to speed with other languages.
I am using Node.js as a server listener, with Express.js as middle-ware, and jade js as a template engine.
I would like to use a TinyMCE like features but instead of the code being the usual ugly HTML markup, I would like the code to be the markdown and allow jade to do its majic. I suppose it more or less like stackoverflow edit (which I am typing in) but maybe a little more advanced UI wise.
So for instance if I click on a button B it should make the selected text bold as you would, with any WYSIWYG editors.
References:
http://nodejs.org/api/
http://expressjs.com/api.html
https://github.com/visionmedia/jade#readme-contents
http://www.tinymce.com/wiki.php
You could use any of the HTML generating WYSIWYG editors, and on "save", allow the HTML to pass to the server where you convert it to Jade syntax before storing it.
You could easily integrate this package, for example, into your Express server:
https://www.npmjs.org/package/html2jade
html2jade.convertHtml(html, {}, function (err, jade) {
// save jade to the DB
});