Is there is any way to use route function inside the front-end, something like href="<%= route("add_agent") %> instead of using href="./add_agent"
Add Agent
Edit/Delete Agent
All Admins
Add Admin
Just to let you know, I am using NodeJs (express framework) with ejs views.
Related
I'm looking to create a single node.js application that will render multiple different client websites.
We currently run one node.js application per client website, but I think this might be overkill as the serverside logic is exactly the same for all of them, the only difference being the handlebars template.
I'm looking to re-architecture to have a single node.js application which will then render the different client's websites based on some incoming information, will use nginx to add a header or something to the request so the app knows which website to render.
Is it possible to store the handlebars template within a database and then request the template at render time? Rendering a simple single page should be easy enough, but I'm struggling to understand how partials would be rendered?
Looking to achieve something similar to Shopify's Storefront Renderer, not sure if it's possible to do with handlebars or if it's better to use of of the LiquidJs ports for Node to achieve this?
https://shopify.engineering/how-shopify-reduced-storefront-response-times-rewrite
I do this with different countries, same concept as you with different Clients.
You just create the Handlebars layout and put it in your partials folder. No need to put template in your database.
Then your server logic will have eg clientName, and your Handlebars will have IfEqual tags (you'll need an IfEqual helper)
Example:
Server route will give a variable clientName.
Handlebars you have the main view page with only the IfEqual helpers.
{{#ifEqual clientName 'Client Name 1'}}
{{> client/clientName1}}
{{/ifEqual}}
{{#ifEqual clientName 'Client Name 2'}}
{{> client/clientName2}}
{{/ifEqual}}
Your helper function will be
, helpers: {
ifEqual: function(x, y, options) {
return(x == y) ? options.fn(this) : options.inverse(this)
} // {{#ifEqual statusLogin 'unconfirmed'}} {{/ifEqual}}
Search nodejs handlebar helper if you dont know how to set it.
So my partial folder, you can create a folder in it called client, and put all your Handlebars template in there. Search for nodejs handlebars partial folder setup if you dont know how to do it.
The handlebar helper function I found it I think in stack overflow, so you can search for others if you want, but for me it works.
Your partial template files just do as normal Handlebar files.
So the main idea is User loads the page, depending on what Client flag you put it, it loads up that template.
In Angular 9 is there a way to build my Angular app and then whenever the client requests the page modify it based on data sent in that request?
For example run it through an Express templating engine such as EJS or PUG (aka Jade)?
The purpose behind this is that I need to ensure that certain parts of my application are never sent to the client unless they have a specific authentication token.
Here's an example of what I want (and works) in EJS:
<div>Hello!</div>
<% if (username === "Tester") { %>
<div>This contains sensitive admin forms!</div>
<div>People shouldn't know that these exist!</div>
<% } %>
This is possible in Angular from what I understand, however either user information isn't available as it's not compiling at runtime, or it has to be processed by the client - which is a major security issue.
Is there any way to get this, or something similar to work in Angular?
I am looking for a very simple example for using Passportjs (Local api) in my MEAN application. I took a reference from one example on github. There they have used jade to render the page after authentication. But I just want to use my home.html to show home page after authentication.
I have searched many example but in all they are using either jade or ejs. I don't want to use any engine to render the home page.
If anyone can provide a very simple example just using MEAN that would be a great help.
I don't want to use jade or ejs. Just simple html to render page.
Just setup a route similar to this:
app.route("/login")
.post(passport.authenticate("local"), function (req, res) {
res.json(req.user);
});
Then call that as an post call from the function you bind the form to in angular, you don't need to use jade/pug/ejs or any of it. You can simply use express as an API server. Just have angular redirect to the route you want after the successful return of the authentication (you should get a user object back)
I am familiar with Angularjs(1.x) and use templates in directives.
Currently I am learning nodejs and as a part of the course template engines are mentioned. What are the advantages of using them on the backend?
Currently I can't see any use.
If you have data (say from a database) that needs to be rendered to HTML, you can use a template engine to take the data and a template and render it to HTML (which subsequently gets served to the client).
If your frontend app does the same, using XHR calls or something similar to retrieve the data from the server, it's generally not useful to render to HTML server side (instead, the data gets sent as JSON to the client).
So it depends on how your app (both frontend and backend) is structured if it makes sense or not to use a templating engine.
There's also hybrid solutions where the initial HTML is rendered server side, and then the client side "takes over". This is something that, for instance, React supports. The big idea there is that you can use the same components both on the server and on the client, and that when a page is opened, the user will get to see a fully rendered initial page (instead of the client side having to retrieve the data from the backend first and then rendering the page).
You actually dont need them, but they have a lot of features that makes your pages more dynamic..
For example you can render just HTML using this code
app.get('/',function(req,res){
res.sendFile(path.join(__dirname+'/index.html'));
//__dirname : It will resolve to your project folder.
});
But with engines you can send data to template.
http://expressjs.com/en/api.html#res.render
// pass a variable to the view
res.render('somePage', {
title: 'Awesome title',
userFriends: friendsList,
name: 'loggedUserName'
});
And now on front-end templates(EJS in this case) will populate html with data that you send in. So html became dynamic and you can make each page looks different for each user.
<ul>
<% for(var i=0; i<userFriends.length; i++) {%>
<li><%= userFriends[i] %></li>
<% } %>
</ul>
With just HTML you will need to make a lot of unnecessary AJAX calls to get and add data into html which is bad idea.
Hope this helps.
A view engine allows you to render HTML with options. For example, using squirrelly, I can create a file that looks like this:
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
</head>
<body>
{(userIsSignedIn){<!-- if the user is signed in, display username and description-->
<p>{{username}} is {{description}}</p>
}}
{(!userIsSignedIn){<!--if user isn't signed in, ask them to sign in-->
<p>Sign in to view this page</p>
}}
</body>
</html>
So I could listen, for example, to a dynamic user profile URL with Express and then return dynamic content.
It's almost 2020, Template literals are literally meant to replace template engines.
https://medium.com/#PaulBrowne83/do-we-really-need-template-engines-anymore-214eb6bc112e
I have several environment settings that I need to inject into my javascript assets. Thinks like database uri and facebook app id. I'm currently using EJS as my view engine.
Is there a simple way of templating javascript files in NodeJS?
Rather than trying to template your static files, I'd suggest using an initializer script instead.
Simply put a <script> block in your layout, where you call a function in your JS file, which takes the DB uri and the FB app id as its parameters. The function can then store the values someplace where the rest of the scripts know how to access them.
You can easily pass your parameters into the layout (and views) for example by using helpers