Shared info of IoT & Cloud, Banking, Angular Wicket, Spring Microservices, BigData, flutter, E-comm, Java Telecomm and More

Sunday, September 12, 2021

Saturday, August 21, 2021

Monday, July 26, 2021

Creating a Batch Service

 To start from scratch, move on to Starting with Spring Initializr.

To skip the basics, do the following:

When you finish, you can check your results against the code in gs-batch-processing/complete.

Business Data

Typically, your customer or a business analyst supplies a spreadsheet. For this simple example, you can find some made-up data in src/main/resources/sample-data.csv:

Jill,Doe
Joe,Doe
Justin,Doe
Jane,Doe
John,Doe

This spreadsheet contains a first name and a last name on each row, separated by a comma. This is a fairly common pattern that Spring can handle without customization.

Spring batch introduction

Spring Batch is a lightweight, comprehensive batch framework designed to enable the development of robust batch applications vital for the daily operations of enterprise systems. Spring Batch builds upon the characteristics of the Spring Framework that people have come to expect (productivity, POJO-based development approach, and general ease of use), while making it easy for developers to access and leverage more advance enterprise services when necessary. Spring Batch is not a scheduling framework. There are many good enterprise schedulers (such as Quartz, Tivoli, Control-M, etc.) available in both the commercial and open source spaces. It is intended to work in conjunction with a scheduler, not replace a scheduler. 

Spring Batch is also a minimalistic framework to run batch processing applications. It provides reusable functions that are essential in processing large volumes of records, including logging/tracing, transaction management, job processing statistics, job restart, skip, and resource management. It also provides more advanced technical services and features that will enable extremely high-volume and high-performance batch jobs through optimization and partitioning techniques. Simple as well as complex, high-volume batch jobs can leverage the framework in a highly scalable manner to process significant volumes of information.

Spring Batch provides reusable functions that are essential in processing large volumes of records, including logging/tracing, transaction management, job processing statistics, job restart, skip, and resource management. It also provides more advanced technical services and features that enable extremely high-volume and high performance batch jobs through optimization and partitioning techniques. Spring Batch can be used in both simple use cases (such as reading a file into a database or running a stored procedure) as well as complex, high volume use cases (such as moving high volumes of data between databases, transforming it, and so on). High-volume batch jobs can leverage the framework in a highly scalable manner to process significant volumes of information.

Saturday, July 24, 2021

What is backbase

What are Digital Banking Platforms (DBP)?

A digital banking platform (DBP) enables a bank to begin the transformational process of becoming a truly digital bank that is ecosystem-centric. A DBP also enables banks to achieve business optimization. However, that is not the end state. For banks seeking only business optimization as the goal of their digital banking strategy, a digital banking multichannel solution will meet those needs.

Installation mdbootstrap 5

Step 1

Download the package

Step 2

Unzip downloaded package and open it in the code editor

Step 3

Open Dreamweaver editor and create a HTML site.

Find a template site and copy an index.html file to your project and compose your website. And yes, it's that simple! 

Importing CSS file

To import MDB stylesheet please use the following syntax:

<!-- Font Awesome -->

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css" />

<!-- Google Fonts Roboto -->

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" />

 <link rel="stylesheet" href="css/mdb.min.css" />

Importing JS file

<script href="js/mdb.min.js"></script>

Run: click index.html file to open it on browser

and it works

Wednesday, March 3, 2021

Amazon SQS as an Event Source to AWS Lambda 

 What is Amazon Simple Queue Service?

Amazon Simple Queue Service (Amazon SQS) offers a secure, durable, and available hosted queue that lets you integrate and decouple distributed software systems and components (send, receive, and delete a message). Amazon SQS offers common constructs such as dead-letter queues and cost allocation tags. It provides a generic web services API that you can access using any programming language that the AWS SDK supports.

Amazon SQS supports both standard and FIFO queues. For more information, see Queue types.

In AWS, SQS can be an event source to Lambda, all that heavy lifting of managing message polling and deleting has been offloaded to the Lambda service, which is now your SQS consumer. It should be called Lambda SQS Consumer Service.

 Lambda is doing the scaling of consumers of YOUR SQS queue for messages, receiving messages, and passing those messages to your Lambda function, and then deleting those messages when your Lambda function successfully handles the message(s) received. This is all explained in more detail here.

Below is a nice visual of what’s going on with this integration.


If you already know enough about SQS as an event source and how the AWS Lambda integration works, skip the preamble and move onto Get Started using the included end-to-end CloudFormation template and then come back for a deeper dive.

Get Started — Backend

I created a CloudFormation template that will provision: 

  1. A standard SQS queue.
  2. A dead letter queue.
  3. AWS Lambda function for handling messages.
  4. The event source mapping.
  5. Lambda execution permissions to SQS and SNS for sending SMS text message. 

Click on the template to launch the CloudFormation console to begin building your stack. The template defaults to the US West Oregon region (us-west-2).

Once the stack completes, you can now test the setup as follows:

1. In the Amazon SQS console, send messages to the queue.

