teleren/devto huggingface dataset:
@font-face Rule
Tags: css, wordpress, html, devops
Published: 2020-01-13 10:04:06

With the `@font-face` rule, web designers do not have to use one of the "web-safe" fonts anymore.
In the `@font-face` rule you must first define a name for the font (e.g. myFont), and then point to the font file.

@font-face {
  font-family: myFont;
  src: url(sansation_light.woff);
}

div {
  font-family: myFont;
}

![font-face](https://thepracticaldev.s3.amazonaws.com/i/v5gip5voa15rctt2r7wc.png)
Introducing aidoos stumper
Published: 2020-01-13 09:59:47

Introducing aidoos stumper: 

aidoos stumper is a daily coding challenge from top tech companies:

Features and Benefits:
Daily new coding questions from top tech firms.
Top winner will be showcased as expert of the week and month.
Win a chance to work with top tech companies and best developers.
aidoos is a remote engineering platform developers and freelancers.

Signup today it's free here 
https://aidoos.com/landing/campaign/aidoos-stumper/
Mac rockin’ terminal
Tags: terminal, macos, ohmyzsh, custom
Published: 2020-01-13 09:38:12

---
title: Mac rockin’ terminal
published: true
description: Customize your terminal to have contextual useful information.
tags: Terminal, MacOs, Oh My Zsh, Custom
---


{% medium https://medium.com/@anthonyroux/macos-rockin-terminal-582934964b4a %}
Hierarchical Treeview Category Example in Laravel
Tags: hierarchical, laravel, treeview
Published: 2020-01-13 09:37:03

I was working on application where I had to create hierarchical relationship for a Model entity and also figure out a way to display it in HTML. In this tutorial i simple create "categories" table and manage end level of parents and child category with nested tree view structure in Laravel application.

https://codechief.org/article/hierarchical-treeview-category-example-in-laravel
Is there code review site I can scroll through on my phone? 
Tags: discuss, idea, codereview
Published: 2020-01-13 09:18:15

---
title: Is there code review site I can scroll through on my phone? 
published: true
description: Wouldn’t it be nice if there were an interface just for code reviews, where you can comment on lines of code?
tags: #discussion #idea #codereview
cover_image: https://thepracticaldev.s3.amazonaws.com/i/n3n3hkfq6lpphcpctluc.png
---

I love scrolling Dev.to. It has replaced some other social apps on my phone because of the substantive feedback and discussion.

The blogging aspect is great but wouldn’t it be nice if there were an interface just for code reviews, where you can comment on lines of code?

This could be a good addition to Dev.to eventually.

But I’m wondering if there is a site like that already?

If not, should I build it? 🤓
Compare Git Branches Based on the Commit Messages
Tags: git, bash
Published: 2020-01-13 08:46:33

Sometimes you want to compare branches based on their commit **messages**, and not on their SHAs.

This can be achieved by the following snippet:

```bash
git fetch
git log --format='%s' origin/branch_1 > log_1
git log --format='%s' origin/branch_2 > log_2
diff <(sort log_1) <(sort log_2)
```

If you want to compare local branches, you can get rid of the `git fetch` and remove `origin` for both branches.

You can generalize and write a script that accepts the branches names:

```bash
#!/bin/bash

git log --format='%s' "$1" > log_1
git log --format='%s' "$2" > log_2
diff <(cat log_1 | sort) <(cat log_2 | sort)
rm log_1 log_2
```
Link of the Week (2)
Published: 2020-01-13 08:45:41

* https://basecamp.com/guides/how-we-communicate
I've been a fan of Basecamp (the company) for a while. This is a good read on how to do communication within a company, particularly if it's a remote-first one.
* https://www.wired.com/story/the-style-maven-astrophysicists-of-silicon-valley/
As as physicist, I enjoyed this story about how a scientist can repurpose themselves outside academia. 
Long-time ago I did hear from an established economist in an academic institution, that he preferred to work with physicists than mathematicians because the former is more practical (result-oriented) than the latter who tend to focus more on generalizing results. 
Moreover, I'd say that in general astrophysicists tend to be much better prepared to jump into data analytics than "plain" physicists.
* https://fasterthanli.me/blog/2019/reading-files-the-hard-way/
A three part series exploring how to open files in depth.
Linux by example - Binutils, Math and Shadow
Tags: linux
Published: 2020-01-13 08:27:05

---
title: Linux by example - Binutils, Math and Shadow
published: true
description: We are in our new Linux environment and create Binutils, some math libraries and the shadow system for user and password management.
tags: linux
cover_image: https://thepracticaldev.s3.amazonaws.com/i/kjdm8zq5cogbfz3v9xel.jpg
---

{% youtube o5apIv3xvi0 %}

We are in our new Linux environment and create Binutils, some math libraries and the shadow system for user and password management.
Pinning - Asynchronous Programming in Rust: Why, What, and How
Tags: rust, webdev, tutorial, beginners
Published: 2020-01-13 07:58:05

## The Why, What, and How of Pinning in Rust

With the Future trait stabilized and async/await coming soon, many more people are being exposed to the Pin type and its sibling trait Unpin. In this video, we dive deep into what these types are, why they are needed, how they work, and how to use them. We also dig into the connection to Futures and async/await, and discuss how you safely move from old code that does not use pinning to new code that does.

This is pretty dense and subtle material, but hopefully serves as a good and thorough overview of pinning in Rust. If you want to know how it all fits together, this stream probably has you covered! To help you navigate, here are the major transition points:

0:03:50 — What's the problem we're trying to solve?
0:28:19 — How does pinning help?
0:31:55 — What is Unpin?
0:35:14 — Working with pinned types
0:44:20 — An example of implementing Future
0:51:02 — Pin::new vs Pin::new_unchecked
0:59:16 — The problem with Drop
1:03:13 — Quick recap
1:07:26 — Why impl Unpin is safe
1:12:34 — Structural pinning
1:30:14 — The curious case of Box::pin
1:50:49 — Avoiding unsafe with pin-project
2:04:59 — Why is Pin::set okay?
2:08:03 — Pinning beyond Future
2:12:30 — Some quick questions
2:17:02 — Real-world examples of transitioning to Pin in tower
2:26:34 — pin-project and Drop
2:34:17 — Q&A!

{% youtube DwY2KkCX59w %}
PHP MYSQL URL Filtering
Tags: php, mysql, url, filtering
Published: 2020-01-13 07:49:28

Hi everyone.
I have a database that I would like the user to be able to filter using a drop down which will then take the user to a new page with the filtered parameters carried on the URL. Example:

Database contains 3 columns (Spain, France, Germany),  rows are cities such as:
For Spain: Madrid, Barcelona
For France: Paris, Marseille
For German: Berlin, Koln

I would like that when the user picks using a drop-down: Spain and France, they will be taken to a URL such as: www.example.com/country=france&country=spain 
in that link they will see only France and Spain and their city in a table. 
So total will be 3 elements: (mysql database, page1 with drop down list, page2 with table with the filtered data). 
Can anyone help with this? Thank you so much!!!
Object Destructuring in Javascript
Tags: javascript, typescript, ecma6, beginners
Published: 2020-01-13 07:35:21

Data structures in JavaScript are Object and Array.

Objects allow us to create a single entity that stores data items by key, and arrays allow us to gather data items into an ordered collection.

But when we pass those to a function, it may need not an object/array as a whole, but rather individual pieces.

Destructuring simply implies breaking down a complex structure into simpler parts. In JavaScript, this complex structure is usually an object or an array. With the destructuring syntax, you can extract smaller fragments from arrays and objects. Destructuring syntax can be used for variable declaration or variable assignment. You can also handle nested structures by using nested destructuring syntax.

{% runkit
%}
 const data = {firstname: 'shubham',lastname: 'B',country: 'India'};

// Object Destructuring
const { firstname, lastname, country } = data;

// visible, reader-editable JavaScript code goes here
console.log(firstname, lastname, country); // shubham B India
{% endrunkit %}
Send emails with Office 365 SMTP
Published: 2020-05-07 23:59:53

---
title: Send emails with Office 365 SMTP
published: true
date: 2020-01-13 07:22:05 UTC
tags: 
canonical_url: https://dcblog.dev/send-emails-with-office-365-smtp
---

 ![Send emails with Office 365 SMTP](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/send-emails-with-office365-smtp.png) 

Office 365 is great for handling emails but it can also be used as an SMTP relay for your website. I've tried dedicated SMTP services with mixed results some work better than others. What I like about using Office 365 is it's easy to set up and very reliable. The added benefit of Office 365 is your sent emails saved in your sent folder! very handy.

Here are the SMTP credentials you need out of the box:

Host: smtp.office365.com  
username: email\_address  
password: email\_password  
port: 587  
encryption: tls

This will work without any setup, but if you have 2FA set up this will not work, instead, you need to create an app password. 

App passwords are passwords to be used for third party applications, this way you never expose your account password so it's a recommended approach even if you don't use 2FA but seriously use 2FA!

To set up app passwords login to your account click Manage security and privacy.

![](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/security-and-privacy.png)

Next click on create and manage app passwords.

![](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/security-options.png)

All your app passwords will be listed on this page, to add a new one click create.

![](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/manage-app-passwords.png)

Enter a name for the app password such as your website name.

![](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/create-app-password.png)

Note down the generated app password it will not be displayed again. (the below is just an example)

![](https://dcblog.dev/assets/images/blog/tutorials/office-365/send-emails-with-office-365-smtp/app-password.png)

Now with the pass password, you're ready to start sending emails with SMTP.

To use Office 365 with Laravel setup the .env file as follows

```php
MAIL_DRIVER=smtp
MAIL_HOST=smtp.office365.com
MAIL_PORT=587
MAIL_USERNAME=email
MAIL_PASSWORD=app_password
MAIL_ENCRYPTION=tls
MAIL_FROM_ADDRESS=email
MAIL_FROM_NAME="your app name"
```
How to upgrade Quasar application to latest version and vscode setup
Tags: codeguru, vue, quasarframework, aws
Published: 2020-01-13 06:50:07

{% youtube -jsA3X7NoBM %} 

Hello, code guru’s welcome back.

In this video we will see how to upgrade Quasar application to latest version and  also before wrapping up our environment setup module. We will go head and configure our IDE i.e VScode with eslint and vetur plugins. Finally this video concludes all the dev environment setup need for building application using Quasar

If you like more content from us please do consider supporting us on Patreon at https://www.patreon.com/codeguru

Please do not forget to provide your feedback or any topic suggestion in the below comments section.

You can also find us on
Twitter     : https://twitter.com/codeguru_io
facebook   : https://www.facebook.com/codeguru.io
instagram  : https://www.instagram.com/codeguru_io/
Reddit      : https://www.reddit.com/r/codeguru_io/
Discord    : https://discord.gg/sRsR86
Gitter       : https://gitter.im/codeguru_io/community
Configuring custom domain for aws-amplify application
Tags: codeguru, vue, quasarframework, aws
Published: 2020-01-13 06:48:37

{% youtube dcLUFzwx50c %} 

Hello, code guru’s welcome back.

In this video tutorial of getting started with quasar framework + aws amplify. We will look at how to configure a custom domain to our amplify application. First, we will see how to register a domain using router 53 service then proceed to aws amplify console in order to configure custom domain under domain management section.

If you like more content from us please do consider supporting us on Patreon at https://www.patreon.com/codeguru

Please do not forget to provide your feedback or any topic suggestion in the below comments section.

You can also find us on
Twitter     : https://twitter.com/codeguru_io
facebook   : https://www.facebook.com/codeguru.io
instagram  : https://www.instagram.com/codeguru_io/
Reddit      : https://www.reddit.com/r/codeguru_io/
Discord    : https://discord.gg/sRsR86
Gitter       : https://gitter.im/codeguru_io/community
Get the most out of your react-spring configuration
Tags: react, javascript, webdev, animation
Published: 2020-01-13 06:47:09

# React-spring

My favorite solution for UI animations when working with React is [react-spring](https://www.react-spring.io/), a spring-physics based animation library.

I love it for its simple, declarative, hook-based API and animation updates without re-renders.

In case you're not familiar, the code might look something like:

```jsx
import { animated, useSpring } from 'react-spring'

function Component({ visible }) {
  const { opacity } = useSpring({
    from: { opacity: 0 },
    to: { opacity: visible ? 1 : 0 },
    config: { mass: 2, tension: 280, friction: 12, clamp: true }
  })
  
  return <animated.div style={{ opacity }} />
}
```
BTW, if you are not familiar, [check it out](https://www.react-spring.io/)!

However, as a newbie to spring-based animations, I've had a hard time knowing which effect the different config settings would have.

I believe I know what `mass` is, and I can sort of imagine what `tension` is in the context of a spring. But how would these values impact my animation? I found myself often changing the parameters and replaying the animation in the hope it would look good.

In order to take the guess-work out and get the most out of react-spring, I built a [visualizer](https://react-spring-visualizer.com/) to help me find the optimal config for a specific animation.

## [React-spring visualizer](https://react-spring-visualizer.com/)

![React-spring visualizer in spring view](https://thepracticaldev.s3.amazonaws.com/i/tkcvdxghk1wqphcnywtw.gif)

On the left side you can change the config values for spring animations, on the right side you can see the animation itself. 

In the default "spring" view, the impact of `mass`, `tension`, `friction` and `clamp` on a spring are visualized:

- `Mass` changes the size of the "bob" on the end of the spring.
- `Tension` changes the amount the spring is pulled from its resting point.
- `Friction` changes the scale of the downward arrow in the top left.
- Selecting `clamp` adds a barrier just above the spring's resting point.

There are 4 other displays to see how your config will look:
- translate
- scale
- rotate
- opacity

You can access them with the buttons below the visualizer.

![React-spring visualizer in opacity view](https://thepracticaldev.s3.amazonaws.com/i/1vyqxb1zoxrchxw6kfye.gif)

If you are happy with your configuration, use the copy-to-clipboard button to copy the settings.

I would really appreciate it if you could have a look & let me know what you think!
What is my WHY
Tags: why, lambdaschool
Published: 2020-01-13 06:26:53

# what is your 'why'?
I started taking data science course part time at lambda school (yeah, it's online). Before even day one starts, they let me read a lot and watch a lot and finally do some work. 

One of the assignments at the end of orientation was,
> A written letter from your "future self" to your "present self" about how your life is different now that you completed Lambda school.
 
ok. it's fun. 'future me' telling 'present me'. I did this a while ago when I was 20's. let's go. 

## Intro
Hey Johnny, yeah It's me, you from the future. Taking part-time course for 1.5 year was tough, especially the time zone difference really confused me. However, spending time with folks, teachers, supporters from lambda school was really priceless memory. They were continuously learning and the vibe was really not easily discovered. However, I made a few mistakes and wanted to warn you.

## Advice from the future
- spend time wisely. Stop procrastinating with your friends drinking beers or etc because your time is golden. I'm not telling you to study all the time, instead, prioritize your work and conquer it one by one. Value your time with family. They are your number one top priority. 
- Don't stop digging. You know you have a tendency to stop digging when reaching at certain level. If you are interested, go find it until you get it. 
- Remember your goal and why. You started this because you wanted to think based on data and make a decision based on data. You are not here getting some degree, but trying to find real decision making process with data. Don't do fancy, but do something that makes sense to you.
- Remember that basic is more important than anything. Don't try to do some fancy things first. You need to understand the base firmly so that you can go to the next level. Without the basic, any of your advanced work will go to rubbish. 
- My last advice is that you must know where you at. Always look around and measure how much further you came and to go. So you need to be able to switch your scope dynamically. Talk to cohort and discuss with them to get the job done. Help your cohort if necessary. Be Kind to them. 

Ok. Enough lecture. I will end it here.
Kong 2.0 Hybrid Mode
Tags: kong, api, gateway
Published: 2020-01-13 06:15:42

Kong เป็น API Gateway ที่ได้รับความนิยมสูง เพราะใช้งานสามารถรันได้บนแพลตฟอร์มที่หลากหลาย ทั้งบน Cloud, On Premise มีวิธีการ Deploy ที่ครอบคลุมทุกการใช้งาน ทั้ง Binary, Docker หรือ Kuberbetes

ใครยังไม่เคยใช้ Kong ลองใช้ Kong ตามบล็อกนี้ [KONG API GATEWAY ฉบับรวบรัด](https://i.dont.works/kong-api-gateway-in-10-minute/)

![Kong API Gateway](https://thepracticaldev.s3.amazonaws.com/i/hibin8afsgsggdnriwgh.png)

การใช้ Kong ในเวอร์ชั่นแรกๆ จำเป็นที่จะต้องมีฐานข้อมูลสำหรับเก็บค่าคอนฟิกต่างๆของ Gateway ซึ่ง Kong รองรับการใช้งานฐานข้อมูล 2 ตัวคือ PostgreSQL และ Cassandra ซึ่งการนำไปใช้งานจะต่างกัน ตามความต้องการของระบบ

ใน [Kong version 1.1](https://konghq.com/blog/kong-1-1-released/) นอกจาก Kong จะสามารถใช้ฐานข้อมูลในการเก็บคอนฟิกต่างๆแล้ว ยังสามารถใช้งาน Kong แบบไม่ต้องมีฐานข้อมูลได้ โดยการใช้ไฟล์คอนฟิกแทน เรียกโหมดนี้ว่า Kong DB-less ข้อดีคือ ไม่ต้องดูแลฐานข้อมูล แต่ข้อเสียก็มีคือ บาง Plugin จะไม่สามารถใช้งานได้

การใช้ Kong DB-less มีข้อดี และข้อเสีย ใน Community ของ Kong มีการพูดถึงเรื่องการใช้งาน Kong DB-less แบบกระจายคอนฟิกไปยังโหนดต่างๆ เพื่อเหตุผลบางอย่าง เช่น Kong Ingress บน Kubernetes หรือ อยากรัน Kong DB-less ที่เอาไฟล์คอนฟิกมาจากที่เดียวกัน

จากคำเรียกร้องจากแฟนคลับ ทำให้ Kong ต้องเข็นฟีเจอร์ Hybrid Mode ออกมา คือทั้งมีฐานข้อมูล และไม่มีฐานข้อมูลในเวลาเดียวกัน สงสัยฟังเพลง Getsunova มากไป

![Kong Hybrid Mode](https://thepracticaldev.s3.amazonaws.com/i/zkxj9744v87bcgfkj88r.png)

ในโหมดนี้ จะมี Kong รันอยู่ 2 role คือ `control_plane` และ `data_plane`

Control Plane จะเป็น Kong ที่รันด้วยโหมดที่มีฐานข้อมูล เหมือน Kong ปกติ มี Admin API ให้ใช้งาน ทำหน้าที่กระจายคอนฟิกไปยังโหนดในคลัสเตอร์ เรียกว่า Data Plane

![Cat Control Plane](https://i.pinimg.com/originals/25/80/28/2580285ff04213e3e3939648dae98657.gif)

Data Plane คือ Kong Proxy ที่รันเป็น Kong DB-less โดยจะมีการอัปเดตคอนฟิกเมื่อมีการเปลี่ยนแปลงที่ Control Plane

Demo

{% youtube OaLMugjy7bI %}
[Samedi 18 janvier] Implémenter Waves Signer
Tags: waves, signer, blockchain, developpeur
Published: 2020-01-13 05:49:21

Prochaine vidéo ce samedi 18 janvier à midi.

Sujet : Implémenter Waves Signer.

Vous verrez comment utiliser cette nouvelle option sortie récemment chez Waves et permettant de se passer d'extension navigateur pour la connexion et la signature des transactions dans nos applications blockchain.

A bientôt

N'hésitez pas à nous suivre sur les réseaux sociaux en attendant :

Telegram : https://t.me/wavesdappsFR
Twitter : https://twitter.com/WavesDevFr
Youtube : https://www.youtube.com/channel/UC2DS9ktTKWGW3NHHV2Ja3_A
Facebook : https://www.facebook.com/wavesfr
Java Lists: Copies and Deep Copies
Published: 2020-01-13 02:07:21

---
title: Java Lists: Copies and Deep Copies
published: true
description: 
tags: 
---
Lists are a type of collection that exists in many languages, and each language has its own way of handling them. Java’s Lists can be very useful, and with Java’s system of classes and interfaces they can be very versatile. That being said, Lists in Java can also be frustrating to deal with at times, and they are more complicated than their counterparts in a language like Python. So we’re going to talk something that can be difficult when working with Lists, copying them.  Before we go any further, it is important to note that copying lists in Java is not always the best or most efficient strategy, since creating a copy can be costly both in time and space. If your List is likely to be very large, it is advisable to look for another way to way to make your program work without copying an entire list. But if you think it’s necessary, here’s how to copy a List in Java.

There are two kinds of copies, a shallow copy and a deep copy. To understand the difference, you need to understand how a List works in Java. A Lists appears to be a collection of objects, but this is not actually the case. A List is really a collection of references to objects elsewhere in memory. The reason this distinction is important is because when you copy a List normally, you’re not actually making copies of each item in the List, you’re only making a copy of the List of references. Normally, when you copy a variable, it makes an entirely new object. So if you make a copy and then change the original, it won’t affect the copy:

```java
int myInt = 0;
int myCopy = my_int;
myInt = 1;

/* 
   myInt = 1
   myCopy = 0 
*/
```

The original is updated with a new value, but the original remains 0. But what happens when you try the same thing with a List?

```java
// Create a List
ArrayList<Integer> myList = new ArrayList<Integer>();
myList.add(1);
myList.add(2);
myList.add(3);

// Make a copy
ArrayList<Integer> myCopy = myList;

// Update original
myList.set(1,4);

System.out.println(myCopy);
System.out.println(myList);
```
`[1,4,3]`
`[1,4,3]`

This is because we only copied the references, not the objects themselves. So how do we make a copy of the entire list, objects and all? That is what is called a Deep Copy. There’s a few ways to go about this, but to keep things simple I’m just going to to go over the basic code, without using an interface or creating a new method. The easiest way to create a Deep Copy is to create a copy of each object in the original List and store it in a new List:

```java
// Create a List
ArrayList<Integer> myList = new ArrayList<Integer>();
myList.add(1);
myList.add(2);
myList.add(3);

// Make a new List
ArrayList<Integer> myCopy;

// Fill new List
for(int i: myList){
	myCopy.add(i);
}

// Update original
myList.set(1,4);

System.out.println(myCopy);
System.out.println(myList);
```
`[1,2,3]`
`[1,4,3]`

Now we have a distinct copy that is unaffected by changes to the original List. Next time, we’ll go discuss how to copy a List of Lists.