Front-end web development is the practice of converting data to a graphical interface, through the use of HTML, CSS, and JavaScript, so that users can view and interact with that data.
In my previous posting about the new support in QEWD for JSON Web Token (JWT) support, I mentioned that it was a key step in enabling Micro-Service support in QEWD. In this post I'll give some background to how they work and the thinking behind them.
If you haven't heard about Micro-Services and/or want to learn more, there's lots of information available if you do a Google Search. Here's a good starting point:
At the end of our last lesson, we ended with our page displaying a nice (but garish) Angular Material Toolbar, and our Widget data displaying in a list of Material cards. Our page feels a bit static, and we already know that the large number of Widgets that we will be dealing with will not be especially usable on a static list. What can we do to help?
Now, let’s say you can’t access the terminal or simply you just rather execute it from a web interface. In this article, I will show you how to execute terminal commands from a simple web page.
For example, in the image below you see how we execute $zv on a webpage:
Me and @Henrique.GonçalvesDias proposed a new way to visualize messages in IRIS Interoperability in a recent update of MessageViewer. In such an update, we tried to give users a visualization based on a UML sequence diagram. You could get more information on the previous article.
I enjoy the challenge of being in a contest. Currently I participate in InterSystems IRIS with REST API Programming Contest. My idea for this contest was to create an app to help me keep track of tasks for my Status Reports. I started with the template provided by Evgeny Shvarov. I created a persistent class for Tasks and a REST Dispatch class. I defined my URL map and I even figured out how to test my REST app using Postman.
https://www.youtube.com/embed/e3txoPRzK_Q [This is an embedded link, but you cannot view embedded content directly on the site because you have declined the cookies necessary to access it. To view embedded content, you would need to accept all cookies in your Cookies Settings]
This code snippet provides a ZEN page that downloads a stream from its database directly:
/// We assume that you have stored your data within this schema:
/// MyApp.Model.Storage: Filename,FileSize,Content,ContentType
Class zen.downloadStream Extends (%ZEN.Component.page,%CSP.StreamServer)
{
/// Wrapper to get the id of the download, we assume that the id is passed to this zen page
/// as a URI parameter, i.e.: MyApp.Downloads.cls?OID=1234
ClassMethod GetId()
{
Quit $Get(%request.Data("OID",1))
}
/// Set the appropriate header for the file.
ClassMethod OnPreHTTP() As %Boolean
{
Set tId = ..GetId()
If ##Class(MyApp.Model.Storage).%ExistsId(tId) {
Set tStream = ##Class(MyApp.Model.Storage).%OpenId(tId)
// You could "guess" the content type by its file extension
// or you can store it (before) in the database separately (like in this example).
// Set Extension = $Piece(tStream.Filename,".",$Length(tStream.Filename,"."))
// Set ContentType = ..FileClassify(Extension)
Set %response.ContentType = tStream.ContentType
Do %response.SetHeader("content-disposition","attachment; filename="_tStream.Filename)
Do %response.SetHeader("Content-Length",tStream.FileSize)
}
Else {
Set %response.Status="404 File Not Found"
Quit 0
}
Quit $$$OK
}
ClassMethod OnPage() As %Status
{
Set Download = ##Class(MyApp.Model.Storage).%OpenId(..GetId())
Do Download.Content.OutputToDevice()
Quit $$$OK
}
}
or "Didn't you say you would cover Persistent Objects in Part 5, Chris?"
Yes, that was the plan. This is a pretty important topic, so it get's its own Article
Up until now, we've display widget JSON that has been created by a basic loop. Clearly this isn't of much value. Now we have our stack connected together, and we can see that the data is flowing to the Welcome page, it's time to complete the stack and start feeding our service from "real" data.
I would like to write some code to parse a set of HTML pages from the internet in order to gather information from each web page.
All of the web pages are generated using a template, so the format of each of the web-pages is consistent with one-another and the information that I want to gather is always located in the same logical place within the page.
What is the best way to parse an html page in order to gather information at a specific place?
Can XML XPATH be used here? Does anyone have any examples of parsing HTML content?
This discussion is open to anyone who use or know about WebTerminal project. It is a result of a long story of the project development, testing and maintaining.
We left our application over the weekend, secure in the knowledge that it was returning data from our primary persistent class, User.Widget. However, Widgets Direct are the premier supplier of both Widgets AND Widget Accessories, so we should really start working on adding these Accessories to our application.
In our last lesson, we added some formatting and validation to our Edit Widget form. So, now we are ready to add the ability to add new Widgets to our application. However, the great Widget Wars have come to an abrupt end, as Widget Direct has purchased its biggest competitor, WorldWideWidgets. In order to maintain some continuity, we need to display their catalog on our new application.
In our last lesson, we added a form to Edit our existing Widgets, and save them back to the server. However, our Form was not well structured and our Save button had no intelligence, and was not fully visible. So today, we will apply some Material components and Angular style to make the form more useful
If you had to choose Angular 1 or 2 for a new web project using Caché/Ensemble as a backend, Which one would you choose? I'm trying to figure this out with a short pros/cons list:
As web application gets more complex, more technologies are involved into the application development. Once it gets deployed in large scale the configuration gets more complex too. For sure one of the most difficult part of the story is the security. In a complex solution when independent servers are feeding single web pages with contents, it is indeed challenging to keep the integrity of such system. HTML5 introduced a (weak) security constraint, the Cross Origin Resource Sharing (CORS). This article tells how to enable CORS for CSP/ ZEN applications.
I am happy to share the news that Zen Mojo 1.1.2 has been released. This release includes a critical fix for Firefox that we had to get out as fast as possible. No other changes are included to allow easy upgrades. We recommend upgrading to this release if you are running on Zen Mojo 1.1.1.
All upcoming Caché and Ensemble releases will ship with Zen Mojo 1.1.2.
Let's pretend you are working on a project where you may be retrieving a URL for some purpose and you have the need to be easily able to parse apart that URL to get the various components that make up the URL.
Hello, our customer, large industrial company, is considering modernizing their old CSP application so it can run on multiple client device types, using responsive design.
They have a lot of experience with CSP and some ZEN.
They are new to REST and have some limited knowledge of javascript - perhaps not enough to the extent used by client framework.
Does anyone have a framework or a set of templates that you would be willing to share?
This question came on the Ensemble in Healthcare email list. It's a great question. I'm working on an answer, but am posting it here to get any other input. I'll also address the option of using %CSP.REST.
I have a %Net.Request object and I want to get a full URL of the request sent (preferably after all redirects, but even full initial one would be good). For example, I have the following method:
RESTful API Call From Cache to Particle.io Electron
Tom Fitzgibbon | Multidata | 212-967-6700 x537 | tom@mul.com
Summary: Simple Blink Tutorial for Particle.io Electron Device from Cache
Electron device is a tiny ARM processor ($40-$60) that connects to Particle’s world wide leased 2G/3G network (about $3/mo) and runs off an included LiPo battery. Using Cache’s %Net.HttpRequest you can send/receive data, control hardware and read sensors.
I am configuring IIS to work with the CSP Gateway but I'm running into this error:
"The Module DLL 'C:\Inetpub\CSPGateway\CSPms.dll' could not be loaded due to a configuration problem. The current configuration only supports loading images built for a x86 processor architecture."
I'm curious to know what InterSystems clients are using for csp based web development methodology.
Are you doing tag based development, or class based development?
If you are using tag based development, what tools are you using to create the look and feel of your web pages? Are you using tools like Adobe Dreamweaver, or do your developers sit down and code HTML using plain editors like Notepad and Notepad++
Are you doing prototyping of web pages and then adding CSP tags, or are you just developing the finished csp page with no prototype?