New post

#Frontend

13

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.

Learn more.

Hi! Today I would like to talk about one of the most important architectural patterns in Angular.

The pattern itself is not related to Angular directly, but as Angular is component-driven framework, this pattern is one of the most essential for building modern Angular applications.

Container-Presentation pattern

It is believed that good components should be small, focused, independent, testable and most important - reusable.

6 0
0 879
Article
· Jun 30, 2022 8m read
What's new in Angular 14

Hi! My name is Sergei Sarkisian and I’m creating Angular frontend for more than 7 years working in InterSystems. As the Angular is very popular framework, our developers, customers and partners often choose it as part of the stack for their applications.

I would like to start series of articles which will cover different aspects of Angular: concepts, how-to, best practices, advanced topics and more. This series will target people who already familiar with Angular and wouldn’t cover basic concepts. As I’m in the process of building articles roadmap, I would like to begin with highlighting some important features in most recent Angular release.

3 1
0 1.3K

I wrote a step by step tutorial in the qewd-howtos repository how you can write state of the art multi-page web apps with Node.js using a QEWD-Up WebSocket/REST api back-end integrated with a mainstream web framework like NuxtJS & Vue.js.

3 0
3 1K
Article
· Oct 6, 2020 2m read
An overview of npm-iris

What is npm-iris?

N.P.M stands for "No Project Mess."

N.P.M. is a Project & Task Management app that uses InterSystems IRIS and Bootstrap 4.

No Project Mess is created to help developers and small business companies to reduce complexity in their daily problems, with a simple and intuitive projects and tasks management software.

It offers different views for your tasks, from a spreadsheet, kanban, calendar, or even Gantt!

Open Exchange app
3 0
0 290
Article
· Apr 24, 2020 2m read
REST for Tasks on my Status Report

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.

Open Exchange app
2 1
0 210
Article
· Jul 31, 2019 2m read
Anti CSRF Methods

IRIS provides us with anti login CSRF attack mitigation, however this is not the same as a CSRF attack, as login attacks only occur on the login form. There are currently no built-in tools to mitigate CSRF attacks on api calls and other forms, so this is a step in mitigating these attacks.

See the following link from OWASP for the definition of a CSRF attack:

https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF)

Open Exchange app
4 5
1 634
Article
· Mar 19, 2019 9m read
A Tutorial On WebSockets

Intro

Most server-client communication on the web is based on a request and response structure. The client sends a request to the server and the server responds to this request. The WebSocket protocol provides a two-way channel of communication between a server and client, allowing servers to send messages to clients without first receiving a request. For more information on the WebSocket protocol and its implementation in InterSystems IRIS, see the links below.

9 7
3 5.4K

In this article, I would show how you can upload and download files from InterSystems products via http.

The questions about working with files over http arise fairly often on community and I'm usually linking to my FileServer project which demonstrates file upload/download but I'd like to talk a bit more on how we can serve and receive files from InterSystems products.

8 3
5 2.6K
Article
· Nov 19, 2018 1m read
Pagination with filters

Working on a proyect with :

Cache Object Script, Jquery and Bootstrap :

I have a big problem to do pagination with parameter, to query filter and registry limitation, but i find a solution using session and global:

1 1
0 426

InterSystems products (IRIS, Caché, Ensemble) already include a built-in Apache web server. But the built-in server is designed for the development and administration tasks and thus has certain limitations. Though you may find some useful workarounds for these limitations, the more common approach is to deploy a full-scale web server for your production environment. This article describes how to set up Apache to work with InterSystems products and how to provide HTTPS access. We will be using Ubuntu, but the configuration process is almost the same for all Linux distributions.

7 2
9 2.5K

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
    }
 
}

Link to code on GitHub

2 1
2 570
Article
· Oct 1, 2018 4m read
Profiling code using Caché Monitor

Not everyone knows that InterSystems Caché has a built-in tool for code profiling called Caché Monitor.

Its main purpose (obviously) is the collection of statistics for programs running in Caché. It can provide statistics by program, as well as detailed Line-by-Line statistics for each program.

Using Caché Monitor

Let’s take a look at a potential use case for Caché Monitor and its key features. So, in order to start the profiler, you need to go to the terminal and switch to the namespace that you want to monitor, then launch the %SYS.MONLBL system routine:

3 1
7 932

Index to Articles

Hi All

It's been 6 weeks since my original article sad
- - - - -but I have been busy on this project

I have been looking at/thinking about a replacement for ZEN for around 12 months but only really started in depth 4 months ago.
Also been in IT for long enough that I can "get a feel" for a product/technology and make decisions accordingly without going into great detail.
Any new technology has a learning curve and I don't want to waste time and effort on something that won't fly.
And, as always, I am looking to minimise the learning curve as I want to concentrate on delivering business benefit.

15 3
1 912

Index to Articles

Published 2018-05-11 Last edit -

Hi All

I this article I detail some strategic issues that a new development UI will need to address - these are the ones that I can think of now - others may come to light during this journey.

See the webinar by Eduard Lebedyuk here from the last Global Summit describing modern web development and Caché

And, as always, if I have missed something please comment....

13 13
2 1.4K
Article
· Mar 18, 2018 1m read
Replacing ZEN - Index to articles

Hi All
This is the index to a series of articles I hope to create over the coming months.

ZEN and ZEN Mojo are no longer being actively developed by Intesystems - this is a great shame as it is a fine product that works so well for business applications.
However ZEN is a 15 year old product and I need a path forward to replace the ZEN UI with a supported development framework.

This article is an index of the other articles I have, or plan to write. - the articles will be subject to change as I develop my thoughts and climb the learning curve.

12 5
1 1.2K

This series of articles aims to address the following topics:

  • Creation of a web application based on REST pages;
  • Overview of some tools for tracing (debugging) HTTP requests;
  • Switching from hyperevents to... hyperevents;
  • Integration with jQuery File Upload;
  • Conversion of JSON from the {id:1,parentId:1} format to the {id:1,children:[{}]} format for tree visualization;
  • Integration with jQuery EasyUI (using datagrid and tree as examples);
  • Other topics.

5 1
1 937

There are several options how to deliver user interface(UI) for DeepSee BI solutions. The most common approaches are:

  • use native DeepSee Dashboards, get web UI in Zen and deliver it in your web apps.
  • use DeepSee REST API, get and build your own UI widgets and dashboards.

The 1st approach is good because of the possibility to build BI dashboards without coding relatively fast, but you are limited with preset widgets library which is expandable but with a lot of development efforts.

The 2nd provides you the way to use any comprehensive js framework (D3, Highcharts, etc) to visualize your DeepSee data, but you need to code widgets and dashboards on your own.

Today I want to tell you about yet another approach which combines both listed above and provides Angular based web UI for DeepSee Dashboards - DeepSee Web library.

3 16
5 2.1K