How to generate PDF from .tex in browser, using memoir document class? - javascript

I'm writing a single-page web-app custom data editor, which currently does not require any server side code to function.
The app generates a .tex file as output. The generated file uses memoir document class and does some complex formatting stuff that is hard to reproduce outside of a *TeX ecosystem.
I would like to let users download PDFs, not .tex files.
I would prefer to generate these PDFs in browser, client-side. I would settle for server-side generation though.
I tried texlive.js, but it lacks memoir. As for the server side, I would like to avoid setting a tex to pdf generation pipeline from scratch --- I feel that it would be a security nightmare.
Any advice?

Basically you just have to compile your own version of texlive.js.
The instructions are here. Just add the memoir package.
Server side renderers do exist. However I would recommend to auto-generate a VM for every run. Like CI-tools do it.

Related

Web Project Structure - Can I nest server file in HTML file?

I'm fairly new to web development, but I've take a couple hands-on introductory courses where the basic structure of a website is you have an HTML file (or several ejs template files), a CSS file, and then you have something called a "server" file which is a JavaScript file, typically called app.js
I know that if I wanted to, I could include all my CSS inside the HTML file in <style> tags. My question is, should I have the need to do so, would it be possible for me to include the server code in <script> tags within a single HTML file?
Debating on whether or not I should put forth the effort to attempt to do so, but if it's generally problematic (note: I don't car about "best practice") for some reason such as it prevents you from working with certain packages/modules like EJS or Node.js then I will likely conclude that it doesn't make sense to try. As a novice web developer, I fear I am not aware of certain restrictions that I would likely run into if any (besides lack of module support).
would it be possible for me to include the server code in <script> tags within a single HTML file?
No.
Web browsers, which execute the scripts in webpages, do not provide JavaScript programs with the APIs required to run a server.
If you want to write a web server in JavaScript then you'll need to run it using a tool like Node.js and not a web browser.
No, you cannot put server-side code in HTML or in JS files that are sent to the client. Server-side code is code that is run on a server that you host, while client-side code is code that is run on the computer of the person who is visiting your webpage.
You can put client-side code in HTML <script> tags., and you can also include client-side code in separate JS files. The drawbacks are immense though, as:
Code highlighters won't be able to highlight your code and point out things like syntax errors as easily.
You won't be able to use tools like Babel and TypeScript, which input and output JS files.
You can't use NPM modules without a bundler like Webpack, which itself will output JS files.
Overall, there isn't really a good reason to use the <script> tag. It takes 2 extra seconds to just create another file for your JS, and it's more organized, more modularized and easier to use with external tools.

Using the same static data in both C# classes and JS files in the same MVC project without rebuilding again and again at runtime