2. AWS Lambda polls the queue and when it detects new messages, it invokes your Lambda function by passing in the event data from the queue.

3. Your function executes and creates logs in Amazon CloudWatch. You can verify the logs reported in the Amazon CloudWatch Logs console.

To really see the value of SQS, checkout my sample iOS Swift application (you can download it from GitHub here) that demonstrates single and batch messages.

AWS Lambda service (not your Lambda function, but a Lambda SQS long-poll service running on your behalf) polls your SQS queue continually for incoming messages. When a message arrives, it receives the message(s) and then invokes your Lambda function by passing the message(s) as a parameter.

From: https://dzone.com/articles/amazon-sqs-as-an-event-source-to-aws-lambda-a-deep


Configuring a queue to trigger an AWS Lambda function (console)

You can use an AWS Lambda function to process messages in an Amazon SQS queue. Lambda polls the queue and invokes your Lambda function synchronously with an event that contains queue messages. You can specify another queue to act as a dead-letter queue for messages that your Lambda function can't process. 

A Lambda function can process items from multiple queues (using one Lambda event source for each queue). You can use the same queue with multiple Lambda functions. 

If you associate an encrypted queue with a Lambda function but Lambda doesn't poll for messages, add the kms:Decrypt permission to your Lambda execution role. 

Note the following restrictions:

Your queue and the Lambda function must be in the same AWS Region.

An encrypted queue that uses the default key (AWS managed CMK for Amazon SQS) cannot invoke a Lambda function in a different AWS account. 

For information about implementing the Lambda function, see Using AWS Lambda with Amazon SQS in the AWS Lambda Developer Guide. 

Prerequisites

To configure Lambda function triggers, you must meet the following requirements:

If you use an IAM user, your Amazon SQS role must include the following permissions:

lambda:CreateEventSourceMapping

lambda:ListEventSourceMappings

lambda:ListFunctions

The Lambda execution role must include the following permissions:

sqs:DeleteMessage

sqs:GetQueueAttributes

sqs:ReceiveMessage

If you associate an encrypted queue with a Lambda function, add the kms:Decrypt permission to the Lambda execution role. 

For more information, see Overview of managing access in Amazon SQS. 

To configure a queue to trigger a Lambda function (console) 

1. Open the Amazon SQS console at https://console.aws.amazon.com/sqs/

In the navigation pane, choose Queues. 

On the Queues page, choose the queue to configure. 

On the queue's page, choose the Lambda triggers tab. 

On the Lambda triggers page, choose a Lambda trigger. 

If the list doesn't include the Lambda trigger that you need, choose Configure Lambda function trigger. Enter the Amazon Resource Name (ARN) of the Lambda function or choose an existing resource. Then choose Save. 

Choose Save. The console saves the configuration and displays the Details page for the queue. 

On the Details page, the Lambda triggers tab displays the Lambda function and its status. It takes approximately 1 minute for the Lambda function to become associated with your queue. 

To verify the results of the configuration, send a message to your queue and then view the triggered Lambda function in the Lambda console. 


https://devblog.croquis.com/ko/2017-05-13-1-aws-serverless-1/



Tuesday, March 2, 2021

Beginning Amazon DynamoDB

What Is Amazon DynamoDB?

Amazon DynamoDB is a fully managed NoSQL database service that provides fast and predictable performance with seamless scalability. 

NoSQL is a term used to describe nonrelational database systems that are highly available, scalable, and optimized for high performance. Instead of the relational model, NoSQL databases (like DynamoDB) use alternate models for data management, such as key-value pairs or document storage. For more information, see http://aws.amazon.com/nosql.

Friday, January 1, 2021

VUE3 for Java developer

What is Vue.js and VUE 3 features?

Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries (opens new window)

Vue 3 was officially released on September 18, 2020. While it has some great new features, especially having full TypeScript support which is the same as Angular 10. New Features in Vue 3 are

  •     Composition API (built-in now)
  •     Full TypeScript support
  •     Portals
  •     Fragments
  •     Suspense
  •     Global Mounting/Configuration API change
  •     Multiple v-models
  •     Custom Directive API
  •     Multiple root elements (Template syntax )
  •     Better reactivity
  •     Emits Component Option

Easy integration is one important feature of VUE so that It is now easy to integrate with java frameworks such as Apache wicket, Play framework, Spring framework.. Java backend developer can be easy to understand VUE 3 so that they will improve their weakness with frontend.

Some VUE 3 details

The Composition API is introduced in Vue 3 as an alternative to the Options API in vuejs 2.x. 
It would be much nicer if we could collocate code related to the same logical concern. And this is exactly what the Composition API enables us to do. To start working with the Composition API we first need a place where we can actually use it. In a Vue component, we call this place the setup.
The setup option should be a function that accepts props and context which we will talk about later. Additionally, everything that we return from setup will be exposed to the rest of our component (computed properties, methods, lifecycle hooks and so on) as well as to the component's template. The setup method is also where all the action happens. This method gets called after beforeCreate and right before the created lifecycle hooks. Notice that setup is the only function inside our component.  
beforeCreate() => setup() => create()

