teleren/devto huggingface dataset:
I developed "Animated Background" a Flutter app for implementing "iOS Login" UI/UX design by Mike Ivanchyshyn
Tags: flutter, ui, ux, app
Published: 2019-03-02 10:39:53

---
title: I developed "Animated Background" a Flutter app for implementing "iOS Login" UI/UX design by Mike Ivanchyshyn
published: true
description: This Flutter app is part of a collection of apps that I developed with the purpose of mastering the necessary skills for implementing custom UI/UX designs in Android and iOS.
tags: #flutter #ui #ux #app
---

This app is part of a collection of apps that I developed in Flutter with the purpose of mastering the necessary skills for implementing custom UI/UX designs in Android and iOS.

You can find the entire collection of apps in [this blog post](https://dev.to/crivasgomez/flutter-uiux-design-implementations-518i) and all the source code in [this GitHub repository](https://github.com/CRivasGomez/flutter-ui-ux-designs).

## Animated Background

### [Original design](https://www.uplabs.com/posts/ios-login-template-freebie) by [Mike Ivanchyshyn](https://www.uplabs.com/imvasyl):

![Original design](https://thepracticaldev.s3.amazonaws.com/i/4p3683coexw63jd2md1f.gif)

### iOS demo:

![iOS demo](https://thepracticaldev.s3.amazonaws.com/i/4m7ve4p83x6dtzinlgw2.gif)

### Android demo:

![Android demo](https://thepracticaldev.s3.amazonaws.com/i/3pls9ukawr51g5shwssz.gif)
How to bypass no paste controls on a web form
Tags: javascript, devtools, softwaretesting, webtesting
Published: 2019-03-02 10:25:11

---
title: How to bypass no paste controls on a web form
published: true
description: Web sites sometimes try to prevent us pasting data into web form fields. This is usually pretty simple to bypass and in this post (and video) I show how.
tags: JavaScript, DevTools, SoftwareTesting, WebTesting
canonical: https://www.eviltester.com/2019/02/bypassing-no-paste-fields.html
---

Just because a site says we can't paste into a field, doesn't mean we have to believe it.

<!--more-->

Inspired by this blog post:

[dev.to/claireparker/how-to-prevent-pasting-into-input-fields-nn](https://dev.to/claireparker/how-to-prevent-pasting-into-input-fields-nn)


Clair Parker-Jones shows how to prevent people pasting into input fields. This is common code and you'll see it on StackOverflow a lot. Claire's post seemed to receive a lot of flack comments but, people do this and she just wanted to learn how it was done and shared that knowledge. She also put the time into creating a codepen example which you can explore and experiment with.

I forked the example code in here:

https://codepen.io/eviltester/pen/WPpJGo

This is terrible UX pattern but we see it all the time. And as testers we have to work with it, or workaround it.

## How to bypass no paste code?

So how do we bypass it?

- inspect and remove listener in the dev tools
- with code from the console:

~~~~~~~~ 
document.getElementById("paste-no").onpaste={};
~~~~~~~~

~~~~~~~~
document.getElementById("paste-no").onpaste=null;
~~~~~~~~

~~~~~~~~
document.getElementById("paste-no").onpaste=new function(){};
~~~~~~~~

If it wasn't in a frame it would be easy to create a bookmarklet. Creating a bookmarklet can be done, but it is a little bit more complicated than if it wasn't in a frame. For information on bookmarklets and frames see https://www.irt.org/articles/js170/

Everything in the GUI is ours to observe, interrogate and manipulate. Which is why as testers, the more we understand the technology and the tools, the more we open up possibilities and options in our testing. And we should not limit our testing to the obvious 'happy' paths in the GUI.

If you are interested in learning this type of thing then I have an online course:

https://eviltester.com/techwebtest101

I have a follow on exclusive video for Patreons which shows showing another way to bypass the pasting (amending the WebElement value attribute) and discussing this in more detail in relation to Software Testing, Risk and Bug & UX Advocacy.

https://www.patreon.com/posts/24482175

## Free Video Showing How to Paste into No Paste Fields

{% youtube 4DRcv0E2xk8 %}
XAMPP vs WAMP – Best Local Server for Web Development in 2020
Tags: softwaredevelopment, wamp, xampp, bestlocalserver
Published: 2020-01-31 21:12:36

---
title: XAMPP vs WAMP – Best Local Server for Web Development in 2020
published: true
tags: Software Development, WAMP ,XAMPP ,Best Local Server
canonical_url: https://www.positronx.io/xampp-vs-wamp/
---

The post [XAMPP vs WAMP – Best Local Server for Web Development?](https://www.positronx.io/xampp-vs-wamp/) appeared first on [positronX.io](https://www.positronx.io).

**Which is one is better? WAMP or XAMPP?**

The battle of **XAMPP vs WAMP** has been a long-standing one. Which server is better? Well, we are going to do a comparative study of XAMPP vs WAMP so that we can find an answer to this query. Both XAMPP and WAMP are available for free downloading. We have been using them to the local web server on our computer.


[Click here to read more](https://www.positronx.io/xampp-vs-wamp/)
Web component not integrating in Angular
Tags: webcomponent, react, notworking, angular
Published: 2019-03-02 08:57:23

---
title: Web component not integrating in Angular
published: true
description: I created one web component in react and have published that.
             When i am trying to integrate it with React application then its                 
             working fine but when i am trying to integrate it with Angular then 
             it's not working
             **https://www.npmjs.com/package/react-fancy-component-demo**
             **https://github.com/anshulkthr/react-fancy-component**
             Kindly check my component and let me know in case of any issue/update.
             If it is fine then let me know the way to integrate it with angular         
             application.
tags: web component, react, not working, angular
---
Mathjax can be edited like mathquill, is it possible? 
Tags: javascript, html, mathjax
Published: 2019-03-02 07:47:34

---
title: Mathjax can be edited like mathquill, is it possible? 
published: True
description: Syntax baru dari HTML kemungkinan besar dapat membuat Mathjax dapat diedit secara langsung di halaman html seperti mathquill, namun apakah semudah itu?...
tags: #javascript #html #mathjax
---

 _For those who are still learning and investigating the greatness of html and javascript today, it's best to multiply learning the original syntax, it will be more productive but the file size is not large.._


The development of HTML / javascript technology is so fast, something that was once impossible, can now be possible.
Without a javascript program, Mathjax can be edited directly like Mathquill, to refine the editing it can be tricked with a simple program from JavaScript.

Roughly all html pages can be edited with a new html syntax, but we should take the important elements.

1. Examples for all htm pages can be edited:
```html
<body contenteditable='true'>
Equation*:

\begin{equation*}
E = mc^2
\end{equation*}

<hr>
Brackets:

\[E = mc^2\]

Brackets tagged:

\[E = mc^2\tag{x}\]

</body>
```

2. examples for elements:
```html
<div contenteditable='true'>\[E = mc^2\tag{x}\] </div>
<span contenteditable='true'>\[E = mc^2\tag{x}\] </span>
```

3. with a piece of javascript:
```html
<span id='mj'> 
\begin {equation}
E = mc ^ 2
\end {equation}
</span>
<script>
document.getElementById ('mj'). ondblclick = function () {return document.getElementById ('mj'). setAttribute ('contenteditable', 'true')};
   document.getElementById ('mj'). onclick = function () {return document.getElementById ('mj'). setAttribute ('contenteditable', 'false')};
</script>
```

### conclusion.

The conclusion is that there is no conclusion because this is still a new thing for me.

I myself am still trying and trying to outsmart tricks according to my reasoning abilities, because there is no reference (Mathjax can be edited) that discusses this (???).
velociraptor tree
Tags: taxonomy
Published: 2019-03-02 06:54:40

---
title: velociraptor tree
published: true
description: 
tags: taxonomy
---
Animalia
Eumetazoa
ParaHoxozoa
Planulozoa
Bilateria
Nephrozoa
Deuterostomia
Chordata
Olfactores
Vertebrata
Myopterygii
Gnathostomata
Eugnathostomata 
Teleostomi
Euteleostomi / Osteichthyes
Sarcopterygii
Rhipidistia
Tetrapodomorpha
Eotetrapodiformes
Elpistostegalia
Stegocephalia
Tetrapoda
Reptiliomorpha
Amniota
Sauropsida
Reptilia
Eureptilia
Romeriida
Diapsida
Neodiapsida
Sauria
Archosauromorpha
Crocopoda 
Archosauriformes
Eucrocopoda
Archosauria
Avesuchia
Avemetatarsalia
Ornithodira
Dinosauromorpha
Dinosauriformes
Dracohors
Dinosauria
Saurischia
Eusaurischia
Theropoda
Neotheropoda
Averostra
Tetanurae
Orionides
Avetheropoda
Coelurosauria
Tyrannoraptora
Maniraptoriformes
Maniraptora
Pennaraptora
Paraves
Eumaniraptora
Dromaeosauridae
Eudromaeosauria
Velociraptor
Chain of Responsibility Design Pattern [Behavioral]
Tags: blog, concepts, designpattern, designpatterns
Published: 2019-03-06 03:28:14

---
title: Chain of Responsibility Design Pattern [Behavioral]
published: true
tags: blog,concepts,Design Pattern,Design Patterns
canonical_url: https://itscoderslife.wordpress.com/2019/03/02/chain-of-responsibility-design-pattern-behavioral/
---

 **Goal** : The primary objective is to decouple the sender of an event or request from potential receivers.

The receiving objects form a chain. Basically, they form a linked list so that each object can reference the next one. The request travels through this chain. Each receiving object can decide whether it processes the request.

If an object doesn’t handle the request, it forwards it to the next handler in the chain. The request travels until one of the responder objects handles it.

If none of the objects processes the request, it will reach the end of the chain and nothing happens.

Sometimes you may need to forward the request even if it was processed by one of the responders. _What happens if none of the responders takes ownership of the request_? The request keeps traveling through the chain until it reaches the end of the chain.

> The chain of responsibility organizes potential request processors in a sequence and decouples responders from callers. The request travels until one of the responders processes it or until itreaches the end of the chain.

_Example flow_: The client fires the request, which reaches the first responder object in the chain. This object doesn’t handle the request, so it forwards it to the next responder. The second responder doesn’t handle the request either. The request travels further through the chain of responders. Now the third responder object decides to handle the request. The request propagation stops here. The next responders are not notified about the request.

_The chain-of-responsibility design pattern stands at the core of the responder chain in iOS and macOS._

- This pattern organizes request processors in a chain.
- Responders may or may not process the request.
- Each responder may handle the request, forward it to the next responder, or forward the request after it processes it.
- The request gets propagated through the chain until it reaches the last responder in the chain.

It is a widely-used pattern that can solve various problems that require passing the request betweenobjects organized in a sequence.

Disadvantage: exposing details of any responder from the chain to other objects in the chain or to the caller.
Betting my career on JAMstack.
Tags: javascript, discuss, webdev, react
Published: 2019-03-02 00:34:32

---
title: Betting my career on JAMstack. 
published: true
description: An few thoughts about the JAMstack, and why I find it compelling enough to bet my career on. 
tags: javascript, discuss, webdev, react
---

My posting declined a bit around the start of the new year, but that has been because I have been pretty busy doing some things.. Those things are the topic of this blog post! In the past few months, I taught a bunch of people how to use Gatsby and Netlify at the Phoenix chapter of the JAMstack meetups, you can see if you have one in your city by visiting [The JAMstack community page!](https://jamstack.org/community/)  I have also taken on a few clients and made their site using Gatsby! I even included NetlifyCMS with one so the client could update their own content, and doing so was so enjoyable I feel as if a long-awaited dream of mine is finally a reality. I have long wished to have a handoff experience for static sites that was good enough to base an entire agency around, and I feel as if that era has finally arrived.

So with that said I would like to announce a few things! 

First, if you want a website or application built, and you want it to be fast, reliable, and most importantly, deliver a rock solid user experience, you should get in touch with me over at [jamstack.consulting](http://jamstack.consulting). I am focusing specifically on clients open to the JAMstack, and will not be taking on projects that use a traditional CMS or a server side monolith. Going forward I think there is more than enough work to build an agency specializing in this type of work, and I really hope to build [jamstack.consulting](https://jamstack.consulting) into something great. 

Second, if you want to learn how to build websites and applications in this manner you are in luck! I am also working on [jamstack.courses](http://jamstack.courses) and that is for you! The first course will be a thorough introduction to the most amazing web framework around Gatsby JS! You will put together a personal blog and portfolio that will load at the speed of light and leave jaws on the floor. Be sure to leave your email so I can notify you when that is available. 

So as you can see, I have unified my efforts to have a single focus. The JAMstack! I am eager to teach you all about it in coming blog posts, courses, and products. I think the web is fundamentally changing, and I want to document my exploration of what I believe to be a better, more modern way of building for the web.
New Feature: Milestone Notifications!
Tags: meta, changelog
Published: 2019-03-01 23:54:32

---
title: New Feature: Milestone Notifications!
published: true
description: You'll now receive notifications when you hit the big numbers!
tags: meta, changelog
cover_image: https://thepracticaldev.s3.amazonaws.com/i/vh8mlczx8xxehgj8jgco.gif
---

You now will receive notifications when you reach a new milestone for your posts! The current milestones are when your post hit a certain number of views or reactions.  When you receive a notification, you'll see a random fun and congratulatory `gif` like this one:
![Andy Samberg from Hot Rod says, "Let's Celebrate."](https://media.giphy.com/media/Sk5uipPXyBjfW/giphy.gif)


Since we're open source, we welcome you to add your own `gifs` from [Giphy](https://giphy.com) to congratulate your fellow community members. The gif should be square-like, and not too tall. Too wide is better than too tall. You'll need the Giphy ID code and the aspect ratio, calculated as `height / width`. You can see the code for it here: https://github.com/thepracticaldev/dev.to/blob/master/app/labor/random_gif.rb

Happy coding!
Defending Submoduals for Git
Tags: git
Published: 2018-12-13 05:26:24

---
title: Defending Submoduals for Git
published: true
description: I like submoduals, I've learned to take it back a notch. 
tags: git
---

Submoduals tend to get dismissed as a bad solution and alternatives would be package managers (nuget) or even git subtrees.

Let me start with the ideal. For a given program all the source for every part is saved in a single repository and neatly organized. In this ideal world the is no other program, code sharing is only within the different components of this program. (I don't want you to image what kind of code base would be a browser and Unreal engine... This world only cares about the standard app you write today)

Why is this ideal? Because any bug fix or feature is fully controlled from a single location. But reality hits and we have many reasons to separate our code. 

* different languages needing different build pipelines 
* build time
* share with other applications 
* enforce separation of concerns

I want to advocate for submoduals over package managers for your internal and developed components. If you are in control of the source and it is not used by others you don't need to coordinate a release, set up internal package repos, expand your storage to permanently retain official releases. Especially if these components can't be thoroughly tested separate from the parts they plug into.

With submoduals a project can share parts of code, the code can change and be utilized as each project needs it to. Yes managing the changes and propagating fixes to all requires action. Each alternative has the same challenge it just uses different mechanics.

I do wish there was better tool support for submoduals, git has been getting the appropriate attention though.
Shorti Update for Plain Text
Tags: rails, opensource
Published: 2019-03-04 14:14:56

---
title: Shorti Update for Plain Text
published: true
tags: [rails, oss]
canonical_url: https://github.com/scottwater/shorti/commit/8a35779146e9c1e63b753ff282844529801eab3f
---

[Shorti Update for Plain Text](https://smw.fyi/4D)

Made a change to Shorti makes it much easier to script.

Now (well, four weeks ago 😞) I made a change to only return JSON if the API request sets the accept header to `application/json`.
Add a php.ini setting for gitlab-ci
Tags: gitlabci, php, debian
Published: 2019-03-01 21:53:10

---
title: Add a php.ini setting for gitlab-ci
published: true
description: how to easily set a php.ini config value in gitlab-ci
tags: #gitlab-ci, #php, #debian
cover_image: https://thepracticaldev.s3.amazonaws.com/i/cf9z7n5om3j9jz85tfzh.jpg
---
sometimes you need to change a php.ini setting on the fly in your gitlab-ci. this is quite easy.

simple run something like:
```
echo 'phar.readonly="0"' >> /etc/php/7.1/cli/conf.d/ci.ini
```

i used my debian stretch docker file, which uses the https://deb.sury.org/ repository for php. your directory structure may differ.

you can find out where php is loading its config files from by running:

```
php --ini
```

this prints a list similar to this:

```
$ php --ini
Configuration File (php.ini) Path: /etc/php/7.1/cli
Loaded Configuration File:         /etc/php/7.1/cli/php.ini
Scan for additional .ini files in: /etc/php/7.1/cli/conf.d
Additional .ini files parsed:      /etc/php/7.1/cli/conf.d/10-mysqlnd.ini,
/etc/php/7.1/cli/conf.d/10-opcache.ini,
/etc/php/7.1/cli/conf.d/10-pdo.ini,
/etc/php/7.1/cli/conf.d/15-xml.ini,
/etc/php/7.1/cli/conf.d/20-apcu.ini,
/etc/php/7.1/cli/conf.d/20-apcu_bc.ini,
/etc/php/7.1/cli/conf.d/20-bcmath.ini,
/etc/php/7.1/cli/conf.d/20-bz2.ini,
/etc/php/7.1/cli/conf.d/20-calendar.ini,
/etc/php/7.1/cli/conf.d/20-ctype.ini,
...
```

in debian all files in the `conf.d` directory are included. so we only need to put it inside this directory. you can also append the config to the main file `php.ini`.


relevant part from the `gitlab-ci.yml`:
```
image: c33s/php:7.1
...
build:
  stage: build
  script:
    - composer install
    - php --ini
    - echo 'phar.readonly="0"' >> /etc/php/7.1/cli/conf.d/ci.ini
    - wget https://github.com/box-project/box2/releases/download/2.7.5/box-2.7.5.phar
    - php box-2.7.5.phar build
    - php satis.phar --version
...
```

- cover image by www_darkworkx_de https://pixabay.com/photos/devops-business-process-improvement-3155972/
toString or not to toString?  This is the question
Tags: java, tostring, beginners, override
Published: 2019-03-01 21:31:27

---
title: toString or not to toString?  This is the question
published: true
description: what to expect by passing an Object to print function in Java
tags: Java, toString,beginner,override
---


A **"Hello World!"** program which prints this sentence on the screen is the very first program almost any programmer writes.
It might have happened to you that you passed an Object to print or println methods and as a result have received a weird **name@number** answer.
In this example we pass an Object to println function without any addition.

```java
public class ActionClass {
    public static void main(String[] args) {
        Book book = new Book("Odyssey","Homer");
        System.out.println(book);
    }

    private static class Book {
        String name;
        String author;

        public Book(String name, String author) {
            this.name = name;
            this.author = author;
        }
    }
}
```

The Result might appear as below:

```css
Book@5a39699c
```
Classes are known as **reference variable**. a reference variable is capable of storing the location of an object.
By going a little more in in detail we see that the reason is because of print function's implementation. By passing an Object to a print function the actual command that we write is:
```css
System.out.println(book);
```
But what Java sees and runs is:
```css
System.out.println(book.toString());
```
Hmmm. Now we have another Method to look at. Under the hood toString() method looks like this:
```java
public String toString() {
        return this.getClass().getName() + "@" + Integer.toHexString(this.hashCode());
    }
```
Aha, that explains the mysterious case of **className@weirdNumber**.

Any suggestion?
yes of course. By overriding the **toString()** method for our Object we can easily pass the object to print methods without turning them to strings.

```java
@Override
        public String toString() {
            return "Book{" +
                    "name='" + name + '\'' +
                    ", author='" + author + '\'' +
                    '}';
        }
```

After doing so the first code we wrote in this article will have a result as below without adding **toString()** method to it.
```css
Book{name='Odyssey', author='Homer'}
```
A short guide to setup a Jupyter notebook for Ruby (on a mac, with a fish shell)
Tags: jupyter, mac, fish, ruby
Published: 2019-03-01 20:42:22

---
title: A short guide to setup a Jupyter notebook for Ruby (on a mac, with a fish shell)
published: true
description: A short guide to setup a Jupyter notebook with Ruby on macOS, with Fish shell.
tags: jupyter, mac, fish, ruby
---

### 0. have Homebrew install

see https://brew.sh for instructions

### 0. have Ruby installed in some form

I suggest [rbenv](https://github.com/rbenv/rbenv)

### 1. download Anaconda from https://www.anaconda.com/downloads

### 2. install :point_up: (VS Code is optional, feel free to skip it)

### 3. `set -g fish_user_paths /anaconda3/bin/ $fish_user_paths`

### 4. test with `jupyter notebook`

* it should open a browser window to the working directory
* the next steps will add a "Ruby" option to the "New > Notebook" menu (up right)

### 5. install iRuby

instructions adapted from https://github.com/sciruby/iruby#homebrew

```shell
brew install automake gmp libtool wget
brew install zeromq --HEAD
brew install czmq --HEAD

set -x LIBZMQ_PATH (brew --prefix zeromq)/lib
set -x LIBCZMQ_PATH (brew --prefix czmq)/lib

gem install cztop
gem install iruby --pre
iruby register --force
```

### 6. restart your Jupyter notebook (`Ctrl-C` in the terminal it is running and then start it up again)

# 🎉