Hi I am developing a widget module in my existing Angular 1 based UI project. This widget is supposed to contain real time information.
As per my design, I want to send html view to client from node server(maybe using express js) when the first request is made. But as the data needs to be real time, I cant afford to send the complete html every minute(will be duplicate template transfer each time).
So is it possible that I send a template to client along with a set of java-script functions so that when ever client wants that data to be refreshed, he will just invoke the sent javascript function and internally my javascript function will make a rest call, get the json response from server and again repopulate the html sent initially.
This way I am planning to have initial rendering at server side and subsequent rendering at client using the logic provided by server. Here client will not be aware of which widget it is rendering and what functionalities it has. All those will be controlled by js sent from server.
Please do let me know how to achieve this as I find ejs not serving this purpose. With ejs, I need to have all logic to server side only. Whereas I plan to transfer logic from server to client at run time.
Also if my design is having some serious problems, do suggest some other alternatives. Thanks
Angular1 is not server side rendering friendly as it needs browser DOM. Use of any templating engines wouldnt help either as the html generated by them are not picked up by the angular app.
Use a phantomjs headless browser instance to generate html by running ur angular1 app code and then angular will run in client side when scripts have loaded.
I would recommend switching to Angular2 or React as they are server side rendering friendly
Related
Next.js is one of the most confusing technologies for me, i can't understand how it works on the server, how a server knows we need to achieve server side rendering with files created by Next.js in the build time?
I understand the client part, but how a server know that we need to achieve server side rendering after deploying the website files created by Next.
What is the difference between a React project created without Next.js in which the server send an empty HTML document in response to a client request, and a React project created with Next.js in which a server will send a full document to the client??
how a server knows we need to achieve server side rendering with files created by Next.js in the build time?
Have you taken a look at the Next.js server-side rendering documentation here?. There is more about static generation here.
Also for more on server-side rendering, check out this site
What is the difference between a React project created without Next.js in which the server send an empty HTML document in response to a client request, and a React project created with Next.js in which a server will send a full document to the client??
Not entirely sure with the wording here, but if you are asking what Next provides, it is a framework that will give you everything listed on their landing page that you would have to code up or figure out otherwise. They provide a quick way to wrap up and generate production-ready files to deploy.
Pretty much what the title describes. I need to build a todo app for a job interview, but js must be disabled in the browser, and not using a database.
Any js must be done on the server side.
I have a beginner grasp on node/express and know how to serve html files, but I’m not sure how to go about updating the html with user input without js Dom manipulation. What would be a reasonable approach to this problem?
I suppose you could send data to the server with the help of forms (so no client side js required) and serve static html pages from the server to the client.
Where to configure what part gets rendered on server-side and what renders on client-side while using Rendr.js?
The documentation and blogs everywhere mention that it's main purpose is to make a common way to write client and server code.
Rendr is a small library that allows you to run your Backbone.js apps seamlessly on both the client and the server. Allow your web server to serve fully-formed HTML pages to any deep link of your app, while preserving the snappy feel of a traditional Backbone.js client-side MVC app.
But how to configure when server side rendering happens? Or does Rendr decide on it's own?
What I want to do is decide which part gets rendered on server side since I am trying to develop a single page application.
I have an asp.net web api and an Angular app that all lives in the same project file. My Angular app just uses .ts and .html files, and was wondering if there is a way to get a variable from my .NET global.asax into the Angular app somehow?
You could use an ASP.NET HiddenField control. With it, you can pass a variable value from the server to the client or the other way too.
This SO post on the HiddenField control usage may be helpful.
There are a couple different ways you can pass data from your web application to your client code. How you would go about it will depend on the type of web application you have (WebForms, MVC, API), and the amount of security you need. There are other ways then the following as well, if you provided more detail about what you are trying to do, then better suggestions can maybe be made.
You could set up an AJAX call in the client code to request the info from the server at runtime.
You could set the info in a cookie, and use the client code to read the contents of the cookie.
If you are using a web application that renders web pages, you can have the value rendered as a variable declaration in some client code.
If you are using a web application that renders web pages, you could also have the value rendered as a hidden field.
Please keep in mind that any data handled by the client side code exists on the client, and therefore can be accessed and even manipulated by the client. (Malisciously or accidentally)
Suppose you were to build a highly functional single-page client-side application that listens to URL changes in order to navigate around the application.
Suppose then, that when a user (or search engine bot) loads a page by its url, instead of delivering the static javascript file and hits the api as normal, we'd like to precompute everything server-side and delivery the DOM along with the js state.
I am wondering if there are existing tools or techniques for persisting such an execution of state to the client.
I know that I could execute the script in something like phantom JS and output the DOM elements, but then event handlers, controllers and the js memory state would not be attached properly. I could sniff our user agent and only send the precomputed content to bots, but I am afraid google would punish for this, and we also lose the speed benefits of having sent everything precomputed in the first place.
So you want to compile, server-side and send to the client the results of requesting a resource at a specific URL? What is your backend written in?
We have an API running on GAE in Java. Our app is a single-page app, and we use the HTML5 history object so we have to have "real responses" for actual URLs on the front-end.
To handle this we use JSP to pre-cache the data in the page as it's loaded from the server and sent to the client.
On the front end we use Backbone, so we modified Backbone.sync to look for a copy of the data it's looking for locally on the page and if it's not there, only then to request it from the server as an AJAX call.
So, yes, this is pretty much what every site did before you had ajax. The trick is writing your app so that the data can be local in the page (or in localStorage even) and if not only then to request the data. Then make sure your page is "built" on the server end (so we actually populate the data in the HTML elements on the server end so the page doesn't require JS on the client end).
If you go somewhere else the data is dynamic and the page doesn't reload.