Issue
My issue (in as general term as I can put it) is that:
* Have some static data (changes rarely and requires a re-compile of the site) in the form of a series of configuration strings like URI, hash, etc for several files that needs to be use in both the c# of the MVC site as well as some of it in some JavaScript.
* We don't want to duplicate the data as it's bound to get out of sync and cause us all sorts of hard to track down bugs.
* Ideally we would like to create the JS file with the data inserted into it at build time taking the data straight from the c# class it's stored in so it doesn't cause lots of wasted time re-building the JS each time it's asked for and nether does the c# class need to dig around in a js file trying to pull out the data.
Research so far and potential solutions
T4 Text Templates
We have considered T4 (.tt Text Template) to build the JS but have only just come across T4 and have not yet found a way (if one exists) to access existing project classes in the T4 file to generate the JS.
Using something like Gulp
We could also use Gulp and build something in JS to extract the data from the class file directly to build the JS but up to now we have stuck with NuGet, a few VS extensions and our TFS deployment server and didn't really want to add the complexity of Gulp and ether switching everything back over to it or splitting our build across Gulp and MSBuild/TFS. We have a little experience with this and found it caused us more issues with keeping it running than it's worth.
Build & cache JS file at runtime
As mentioned we could also create a page that builds and returns the JS at run time. We could cache the output after the first build as it wouldn't change but that's still hitting my MVC instead of just a file and the cached data would need to be stored and retrieved.
This last method (Build & cache JS file at runtime) is the one I'm leaning towards as it would be the cleanest, easiest to follow by new devs in the future and wouldn't require any extra packages/libraries adding to the project.
While building and caching the .js file at runtime is certainly an option, this would waste a small amount of both RAM and CPU cycles on the web server. Not to mention, the caching could cause confusion during debugging.
IMO, a better option would be
Put the static data into a common file format such as JSON or XML
Use T4 templates to read the common format and build both the .js and .cs files
Create a batch file to run the T4 transformations and add it as a pre-build event in the .csproj file as in this answer
That way the files are built with the data as part of the normal build process (including during debugging), and the .js file can be deployed as a static file to the server as part of the normal deployment process. To help avert confusion, the T4 template can include a warning not to modify the output files during development.
//------------------------------------------------------------------------------
// <auto-generated>
// This code was generated by a tool.
//
// Changes to this file may cause incorrect behavior and will be lost if
// the code is regenerated.
// </auto-generated>
//------------------------------------------------------------------------------
You could of course replace T4 with a custom built console application that reads the source data from JSON or XML if you aren't familiar with the T4 technology and don't want any extra .tt files in your project that may confuse new developers. But you should take into consideration how often the .cs and .js files will change in development - T4 doesn't have to be compiled into a tool in order to use it.
Gulp is also an option, but it isn't worth adding it to the build pipeline for something as trivial as this. Only consider it if you are already using Gulp in the application or build.
But however you slice it, this sounds like a better candidate for a build step than something that happens at runtime.
The solution we went with in the end was to run the creation code when the website first runs by adding a call in the Application_Start() (called/or Global.asax) like this:
protected void Application_Start()
{
...
// Generates (replacing if required) all the static files that require dynamically creating
DynamicFileConfig.GenerateStaticFiles();
}
This allows the application/website to be up and running and giving us access to all the classes for this project without needing to split them out or add any complex libraries.
It also requires no extra build steps or any extra maintenance and in our case the processing time is done during the release (as our release system tests the site kicking off the Application_Start() code).
The code that kicks off is just a small static class with static functions the generate the file (it's not stored in our repo) or replace if it's already been created.

Reading configuration file(javascript file or json file) on the fly in Qml and javascript

I am new to Qt/Qml and javascript.
Let's say I have a javascript file which contains a table of parameters. The javascript file is used in Qml and it is located in the application directory. e.g. C:\Program Files\QtApp\the_table.js.
If end customer installed the Qt app, they want to manually edit the javascript file and use it with the installed application. ( No need to recompile the app source code).
How can I make it work?
I have tried to update the javascript file manually, but when I try to open the app again, the "updated entry" in the javascript file is not displayed in the application.
-----------------8<-----------------------
Updates:
Javascript file included in the qml resource will not be editable by
end user without recompiling the app.
Javascript in qml will hold mostly the logic, not the data.
It's better to use the JSON file to store the configuration data that can be modified by the end user.
Qt 5.0 and newer version has support for reading JSON file. QJsonDocument.
It sounds like the flexibility you require should be implemented at application level rather than externally. If it is just a "table of parameters" there are plenty of ways to do it in JS.
Due to implementation details you most likely don't want to bother with, that would be much preferable to updating the actual JS file.
Consider the usage of import Qt.labs.settings 1.0 which will allow you to store and make changes to settings that persist across application runs. That would be marginally easier than parsing config files. That being said, doing so is very much a viable option, you just have to interface QDataStream to QML.
That's the best I can do without knowledge of specific requirements and usage scenario.
OK, after a quick test, it seems that it is possible to import a file from the file system, you just need to:
import "file:///pathToYourExecutable/YourScript.js" as YourScript
Then you can use YourScript in QML. However, I would not recommend using this, as it invites opportunities to mess up with the application. The user shouldn't really be editing any files to make changes, just seems like bad design. Whatever it is that you want to achieve, there is most likely a better way to do it.
Solved by changing to use json file to store the data and then access the json file in QML.
The class to read the json file from the disk is JsonFile class in Qt, check this link:
https://forum.qt.io/topic/39756/qml-and-js-reading-json-file-and-change-content-on-the-go

React.js server side rendering with PHP

I would like to develop themes/plugins for WordPress based on React. To make it search engine friendly, I need it to be rendered initially on the server (serverside-rendering).
The only way to do this, as far as I know, is to use react-php-v8js, which requires the PECL V8js extension. This is a problem since I have no control over the platform on which these themes/plugins will be run.
Is there a way to make React and WordPress work together without having to install additional extensions? Perhaps by building/compiling React files into PHP?
There's an article that describes how to do this:
https://sebastiandedeyne.com/server-side-rendering-javascript-from-php/
But it's a fairly complex setup and it requires using composer. That can be difficult in Wordpress projects since Wordpress tends to completely eschew the modern php architecture.
If you're looking for a library to help with SSR in PHP:
https://github.com/spatie/server-side-rendering
Best of luck on it.
If you want your content to be indexed by search engine without js, you can print your minimal content using Wordpress, just the bare minimum + crucial meta tags, maybe localize some initial state for your react app to boot. A bare bone theme such http://underscores.me/ would be sufficient. When js is available, you can replace your whole WordPress generated content with React ones.
The ideal one is to have React generate the content for you. But it's hard until we can see that nodejs / PECL V8js extension available everywhere.
If you can at least install nodejs and launch a node process then it should be ok, although not so simple.
You would need to generate a ssr version of your assets and use it in a node process that would listen on a socket to write the html result..
In your controller you can create a socket to your node process (something like stream_socket_client(...)) and then you can send a dummy function written as a javascript string to that socket (something like stream_socket_sendto($sock, "getResultForMyWidget(someParams){...}")). That function would be evaluated in the node process that would return the response to the controller (the html response as a ReactDOMServer.renderToString from the component you want to render).
That's it for the big picture.
There is a symfony plugin that illustates it very clearly (see this github) and comes with a dummy server node process to illustrate how it handles the socket listening and eval of the incoming function and returns the html result. See also the example in the sandbox for a bigger picture and in depth implementation. You should be able to adapt it to wordpress.

Prevent circumventing ASP.NET minification

I've got some ASP.NET that I'm deploying as an Azure cloud service. The javascript files have comments in them that I'd like not to be visible to anyone consuming the JS. I'm taking advantage of ASP.NET bundling and minification:
http://www.asp.net/mvc/overview/performance/bundling-and-minification
This seems to be a nice solution in that it removes all comments during the minifcation process. But I can't count on the fact that the user won't directly point his or her browser directly to the individual, original js files. I'm trying to figorue out how to prevent the user from pulling the js files directly (forcing them to pull only a bundle), in order to prevent viewing comments. Is there a way to implement a black list of files that can't be downloaded? If not, I was thinking of adding a series of random characters to the name of each js file. Lastly, if that doesn't seem like a good idea, I would investigate injecting something into the VS build process to strip comments on publish.
Any thoughts would be welcome.
You can use blockviewhandler in a web.config in the folder your js is in. Explicitly whitelist any files that are OK to download and then block the rest.
There's an example in this question:
Where to put view-specific javascript files in an ASP.NET MVC application?
I think you can modify your deployment process. To your production server upload only the minified js files but to your test/dev server upload everything.

Categories

Resources