JavaScript fileWatcher - javascript

I am developing a web application (intranet) and it is mandatory to watch a specific folder, for example c:\docs, for inserted files. I would like to do that through JavaScript in order to detect each time the client inserts file into specific directory.

You can build your own application using django. It has very safe methods to handle user models and for handling files.
Question is, do you want a web-based interface for users to manage their documents, or do you want to monitor documents as and when people modify directly in the file system?
For the former, I'd say django is a very good option to build your own app in no time.
EDIT
For the latter, you can use node.js. Here's an interesting project that could get you started - https://github.com/mikeal/watch

Related

Is there a thing such as "packaged web app"?

Let's say I have a HTML/JS application, which is on a website and runs without any server-side component (except the web server, of course). So it's basically just a bunch of .html, .css and .js files (and some others, like images or SQLite databases)
Someday, an user comes to me to ask me if I can make an offline version, so they can access the app when they are offline.
My first reaction would be to provide them all the files of the app in a .zip file or something, but this is not really good: it's not "clear" to an average user, and the files and code are apparent (which could be "dangerous" if the user edits or deletes them by accident).
So I was wondering: is there a kind of format that would makes me able to store the files of the app in a packaged file?
The file would be something like a .zip file, but when you click to the file, instead of opening up the archive, it opens the /index.html (or similar) which is inside.
So for the user, it would be similar to open an .exe or a single .html file, but still that's not a native app, as that's still a browser app.
Given that I know about:
Apache Cordova; but most of the time, I just use the browser functions, and I don't have a need to use advanced native functionalities;
UWP and PWA, but I don't know if it's exactly what I want (I imagine it as a mix of website and mobile app, but I'm surely wrong);
Open Web App (a standard from Mozilla), but based on what I've read about it, it seems deprecated and not used anymore. Plus, I don't really look forward to "certify" my app... I just want to package some files.
PWA I don't think is a solution to your problem as you wont be able to redistribute the code as an executable package.
UWP would be too Windows specific and might make you lose the platform independence that you already have since you are using plain HTML and JS, plus from what I understand you would need to distribute the app on Windows Store.
I believe packaging as an Electron app would be the best solution as you can provide executable files that can be executed in almost all platforms.
Electron would be the best solution for you. I had a client that first wanted to run app on php server and eventually they figured out they need it as a desktop app. It was easy to rewrite php stuff to node and package as Electron app. You have access to everything files, system etc. so you can do more if needed.
Another solution would be to just inline everything into a single html file.

How to work with hybrid webapp (MPA and SPA combined)

What are good practices about building a multiple page application using modern JS frameworks?
Multiple page application
In multiple page application we have multiple templates using some “template syntax” to provide us with backend data and AJAX (if needed) or advanced UX voodoo is often handled by jQuery.
Single page application
In single page application “backend data” is provided by AJAX requests and whole routing, frontend logic is handled by JS. We often use some JS framework like Angular or React and compile our sources with task runners/bundlers like webpack or gulp.
Hybrid application
But the most popular around the web seems to be hybrid app. What is typical build workflow while working with such an app? I could not find any tutorials or guides.
So to be specific. I imagine webapp where in which, each page has to be compiled and could share some resources. Every page has own JS routing like wizards or subcomponents. Data is loaded both during page load and AJAX.
For example my webapp would have 3 pages:
guest page - would provide website user with limited content and attract him to sign up
user - would provide signed website user with full content, resources would be extended guest content
admin - shares only styles and webapp “core”
Task Runners/Bundlers
For example in webpack is there a way to specify multiple entry and output points? Maybe the better way is to have multiple webpack/gulp configurations. In that case If I have a lot of pages I would have to write webpack/gulp configurations for every page even though some of them could be exactly the same. How to run that kind of build?
Sharing resources
Will browser load cached js bundle with the same hash like bundle.a2k4jn2.js within the same domain but different address? If so, how to specify such a behaviour in tools like webpack or gulp. I heard about CommonsChunkPlugin but not sure how to use it or even I’m looking at right direction.
Templates
What if I want to load some “backend” data not by AJAX but at the page loading. Of course every templating engine provides us with ability to write native code directly in html template like JSP or PHP. But what if some routing is handled by JS and “template tag” is not visible for page at initial loading i.e. template would not be compiled. Sometimes template engine in server and client could have the same special tag like Blade and Angular which can lead to conflicts.
Directory structure
I suppose that in hybrid app frontend and backend will be tightly coupled. Sharing JS in hybrid app could lead to very complicated imports (in es6 or html script tag). How to keep it simple.
Deploy
What about deploying an application? In java it’s easy because we just specify directories (compiled pages) in build tool (maven, gradle) which be copied to jar/war, but in PHP source code is not compiled how to keep “js source” away from production I could not imagine sensible resolution other than writing own batch/bash script
Summary
I have mentioned specific technologies and frameworks. But my question is about common approach to work with such an webapp rather than “how to do sth in that tool”. Although code examples would be greatly appreciated.
Their is a lot in this question, as a starting point you can define multiple entry points in webpack.
https://webpack.js.org/concepts/entry-points/
If you want to mix data loading between FE and BE then you really need to write an isomorphic JS application and use Node as your BE, otherwise you’ll end up writing everything twice in different languages and having once come across a project like that, trust me you really want to avoid that.
The other bit of this question on shared resources is best answered by WebPack’s bundle splitting which is made for what is being asked here
https://webpack.js.org/guides/code-splitting/
Not sure if I totally understand the question, but single-spa (yes it's redundant) is a tool that can be used to combine multiple apps (even if they are different frameworks) into one single page application. Link to the docs: https://single-spa.js.org/docs/getting-started-overview

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

how to install web application from a .msi file , created using wix?

I created a small web application in c# and wanted to create a installer for the web app and started so, using wix and i come up with the .msi file(installer) with a .wixpdb file.
Now, when i click on the .msi setup file ,installation is getting started and ending up with noting.
steps i followed is,
create web application.
build and publish.
harvest the publish folder and thats creates me a .wxs file.
create a setup project in the same solution of my web app.
add .wxs from step3 to the setup project.
build the setup project it create a .msi(installer) and .wixpdb file.
My Doubt here is that, how can i run the installer that will create a service/web application and installed locally.
Unfortunately WIX harvesting will not create a web application/web site for you automagically, when you harvest a "published" application. It will just produce the code to copy files. In WIX, you have to add this functionality yourself. In comparison with VS installer for example, you've got much more to do, and the rabbit's hole appears to be much deeper.. Take a look here for example:
http://www.codeproject.com/Articles/115036/Creating-WIX-Installer-for-ASP-NET-Web-Application
http://blog.bartdemeyer.be/2013/10/create-an-installer-for-website-with-wix-part-1/
The answer is quite simple, of course we just need to double click the installer, but before that we need to add
<UIRef Id="MyWebUI" /> in FileName.wxs file and define some UI dialogs in the .wxs file, that is more cleary explained here
http://www.codeproject.com/Articles/115036/Creating-WIX-Installer-for-ASP-NET-Web-Application.

Meteor app linking to external pages/apps

Hi guys I'm looking to build an application that is a list of stores. One requirement is that for each store there is a special view of the store built in flash or javascript. This special view portion has been already built by someone else. It consists of a single HTML index file and a bunch of javascript/css in it.
So I think it would be very difficult to directly it as a part of the meteor app. What I want to do is to somehow have those special view portions be a separate entity from my meteor listing app. How can this be done? Will it need to be on different servers? Or can I just have two folders (one a meteor app folder, the other just those html+css+javascript/flash files) and have the meteor app have links point to the other folder? Any examples of meteor apps pointing to separate files but still function like a single webpage?
you can connect to another app by using DDP.connect() and it acts like REST API for websockets.

Categories

Resources