An introduction to asynchronous operations and Android multithreading

What is Thread and multithreading? Thread is a series of instructions within a program that can be executed independently of other code. If the computer has multiple processors and an operating system that supports the so-called multithreading, it allows programmers to design programs whose threads can be executed simultaneously. Thread mechanisms “Looper” and “MessageQueue” are … Read more

Activity within the android operating system

What is android activity? Android applications are a collection of tasks, where each task has its own functionality. These functionalities can be divided into four Android components: Functionality Android class Example User interaction Activity Entering a note, playing a computer game A background process that runs for a long time even when the user is … Read more

Development of mobile applications

Introduction A mobile application is a program designed to run on a mobile device such as a mobile phone, tablet or wearable (smart watch…). Those applications have access to sensors and specific functionalities of the device (camera, gyroscope, vibration, etc.). Developing applications for mobile devices requires considering the characteristics of these devices and their limitations … Read more

Characteristics and specificities of the routes

The “route” object contains all the information about the current route, which can always be accessed from the application through one of its properties:

$route.path – A string equal to the path of the current route, always resolved as an absolute path (eg “/user/profile”).
$route.params – A key/value object used to return data from dynamic routes. If there are no parameters, the value will be an empty object.
$route.query – An object in the form of key/value pairs used to return query string data.
$route.fullPath – full URL including query and hash.
$route.matched – An array containing the path records of the current route
$route.name – The name of the current route if it is defined
$route.redirectedFrom – The name of the route from which the redirection was performed, if there is a redirection

Basics of routing with Vue.js

In web application development, routing is all about user interface separation. Splitting the application into several different pages is necessary for easier viewing of a complex application. In the roughest terms, routing is the definition of rules with the help of which appropriate content is associated with a request submitted by a specific URL address. Routing is often divided into two main sections:

a) Server-side routing
b) Client-side routing

Animate multiple elements at once “transition-group”

List rendering is very often used in programming, the most common being dynamic list rendering when rendering a series of similarly grouped information.
This article explains how to animate such lists with the Vue.js framework. To animate multiple elements, we cannot use the “transition” component, because it can “wrap” ONLY ONE HTML element, therefore Vue.js introduces a new type of wrapper component, called .

Transition when replacing elements with Vue.js

During the transition, the property change on both elements occurs simultaneously. As a result, both elements are visible during the animation (which is not the most beautiful). The new element that has yet to be rendered is always positioned below the disappearing element. It is unnatural that that element comes to the right place only when the first element completely disappears, ie. when the animation is finished (and then the jump of the element is noticed).
In order to avoid this ugly behavior, it is necessary that the disappearing element completely finishes the animation, before the animation of the appearing element starts. Vue.js achieves this by defining the so-called fashion transition.
There are two possibilities for the value of the “mode” attribute:

The basics of animation with Vue.js

Vue.js has mechanisms for easily integrating CSS animation over an HTML element. Vue.js enables CSS animation by automatically adding specific classes to the HTML element at a certain moment of animation, after which we can use them to define CSS properties for animation.
In addition, Vue.js enables animation with JavaScript because with “transition hooks” (“custom events” that are “triggered” by Vue.js according to the determined timing of the animation) it enables the use of JavaScript for direct manipulation of the DOM.
Also with Vue.js there is the possibility to easily integrate 3rd-party CSS animation libraries (eg Animate.css) or 3rd-party JavaScript animation libraries (eg Velocity.js or GreenSock).

Filtering with Vue.js

A Vue filter is essentially a function that takes a value, processes it, and then returns the processed value. Filters are not substitutes for methods, computed properties, or watch properties, because filters do not transform data, but only transform the output that the user sees. Filters can be nested and, like all functions, can take arguments. When a filter is used, its context is set to the instance that refers to it, so the “this” keyword points to it.