For example:

import {defineComponent, ref, computed} from 'vue';

export default defineComponent({
  name: 'HelloNewYear',
  components: {},
  props: {
    msg: Object,
  },
  setup(props) {
      const msg = ref('msg');      
      const updateMsg = (newValue) => msg.value = newValue;
  
      return { msg, updateMsg }
  }
});

Lifecycle inside setup() includes 9 lifecycles:
  •     onBeforeMount
  •     onMouted
  •     onBeforeUpdate
  •     onUpdated
  •     onBeforeUnmount
  •     onUnmount
  •     onActivated
  •     onDeactivated
  •     onErrorCaptured
  •     onRenderTracked
  •     onRenderTriggered


Full TypeScript support

Vue 3 has full TypeScript support. For example, 

To create mixins in TypeScript, we must first create our mixin file, which contains the data we share with other components.

Create a file called MsgMixin.ts inside the mixins directory and add the following mixin, which shares the project name and a method to update the project name.

import { Component, Vue } from 'vue-property-decorator'
@Component
class MsgMixin extends Vue {
  public msgName: string = 'My Message
  public setMsgName(newVal: string): void {
    this.msgName = newVal
  }
}
export default MsgMixin

Multiple root elements (template syntax )
In Vue 2,  the template tag can only take one root element. In Vue 3, There is no need for a root element anymore.
We can use any number of tags directly inside the <template></template> section:

<template>
  <p> Count: {{ count }} </p>
  <button @click="increment"> Increment </button>
  <button @click="decrement"> Decrement</button>
</template>
Equivalent code in Vue 2:

<template>
  <div class="counter">
    <p> Count: {{ count }} </p>
    <button @click="increment"> Increment </button>
    <button @click="decrement"> Decrement</button>
  </div>
</template>


Suspense

Suspense is a special component that renders a fallback content instead of your component until a condition is met. 


Provide / inject

In Vue 2, we used props for passing data – such as string, arrays, objects, and so on – from a parent component directly to its children component. But in many cases, we also need to pass data from the parent component to a deeply nested child component which is, not so appropriate and becoming complicated in normal cases.
Vue 3 use the new Provide and inject pair to pass data with vuex.


Teleport is a new feature that makes it easy to display a component outside its default position i.e the #app container where Vue apps are usually wrapped. You can, for example, use Teleport to display a header component outside the #app div. Please note that you can only Teleport to elements that exist outside of the Vue DOM.

Global Mounting/Configuration API Change
It has simple command as following
import { createApp } from 'vue'
import App from './App.vue'

const app = createApp(App)

app.config.ignoredElements = [/^app-/]
app.use(/* ... */)
app.mixin(/* ... */)
app.component(/* ... */)
app.directive(/* ... */)

app.mount('#app')


Multiple v-Models
for example, to bind and listen to multiple properties in components:
<NameComponent
  v-model:fornames="forname"
  v-model:surname="surname"
/>

Understanding Vue 3 Ref for Reactive Variables

In this section, we'll learn about the ref() function in Vue 3. In Vue 3, you can use the ref() function to define a reactive variable. It can wrap any primitive or object and return it’s reactive reference. The value of passed element will be kept in a value property of the created reference. For example if you want to access value of count reference you need to explicitly ask for count.value. 


ParametersANGULARVUE
Easy Integration

Angular is a Javascript framework, making easier for developers to integrate it with third-party components and other Javascript-based technologies.

 

On the other hand, Vue is a versatile and a flexible framework. It facilitates front-end libraries integration easily.



Flexibility

Angular framework is considered highly flexible as it offers official support to multiple systems without any restriction.

At the same time, Vue is not as flexible as Angular. It's a bit rigid. There are some rules which need to be followed while working on an application. Still, it provides flexibility for modular solutions.

Complexity

Angular framework is much more complex than Vue when it comes to design and API. A non-trivial application development takes more time with Angular than Vue.

Developing a non-trivial application takes less time when integrating with Vue. If we talk about design and API, Vue is considered simpler.

TypeScript

The learning resources provided by Angular are Typescript based so it acts as a booster for the developers and at the same time difficult for the beginners to learn.

Vue recently got the Typescript functionality, but it is not currently in use.

 

Performance

Angular has performed well till date. It doesn't disappoint. Angular is best known for its fast performance. Despite having a lot of watchers, Angular guarantee the same performance metrics on different platforms. 

Vue also delivers the same quality performance as Angular. Both of them perform outstandingly on different benchmarks and at the same time addressing similar issues.

Data bindingAngular utilizes a two-way binding process between scopes. In addition to this, it supports asynchronous services to assist developers when they develop third-party components to integrate with the app.

On the other hand, Vue supports one-way data flow between the components. It facilitates non-trivial app development quickly. 

VUE 3 and Angular are both using TypeScript and html/css template opposed to ReactJS that uses HTML (JSX) inside JavaScript.

Thursday, December 31, 2020

Popular Posts

Blog Archive