teleren/devto huggingface dataset:
Skipping a @perlwchallenge week, to do some #judo coding in #perl
Tags: uncategorized
Published: 2020-08-30 14:47:10

---
title: Skipping a @perlwchallenge week, to do some #judo coding in #perl
published: true
date: 2020-08-30 13:54:22 UTC
tags: Uncategorized
canonical_url: https://lancewicks.com/2020/08/30/skipping-a-perlwchallenge-week-to-do-some-judo-coding-in-perl
---

This week, I tried to do week 75 and it just did not click. ![🙁](https://s.w.org/images/core/emoji/13.0.0/72x72/1f641.png)

That said, I did do some Perl coding for someone looking at doing some research into Judo. They reached out to me as a result of my [http://rwjl.net](http://rwjl.net) site I think. On that page I ran a research project into an alternative ranking system for Olympic Judo using the ELO system used in Chess.

So the request via email, was a great surprise. It came from someone I deeply respect; so helping was a pleasure.

Perl, has always been a tool for automating tasks. It is the superglue for many tasks. So this week I used it to automate collating some competition results into a format that suited.

Specifically… the dreaded CSV format.

But being Perl, this was easy! just two lines and it was done.

So skipping to the CSV bit, I have an array of hashes. Each entry is the result of a contest in a international Judo competition. To write this data out to a .CSV file in perl looks like this:

```
use Text::CSV_XS 'csv';

...

my $err = csv( in => \@data, out => "summary_data.csv" );
```

That’s basically it; copied directly from the POD documentation for the module ([Text::CSV\_XS](https://metacpan.org/pod/Text::CSV_XS?utm_source=rss&utm_medium=rss)).

This took the 167,000+ lines of data and produced a CSV with almost zero fuss. Perl rocks!
Can markdown of dev.to do this ?
Tags: markdown, syntax, dev
Published: 2020-08-30 13:44:19


## TOC
- [❓ wrap line in code (manually wrap)](#wrap_line_in_code) <a name='toc_wrap_line_in_code'></a>
- [✅ support strikethrough](#strikethrough) <a name='toc_strikethrough'></a>
- [✅ support table](#table) <a name='toc_table'></a>
- [✅ support emoji](#textual_emoji) <a name='toc_emoji'></a>


---


## ❓ <a name='wrap_line_in_code'>wrap line in code (manually wrap)</a>  <a href='#toc_wrap_line_in_code'>:back:</a>

```
error connecting to host: could not connect to 
server:server selection error: server selection timeout, 
current topology: { Type: ReplicaSetNoPrimary, Servers: 
[{ Addr: admin:27017, Type: Unknown, State: Connected, 
Average RTT: 0, Last error: connection() : dial tcp: 
lookup admin: no such host }, ] }
```

## ✅ <a name='strikethrough'>support strikethrough</a>  <a href='#toc_strikethrough'>:back:</a>

``` markdown
~~Strikethrough~~ (❗️ no space between text)
```
~~Strikethrough~~

## ✅ <a name='table'>support table</a>  <a href='#toc_table'>:back:</a>

``` markdown
First Header | Second Header
------------ | -------------
Content from cell 1 | Content from cell 2
Content in the first column | Content in the second column
```
First Header | Second Header
------------ | -------------
Content from cell 1 | Content from cell 2
Content in the first column | Content in the second column

## ✅ <a name='textual_emoji'>support emoji</a>  <a href='#toc_emoji'>:back:</a>

`:warning:`
:warning:
__THAKS [reply](https://dev.to/titanhero/comment/14917)__
Sharing templates with Scaffolder!
Tags: javascript, githunt, productivity, github
Published: 2020-08-30 12:58:22

Sharing templates with [Scaffolder](https://github.com/galElmalah/scaffolder) is now possible via Github!
So how does it work? you simply upload your templates to a Github repository under a **scaffolder** folder and you are good to go!
To actually generate one of those templates, you will need to run the following command `scaff i --from-github` and you will be prompted to enter a repository from which you want to consume templates.
You can see an [example repo here](https://github.com/galElmalah/scaffolder-templates-example).

Currently, this feature is only supported in the interactive CLI mode, but support for the [vs-code extension](https://marketplace.visualstudio.com/items?itemName=ctf-vscode.scaffolder-vscode) and the normal cli flow will drop in soon.

For more information about scaffolder and this feature check out [scaffolder repository](https://github.com/galElmalah/scaffolder).
And don't be shy, feel free to star the scaffolder repository ;)

Got any feature requests or improvements in mind? feel free to open an issue :)

{% link https://dev.to/galelmalah/what-is-scaffolder-and-how-you-can-use-it-to-increase-your-team-dev-velocity-558l %}

{% github galElmalah/scaffolder %}
TIL - CSS Basics
Tags: css, beginners, pseudoclass
Published: 2020-08-30 12:55:23

HTML is styled with Cascading Style Sheets - it is commenly "called" in a HTML file.

##CSS- Property
my-selector {
    property: value;
    property: value;
}

[List of CSS properties](https://cssreference.io/)

**Prioritisation** depending on how the CSS is called:
1. CSS inline (highest priority) ;
2. CSS in internal stylesheet ;
3. CSS in external stylesheet
 * last CSS file called has priority
 * -> external stylesheet is king. seperate HTML + CSS!

##Pseudo-classes 
[List of Pseudo-Classes](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes)

![Pseudo-classes](https://designshack.net/wp-content/uploads/css-beforeafter-6.jpg)

**Stylize** a particular state
    - :link – A link the user has never visited.
    - :visited – A link the user has visited before.
    - :hover – A link with the user’s mouse over it.
    - :active – A link that’s being pressed down by a mouse (or finger).

**Structure**
:first-child, :nth-child , :first-of-type, :nth-of-type 


[CSS GAME](https://flukeout.github.io/)

[first step](https://codepen.io/aquin/pen/XWdXqZo)
Difference between Gb and Gib ?
Tags: computerscience, memory
Published: 2020-08-30 12:51:18

When buying disk drives, 1 GB is regularly characterized as 1,000,000,000 bytes. Notwithstanding, when seen by a working OS, the limit showed is frequently not as much as this. For instance, another 1 TB hard drive would be accounted for by the OS as 931 GB (this is 931 GiB). GiB (Gibibytes) is a standard unit utilized in the field of information handling and transmission and is characterized as base 1024 as opposed to base 1000.



**Example:** 1 GB is defined as 1000³ bytes, whereas 1 GiB is defined as 1024³ bytes.

### Units of Measure & Bytes
1. Kilobyte (KB)	1000¹ = 1,000
2. Megabyte (MB)	1000² = 1,000,000
3. Gigabyte (GB)	1000³ = 1,000,000,000
4. Terabyte (TB)	1000⁴ = 1,000,000,000,000
5. Petabyte (PB)	1000⁵ = 1,000,000,000,000,000
6. Kibibyte (KiB)	1024¹ = 1,024
7. Mebibyte (MiB)	1024² = 1,048,576
8. Gibibyte (GiB)	1024³ = 1,073,741,824
9. Tebibyte (TiB)	1024⁴ = 1,099,511,627,776
10. Pebibyte (PiB)	1024⁵ = 1,125,899,906,842,624

### How is this converted?
**GB to GiB**

Multiply by (1000³ / 1024³), equivalent to 0.931323

Divide by this value to go from GiB to GB

**TB to TiB**

Multiply by (1000⁴ / 1024⁴), equivalent to 0.909495

Divide by this value to go from TiB to TB

**GiB to TiB**

Divide by 1024

Multiply by 1024 to go from TiB to GiB

**GiB to TB**

Convert into GB by dividing by 0.931323, then divide by 1000 to get into TB


Hope you like this Post :) & learned something new.
Why Rust is a great language to learn
Tags: rust, webassembly, healthydebate
Published: 2020-08-30 12:43:09

---
title: Why Rust is a great language to learn
description: Learning Rust
canonical_url: https://blog.alexandrudanpop.dev/posts/why-rust-is-a-great-language-to-learn-in-2020-50p1/
---
I was looking at **Rust** today 🚀. The reason is I understand the importance of knowing a *systems* language. 

{% twitter 1300011333056958464  %}

Systems languages can help us develop lower-level things like:
- web servers
- browsers
- OS modules
- CLI tools
- embedded apps
- web assembly apps

## Why Rust will be successful?
Simple - successful technologies are the ones used by big tech giants in important projects.

I think Rust has a bright future given it is backed by **Mozilla** but also indirectly by **Microsoft**. 
Did you know that Microsoft [is actively using Rust](https://www.zdnet.com/article/microsoft-why-we-used-programming-language-rust-over-go-for-webassembly-on-kubernetes-app/) for a couple of their critical projects like Azure and Windows, leveraging the powers of Rust while benefiting from it being memory safe? 

Not just that, Rust already brings value to [NPM, Dropbox, and Yelp](https://www.rust-lang.org/production).

Let's not forget that Rust can already be compiled into **Web Assembly**. While WASM is not that popular yet, it surely has potential for the future because it can bring *computation heavy* apps like games, interactive diagrams, or data visualization software to life.

## Why Rust could be used over C/C++
Well... like many other important things in programming that are many times overlooked ... **security**! 🛡️ Lot's of important system-level code currently runs in C/C++, and new vulnerabilities are found periodically. Most bugs are related to memory issues. 

70% of all security bugs are memory safety issues (source [here](https://www.zdnet.com/article/microsoft-70-percent-of-all-security-bugs-are-memory-safety-issues/)).

**Rust** is *memory safe* while being as fast or even faster than C or C++! 🧠 Even if you can still write code that has memory issues in Rust, the Rust compiler will do its best to warn you of those issues.
{% youtube 8EPsnf_ZYU0 %}

## Rust is modern
Rust was designed to have good DX from the start: 
- package manager - Rust libs can be easily distributed as crates
- [crates.io](https://crates.io/) - can be used to explore Rust libraries
- modern testing tools
- workspaces

👇 **Leave a comment** 👇
Let me know if you used, learned, or intend to learn *Rust*.  What was your experience with it? Is it as good as advertised?

Leave a 🧡 & 🦄. For more interesting content also check out my [Twitter](https://twitter.com/alexandrudanpop).
YouTube Video | DOM Crash Course -2
Tags: javascript, webdev, showdev, beginners
Published: 2020-08-30 12:42:54

After learning JavaScript in the previous series, we will learn about DOM(Document Object Model). It is been used to interact with every element of the HTML and can be used to even generate HTML on the fly.

This is the second part of the series.

{% youtube -Aisaf_4AZc %}

Please do like it and [Subscribe](https://www.youtube.com/channel/UCRf7mazcufqZxd2pR3oQJuQ?sub_confirmation=1) to my channel for more videos.
Spring Boot: How to get only the beans I have explicitly created
Tags: java, spring, springboot, todayilearned
Published: 2020-08-30 12:42:25

**Problem:** I need to get all the beans I have created explicitly in my app. When calling `applicationContext.getBeanDefinitionNames()` I get a list of bean names but a lot of them are not created explicitly by me but by Spring, and I'm not interested in those. There is no naming rule I can use for filtering at this point, because not all the beans injected by Spring start with *"org.springframework"*

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/hspm6m6ujokjjzzb1omb.png)

**Solution:** Using `applicationContext.getBeanDefinitionNames()` and filtering the beans by my root package name ( This solution also works for other use cases, for example if I want to get all the beans I've defined under a certain package ).

```java
package com.omiu.demo;

....

@Service
class PersonService {}

@Component
class PersonAnalyzer {}

class SimpleAnalyzer {}

@Configuration
class GeneralConfig {
	
	@Bean
	public SimpleAnalyzer simpleAnalyzer() {
		return new SimpleAnalyzer();
	}
}

@SpringBootApplication
public class DemoApplication {

    public static void main(String[] args) {
		ConfigurableApplicationContext applicationContext = SpringApplication.run(DemoApplication.class, args);

		List<Object> myBeans = Arrays.stream(applicationContext.getBeanDefinitionNames())
				.filter(beanName -> applicationContext.getBean(beanName).getClass().getPackage().getName().startsWith("com.omiu.demo"))
				.map(applicationContext::getBean)
				.collect(Collectors.toList());
    }
}
```

This gives me a list of only 5 Beans, exactly those I'm interested in:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/fsxdjqulypzfdbo5rseg.png)
YouTube Video | DOM Crash Course -1
Tags: javascript, webdev, beginners, youtube
Published: 2020-08-30 12:40:55

After learning JavaScript in the previous series, we will learn about DOM(Document Object Model). It is been used to interact with every element of the HTML and can be used to even generate HTML on the fly.

This is the first part of the series.

{% youtube 85niOH4eFYM %}

Please do like it and [Subscribe](https://www.youtube.com/channel/UCRf7mazcufqZxd2pR3oQJuQ?sub_confirmation=1) to my channel for more videos.
Looping Task 
Tags: javascript, challenge
Published: 2020-08-30 12:34:44

I was doing Hacker Rank Javascript 10 Day Challenge in which i saw a problem and thought that  i would share. 

Q: Complete the vowelsAndConsonants function in the editor below. It has one parameter, a string, , consisting of lowercase English alphabetic letters (i.e., a through z). The function must do the following:

First, print each vowel in  on a new line. The English vowels are a, e, i, o, and u, and each vowel must be printed in the same order as it appeared in .
Second, print each consonant (i.e., non-vowel) in  on a new line in the same order as it appeared in .

###   I have done this by adding two loops in my function
###
     function vowelsAndConsonants(s) {
      let vowel = ['a','e','i','o','u']
      for(var i=0; i< s.length;i++){
          if(vowel.includes(s.charAt(i))){
            console.log(s.charAt(i))
        }
     }
      for(var i=0; i< s.length;i++){
        if(!vowel.includes(s.charAt(i))){
            console.log(s.charAt(i))
         }
     }
     }

#### Calling the function 
      vowelsAndConsonants(javascript)

### Output:
      a
      a
      i
      o
      o
      j
      v
      s
      c
      r
      p
      t
      l
      p
      s

Observe:
Each letter is printed on a new line.
Then the vowels are printed in the same order as they appeared in the input
Then the consonants are printed in the same order as they appeared in input

Hope you find this helpful and if there is any optimize method to do this kindly tell me in the comment section

Happy Coding!
🚀 SEO, Pagespeed, Uptime, SERP, W3C | One Tool
Tags: showdev, testing
Published: 2020-08-30 12:24:29

## AI-Based SEO & Web Analysis Tool

[Screpy](https://screpy.com) is a web analysis tool that can analyze all pages of your websites in one dashboard and monitor them with your team. Powered by [Google Lighthouse](https://developers.google.com/web/tools/lighthouse).


Complete the guide tasks created with the power of AI, increase pagespeed, improve your UX, eliminate cross device errors, and guarantee 100% SEO success.

- Power of AI
- Simple UI
- Auto-Generated tasks
NavigationExtras in Angular
Tags: angular, javascript, typescript, es6
Published: 2020-08-30 12:23:56

There are following workarounds of **Angular Routing Parameters**:

1. Required Parameters
2. Optional Parameters
3. Query Parameters
4. Navigation Extras

let's discuss 4rth one: **Navigation Extras**

This new method came after **Angular 7.2.0** which represents the extra options used during navigation.

### **How to send parameters to another component from the current one?**

```javascript
constructor (private router : Router) {}

this.router.navigate(['employee'], { state:{ name:'Muhammad Awais' } })
```

### **How to get parameters in the destination routed component?**

```javascript
constructor (private router : Router) {
    this.router.getCurrentNavigation().extras.state.name;
}

// This works only in the constructor, it will not work on ngOnInit
```
TIL - HTML Basics
Tags: html, beginners, webdev
Published: 2020-08-30 12:22:17



First of all: HTML is not a programming language but from tagging (markup), which informs the browser of the structure of the web application to be displayed.
[List of HTML tags with examples](https://htmlreference.io/)
[W3C Markup Validation Service](https://validator.w3.org/)

The 2 fundamental ans inescapable elements of HTML are **head** and **body**. 
What’s in the head? [Metadata in HTML] (https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML)
What's in the body? e.g. [Hyperlinks](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks),[Images](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Alternative_text), [Forms](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms), [ARIA for displaying dropdown content](https://css-tricks.com/why-how-and-when-to-use-semantic-html-and-aria/)

 
 [first step](https://pastebin.com/q1jU5DyZ)
Stencil + Firebase + Stencil store boilerplate
Tags: firebase, stencil, webcomponents, stencilstore
Published: 2020-08-30 12:10:27

Hello everyone :wave:,

This is my first post on `Dev.to`. I would like to share a Firebase + Stencil boilerplate.
I was searching for a good boilerplate to start with `Firebase` and `Stencil` but did not find any. So I thought to create my own one. 

Git Hub repo link [Stencil Firebase](https://github.com/ranjeetsinghbnl/stencil-firebase)

In this boilerplate i tried to demonstrate how we can 
* Configure Firebase in stencil web application
* Configure Stencil Store
* Configure Stencil Router
* Protecting routes
* Implement Login/Register/Update Profile/Logout 
* Organised configuration in stencil application

##Styling 💀
For styling i have used `scss`, however i focus more on features than styling.

##Folder Structure 🗄️
```
├───assets
│   ├───icon
│   └───scss
├───components
│   ├───app-flash-message
│   ├───app-home
│   ├───app-root
│   ├───auth
│   │   ├───login
│   │   ├───profile
│   │   └───register
│   ├───common
│   └───page
│       └───home
├───config
├───global
├───interface
├───services
├───store
└───util

```

Please feel free to use it and feedback are always welcome.

Contributing 👏
* Pull requests and 🌟 stars are always welcome.
* For changes, please open an issue first to discuss what you would like to change.

Contact 📩
📧 <a href="mailto:ranjeetsingh.bnl@gmail.com">ranjeetsingh.bnl@gmail.com</a>

🐦 Twitter [@ranjeetsingh_bl](https://twitter.com/ranjeetsingh_bl)

💼 Linkedin [@ranjeetsinghbnl](https://www.linkedin.com/in/ranjeetsinghbnl)
TIL - Wireframe & Mobile First (Responsive Design)
Tags: wireframe, responsive, design, beginners
Published: 2020-08-30 12:08:11

##A Wireframe 
is in general very simple, black and white, and graphically neutral. It indicates where each essential element of the future site is positioned (here a navigation bar, there a carousel, here a link to a product page, there a title...).

###[Difference Between Wireframe, Mockup and Prototype](https://brainhub.eu/blog/difference-between-wireframe-mockup-prototype/) 

|           | Fidelity                | Cost | Use                                                                                            | General traits                                              |
|-----------|-------------------------|------|------------------------------------------------------------------------------------------------|-------------------------------------------------------------|
| Wireframe | Low Fidelity            | $    | Documentation, quick communication Sketch, black, white & grey representation of the interface | Sketch, black, white & grey representation of the interface |
| Prototype | Middle to High Fidelity | $$$  | User testing, reusable backbone of the interface                                               | Interactive                                                 |
| Mockup    | Middle to High Fidelity | $$   | Gathering feedback and getting buy-in from stakeholders                                        | Static visualization                                        |

###Tools
vector drawing software like inkscape, or the editing software Gimp, Draw.io (in the Google suite) or moqups.com or [MockFlow](https://www.mockflow.com/)

##Mobile First?- Responsive Design 
allows you to create only one version of a web application, which automatically adapts to the various screen sizes.
Desktop vs. Mobile: [Three Key Website Design Differences](https://www.bluefountainmedia.com/blog/desktop-vs-mobile-three-key-website-design-differences)

[ Templates for Ecommerce, Pricing Page, Landing Page, Blog Page](https://moqups.com/blog/website-wireframe-examples/)


[first step](https://wireframepro.mockflow.com/view/M8f2d44aaa876a4f918688b4be165b48f1587200812264#/page/0a9687e1d5184276a8a364e188153029)
TIL - UX Design
Tags: beginners, ux, usability, design
Published: 2020-08-30 12:01:39

##Donald Norman: 7 qualities
[![7 Factors](https://public-media.interaction-design.org/images/ux-daily/56e960696b7cf.jpg)](https://www.interaction-design.org/literature/article/the-7-factors-that-influence-user-experience)

##10 Nielson golden Rules
[![10 Nielson golden Rules](https://public-media.interaction-design.org/images/uploads/bc407d74dd91972a7370c0e22cfacc36.jpg)](https://www.youtube.com/watch?v=hWc0Fd2AS3s)


[10 Usability Heuristics with Examples](https://blog.prototypr.io/10-usability-heuristics-with-examples-4a81ada920c)
[Examples of Bad UX](https://uxprofit.blog/2017/11/27/examples-of-bad-ux/)
[10 Examples of Great Usability on Airbnb](https://medium.com/@elizabeth.nicholas.14/10-examples-of-great-usability-on-airbnb-e47d2ebd0111)

## Tool
[Chrome extention to Check Nielson Rules](https://www.uxcheck.co/)

## Checklist 
[Usablity Checklist] (https://teamsuccess.io/UX)
Daily Developer Jokes - Sunday, Aug 30, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-08-30 12:00:16

---
title: "Daily Developer Jokes - Sunday, Aug 30, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Sunday%2C%20Aug%2030%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12592aa5db7.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
Asynchronous JavaScript is amazing.

I Promise you, await and see.
 -->
How to integrated fake REST API services in Web application
Tags: angular, frontend, backend, json
Published: 2020-08-30 11:54:25


Example of MicroENV - fake REST API: Integration service to angular 8 web application

Fake REST API services:

Get all users (GET) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/users/
Get user by ID (GET) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/users/1
Update User (PUT) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/users/1
Create User (POST) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/users/
Delete User (DELETE) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/users/1
Auth (POST) - https://app.microenv.com/backend/key/014546ad252a5d83568908/rest/token/generate-token

1. Clone git repository [here](https://github.com/danijelpopovic/fake-rest-api-angular-example)
2. Execute npm install in local repo folder
3. Execute command for run: sudo npm start
4. Setup of URL: /src/app/service/api.service.ts
5. Enjoy the development

WEBSITE: https://microenv.com
VIDEO TUTORIAL: {% youtube bSzLTPBggvM %}