How to emulate the behavior of master page in Net.Core and VS Code - html

When building an MVC project, there's a shared folder automatically provided in which I have Layout.cshtml page that's used like the holder or master page (as it was called in Web Forms). So, all the banners, navbars, footers etc. go in there, while the acutal pages being developed refer to it in the source code and got pasted together upon rendition. This far I'm following.
Now, I have a set up and AspNet website using Yeoman and the only thing I have is wwwroot directory in which I put the file start.html. (It's the same as index.html - I just wanted to try out if I have full control over default files.)
I'm unsure how to proceed. I.e. I'd like the links on the start.html to point to files like uno.html, duo.html etc. and read those into a designated part of the landing page (i.e. start.html).
Is it doable without using the magic of templates? I want to have full control over the rendition process.
There's no point googling it, I noticed, because anything I've got the last two hours leads to how to create master page not to how to emulate master page.

Well, the static files middleware is just for that: static files.
You roughly have two options:
Do everything client sided, i.e. rather than having normal links use javascript/ajax calls and embed the content of the static file in your start.html using javascript.
It should work, but has several down-sites like it requires javascript to work (not a big issue these days, except for the paranoids who use no-script browser extensions) and that web crawler still may have issues properly indexing ajax heavy web pages
Wait until ASP.NET Core 1.2 (scheduled for Q1-Q2 2017), which will add Razor Pages. Pages rendered with Razor template engine, but without the need of a controller.
1.2
WebSockets
SignalR
Razor Pages (Views without MVC controllers)
Web API security
If you don't wanna wait, try RazorLight, which is 3rd party open source library for rendering Razor views.
But all except the first one require some "magic template engine".
You could of course write an server-sided includes (SSI) middleware which would be based on UseStaticFiles middleware and parse the file and include the html files server sided before returning it. There is nothing out of the box for it as far as I know.

Related

Modularization of html content in Electron app

I know a typical practice to build an Electron app is to follow SPA (Single Page App). I still would like to split my html content into separate files for easy maintenance. There is still the main index.html file which is to be loaded on startup.
My question is: is there a protocol for inserting a part of html content from a different files? For eg. in Django, there is a include and extend tags where you can insert an entire html file into the body of another parent html file or retain certain features from another html file.
There's no way to do this directly. Django is a server-side framework, so you can assemble your HTML on the server, and the completed HTML is sent to the client/browser. With Electron, you're basically running Chromium with Node.js APIs added, loading your HTML from the filesystem, so there's no server to do any HTML assembly in.
However, if you just want to break up your HTML into pieces for easier maintenance, but you're not doing any of your include/extend dynamically, theoretically, you could use some kind of templating system or a static site generator to combine your HTML files statically at build time.
Here's an list of some JS templating engines: https://expressjs.com/en/resources/template-engines.html
Here's a list of some static site generators (filter language by JavaScript): https://jamstack.org/generators/

Isn't the html of the form Django displays on the screen?

Django shows you forms when you do basic coding, right?
Where is the html of the automatically generated form in windows?
So instead of looking for a template folder, once the developer writes the url or views code, he finds the location of the skeleton-only html that Django shows.
In my opinion, it looks like it's built somewhere like an "anaconda/envs" contains a separate virtual environment, but I can't find it.
it's maybe path?
It's well documented:
https://docs.djangoproject.com/en/2.2/ref/forms/renderers/
It loads templates first from the built-in form templates directory in
django/forms/templates
unless you have 3rd party libraries included that override these templates.
However, a quick check in https://github.com/django/django/tree/master/django/forms/templates/django/forms/ shows that this directory is empty.
tl;dr
Django does not render any forms from scratch (unless it's the Admin which of course creates its whole UI automatically). It just enables you to quickly create a template that can render your form but you will still have to provide a basic template (aka HTML markup with dynamic parts) yourself.

Liferay avoid loading files from /html/ folder

We are liferay 6.1.2. Have got 3 portlets on 3 different pages. We have our own set of JS files and CSS files which are self sufficient for the page to work. I see that there are lots of files loaded from /html/js and /html/css. How can we avoid loading these files. I am pretty sure that none of the rules from these CSS files are used in our page.
Liferay's pages bring a lot of functionality with them - e.g. the theme might provide libraries, other components on the page (like the dockbar) might use that functionality.
In the case of Liferay's core themes, they provide the AlloyUI library and your portlets can just assume that this library is available. If you don't need it, make sure there's no other portlet on the page that needs it as well (e.g. Dockbar, Chat, Notification portlet)
On the CSS side, Liferay loads quite a bit of CSS from the theme - bootstrap CSS among it all. Eliminate it and then try to get your layout back... It's typically all minified and combined into a single file anyway.
You can configure the files that get loaded for anonymous users and for logged in users in portal-ext.properties. Search for "barebone" and "everything" in the linked document. Also make sure that you haven't disabled the CSS- and JS-minifier. Disabling them is recommended during development. In production they should be enabled.

Can I still use `.cshtml` files in a hybrid mobile project?

All the resources use only HTML, but stuff like Cordova and Ionic work on the client, with HTML pages (and JavaScript and CSS of course), and once MVC has served a page, that page is HTML, so the hybrid tooling should be able to use it.
The only problem is that once it's served, it lacks the .html extension, but maybe I can figure a way to add this.
The reason I'd like to stick to .cshtml for my layout is that I can scaffold views from my sever-side view models, and this adds quite a lot of value for me.
If the question is: can you have .cshtml files on your mobile device, the answer is no. .cshtml file is processed on server by the Razor view machine, so plain HTML can be generated. Obviously you don't have MVC, Razor and such on your hybrid ionic app.
You can however work around it by taking your angular templates to be generated on your server by MVC. So, when you setup your templateUrl somewhere, instead of taking the relative path to your local template .html file, you can point to the controller on your server, giving the full path, with http:// and so. The controller will then generate your template for you and return as plain HTML.
Bear in mind, that angular will cache this, so it will be loaded only once.

Redirect between html, jsp without changing the URL

I am planning to design a web application with multiple HTML and JSP pages. The first page of myapp (index.html) loads up with the url
localhost:8080/mywebapp
without an explicitly pointing it to
localhost:8080/mywebapp.index.html
because web-xml has index.html in its startup script. Thats perfectly fine!
But how to toggle between multiple JSPs and HTMLs that are in the web app keeping the URL constant
localhost:8080/mywebapp
The user should not be knowing the navigation pattern when he is using the web-app.
Ideas on any frameworks or implementations are highly appreciated.
Thanks
Leaving aside the fact that you shouldn't do this, essentially what you have to do is bypass the standard routing method of your application.
You can do this one of two ways.
1) Use Ajax to call all the different URLs you need from within a single page. This will give you the single URL you're looking for though it doesn't of course prevent anyone from trivially working out what the actual navigation URLs are and unless you build a single page app and do some really evil interdependencies finding your navigation is trivially easy.
2) Your second option would be to create a single servlet which takes parameters which identify which part of your application you want to use. If you really wanted to be horribly evil you could hash those arguments with some form of per user short duration cookie so that even if they identify the actual web calls you're making running them manually won't actually work.