teleren/devto huggingface dataset:
Airbnb Map Clone Tutorial – React with Ruby on Rails
Tags: rails, ruby, react, tutorial
Published: 2019-08-09 14:21:07

Honestly, I’ve always wanted to create something like the Airbnb map. It looks really great, when you drag and drop on it, it reloads the data and shows all available apartments on the map with prices. It’s a great example of using a front-end framework to build a map and creating a separate back-end app which returns only data passed to the front-end. In this tutorial, we show how to create a map like on Airbnb site.
https://www.nopio.com/blog/airbnb-map-tutorial-react-rails/
Meet an Updated EntityDAC with Support for macOS 64-bit
Tags: database, macos, delphi
Published: 2019-08-09 13:53:27

---
title: Meet an Updated EntityDAC with Support for macOS 64-bit
published: true
description: Devart released the new version of EntityDAC v.2.2 with support for macOS 64-bit and improved functionality.
tags: database, macOS, Delphi
---

*Devart released the new version of [EntityDAC](https://www.devart.com/entitydac/) v.2.2 with support for macOS 64-bit and improved functionality.*

![EntityDAC macOS Support](https://i.ibb.co/zbJ5fNp/ENTITYDAC.png)

Devart, a recognized vendor of database connectivity solutions for Embarcadero Delphi and Microsoft .NET development platforms, has released a new version of its EntityDAC whiсh brings several long-awaited improvements. 

The most notable product update is the support for the macOS 64-bit operating system. Now users can create 32-bit or 64-bit versions of their database applications for macOS to align technology with the business needs. In addition, the development team has also added support for Bytes attribute for the GUID generator. 

This update has arrived just in time considering Apple’s plans to drop support for 32-bit applications in future versions of macOS. This June, Apple has confirmed that the new macOS Catalina will bar users from installing 32-bit applications.

**EntityDAC** is a Delphi ORM framework for fast object-relational mapping of database objects to Delphi classes using LINQ. Learn more about the most recent release at [https://blog.devart.com/entitydac-supports-macos-64bit.html](https://blog.devart.com/entitydac-supports-macos-64bit.html)


**About Devart**

Devart is one of the leading developers of database tools and administration software, ALM solutions, data providers for various database servers, data integration and backup solutions. The company also implements Web and Mobile development projects.
For additional information about Devart, visit [https://www.devart.com/](https://www.devart.com/)
[Comic] Stickers
Tags: webdev, culture, art, comics
Published: 2019-08-09 13:20:01

---
title: [Comic] Stickers
published: true
description: A Pêche comic about laptop stickers.
tags: webdev,culture,art,comics
series: peche
---

So, uh, I have feelings about laptop stickers.

{% instagram B08cym-lPQq %}

`¯\_(ツ)_/¯`
Daily Challenge #37 - Name Swap
Tags: challenge
Published: 2019-08-09 13:19:13

---
title: Daily Challenge #37 - Name Swap
published: true
description: 
series: Daily Challenge
tags: #challenge
---

In today's [challenge](https://www.codewars.com/kata/559ac78160f0be07c200005a), we ask that you to write a function that returns a string in which an individual's first name is swapped with their last name.

> Example: nameShuffler('Emma McClane'); => "McClane Emma"

Good luck!

***
_This challenge comes from debri on CodeWars. Thank you to [CodeWars](<https://codewars.com/>), who has licensed redistribution of this challenge under the [2-Clause BSD License](<https://opensource.org/licenses/BSD-2-Clause>)!_

_Want to propose a challenge for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
I AM NOW A LEAD AT DEVELOPER STUDENT CLUB 🎉
Tags: codenewbie, googledevelopers, webdev, dsc
Published: 2019-08-09 12:40:19

This day can not get any better. I have been selected for the role of **Lead** at **Developer Student Club**. I can now create a developer community at my university, which will be directly affiliated with Google. Isn’t it awesome!? 🥂
![selection email](https://msaad.dev/wp-content/uploads/2019/07/3e7e8ba32d6ef3eb2544d353e5317592_Image-2019-07-26-at-8.00.38-PM-2-1024x637.png)

## ⚡**WHAT IS DEVELOPER STUDENT CLUB?**
[Developer Student Club](https://developers.google.com/programs/dsc/) (DSC) is a **Google Developers** program for university students. It is a Google community which is designed to help students build their mobile and web development skills and knowledge. It is led by the DSC Leads who are chosen by Google itself. This community is also intended to be a space for students to learn and collaborate as they solve real-world problems.

Up until last year, DSC was only limited to a handful of countries in Asia. This year for the first time, Google opened its DSC applications to all the young developers residing in Pakistan. Thus, presenting them with a great opportunity to become a part of Google’s ecosystem.

## 🔥**ROLE OF THE DSC LEAD**
Being the DSC Lead of University of Engineering and Technology, I will be **creating and then leading** the Developer Student Club for the year 2019 to 2020. For making this community a success, I will be organizing workshops, teaching web and app development, enabling more students to become trainers and supporting them in conducting sessions. I will also make sure that any student who has a passion for becoming a developer can join this community despite his discipline.

These are some of my many responsibilities as a Lead. Because of DSC, I am hopeful that this year turns out to be a great experience not just for me but for you too. So, let’s see what this journey take us.

## 🍒**BENEFITS OF BECOMING A DSC MEMBER**
Assuming that you already know the benefits of joining a Google community, I will not go into details here. I will just highlight that by becoming a part of this incredible community; you will have the opportunity to

 - Grow your knowledge of developer technologies through peer to peer workshops and events.
 - Gain relevant industry experience by solving problems for local organizations with technology-based solutions
 - Showcase your prototypes and solutions to your local community and industry leader.
 - Use Google resources to create something which will make an impact on our society.

🙌 Wrapping up, I would like to thank my dear friend and university senior [Saqib Ameen](https://twitter.com/saqibameen) and my elder brother [Ashar Irfan](https://twitter.com/MrAsharIrfan) for helping me achieve this milestone. If it weren’t for them, I would probably never have carved my name in the **first batch of DSC Student Leads** from Pakistan. They have helped me during my DSC application more times than I can count. They are amazing developers, and I am fortunate to have such supporting individuals in my life.

Cheerios ✌

SHARE
Friends don’t let friends ____ on a Friday afternoon.
Tags: justforfun, fun, game
Published: 2019-08-09 12:54:52

![](https://thepracticaldev.s3.amazonaws.com/i/uk4ij1f11gkypf1r2qwq.jpeg)

A, B or C?

Or share your own answer.

Happy Friday y’all! 🥳
Why `position: sticky` doesn't work
Tags: css, sticky
Published: 2019-08-09 12:54:47

## The sticky hasn't a threshold
The sticky needs a specified threshold with at least one of `top`, `right`, `bottom`, or `left`.

{% codepen https://codepen.io/eres/pen/mNjLpz %}


## The sticky hasn't enough space

A parent must be larger than its sticky. Check sizes by Devtools. Maybe the parent has no other children and has fitted the sticky. Maybe the sticky is a flexbox and it grows up for all parent's height.

{% codepen https://codepen.io/eres/pen/rXrQQB %}


## The parent of the sticky has `overflow: hidden`, or one of the grandparents

Any non-visible value of `overflow` on the parent anchors the sticky to the parent's context. Then only a parent's scrolling causes the sticky. And a window's scrolling doesn't.

{% codepen https://codepen.io/eres/pen/VoBqwz %}
Comparando datas no JavaScript
Tags: javascript, node, react
Published: 2019-08-09 12:38:19

![Comparando datas no JavaScript](https://thepracticaldev.s3.amazonaws.com/i/3jwh0mcz9x4r3tx9pjq5.jpg)

Ao comparar datas, use o timestamp do objeto data e faça a comparação dos timestamps.


Obs: nesse exemplo repare que o mês de Janeiro é 0.

Obs2: repare que o timezonezone pode variar de acorcom com o timezone que você estiver.

#javascript #nodejs #react

[➜ Participe da nossa lista de desenvolvedores](https://emersonbroga.com/e/participe/)
[➜ Aprenda ES6](https://amzn.to/2J4XnLg)
[➜ Veja as dicas no Instagram](https://www.instagram.com/emersonbrogadev/)
[➜ Assita nosso canal no YouTube](https://www.youtube.com/c/emersonbroga/)
[➜ Curta nossa página no Facebook](https://www.facebook.com/emersonbrogadev/)
[➜ Não perca as atualizações no Twitter](https://www.twitter.com/emersonbrogadev/)
[➜ Veja os repositórios no Github](https://www.twitter.com/emersonbrogadev/)

=)
You Are Great
Tags: showdev, mentalhealth
Published: 2019-08-09 12:09:04

---
title: You Are Great
published: true
description: Though it may not always feel like it, it's important to remember that you are special, you are wanted, you are great.
tags: showdev,mentalhealth
canonical_url: https://duffn.gitub.io/you-are-great/
cover_image: https://images.newscientist.com/wp-content/uploads/2019/07/02111520/gettyimages-157639696.jpg
---

Though it may not always feel like it, it's important to remember that you are special, you are wanted, you are great.

I made a thing to try to help make a sad friend feel better. Maybe it will bring a smile to your face, too.

[https://youaregreat.fyi](https://youaregreat.fyi)

```bash
curl https://youaregreat.fyi/api/
{"message":"You are great. 🌟"}
```

```bash
curl https://youaregreat.fyi/api/?name=Julie
{"message":"Hello Julie. You are appreciated."}
```
API testing for serious developers
Tags: emacs, restclientel, api, rest
Published: 2019-08-09 11:01:11

---
title: API testing for serious developers
published: true
description: Ok, this is just how I build and test API.
tags: emacs, restclient.el, API, rest
cover_image: https://thepracticaldev.s3.amazonaws.com/i/0q91i66hchufe7qqk1ae.png
---

Ok, I didn't mean "serious" developers. I just want to make the title look fancy. This will actually work for anyone, even for those who are not in the emacs eco-system. 

I personally spend quite a bit of my time building and consuming web services. A few years back I was introduced to Postman and it blew my mind. Because of the simplicity and mostly for the ability to share collections across the team. So far I still use Postman when necessary, but I find it hard to switch between my editor and the postman client, just because I can test an endpoint or call some service I am integrating so I can verify its outcome. Hands down Postman is a great tool for the team although its bloat in the right areas. 


![Postman yay!!!](https://thepracticaldev.s3.amazonaws.com/i/4wt8eoafom4cyjclt12j.png)

After switching over to emacs, I was looking for a way *not to* move out of the editor while developing a new API or consuming one already. For most other IDE's you can opt to use a plugin or use the terminal session with [httpie](https://httpie.org/) with some slight mods. I am not saying this is the best way to go. But it certainly proved to be the best way for me IMO. 
 
 
![](https://thepracticaldev.s3.amazonaws.com/i/i7i9vime7fwtl1fs7phn.png)


### Getting started with restclient.el

The restclient.el package can be installed easily through MELPA. The package provides some awesome [documentation](https://github.com/pashky/restclient.el). And the code is quite easy to understand. 

You will have a few default key-bindings, which can be easily remapped, for an instance the most commonly used ones for me is `C-c C-c` to run the test group under the cursor. `C-c C-n` to jump to the next query and `C-c C-p` to jump to the previous query. Another nifty trick is when I want to share a query with someone I quickly copy the curl version of it by pressing `C-c C-u`


![](https://thepracticaldev.s3.amazonaws.com/i/kn393eyg65323hvpy640.png)
ffmpeg: remove audio from movie
Tags: movie, editing, mp4, ffmpeg
Published: 2019-08-09 10:50:57

---
title: ffmpeg: remove audio from movie 
published: true
description: ffmpeg is an open source command-line tool that enables us to convert audio or video formats. "-an" option disables audio recording.
tags: movie, editing, mp4, ffmpeg
series: movie editing with ffmpeg
---

[ffmpeg](https://ffmpeg.org/) is an open source command-line tool that enables us to convert audio or video formats.

[`-an`](https://ffmpeg.org/ffmpeg.html#Audio-Options) option disables audio recording.
You can remove audio from movie:

```console
$ ffmpeg -i example.mp4 -an example-nosound.mp4
```

Beside, an instant one-liner program to process multiple files with [fish shell](https://fishshell.com/) is like this:

```console
$ for x in ./*.mp4; ffmpeg -i $x -an $x.no-sound.mp4; end
```
Supply Chain Software Development Company
Tags: supplychainsoftwaredevelopment, supplychainsolutions
Published: 2019-08-09 10:33:07

Supply Chain Software Development software for each step of the process, from inventory management to order fulfillment and everything in between.
To Know More: https://bit.ly/2JLqwfI
Contact us: https://erpsolutions.oodles.io/contact-us/
Tired of redux? Try Reto!
Tags: react, redux, hooks, javascript
Published: 2019-08-09 10:30:59

# What is Reto?

Reto is a library for helping you write stores in React applications. It is based on the new "hooks" feature of react 16.8.

Here is the homepage [link](https://awmleer.github.io/reto/#/).

# Why Reto?

Redux is not easy to learn and somehow complicated. While Reto is very very simple and **straightforward**. Everyone who knows react hooks can learn to use Reto in **10 minutes**.

What's more, Reto is **flexible** and **efficient**. It has some powerful features like multi-store and dependency injection.
Dota2 live matches viewer
Tags: python, aiohttp, dota2, vue
Published: 2019-08-09 09:59:18

---
title: Dota2 live matches viewer
published: true
description: Web project collects data from API and produces info about recent, live matches.
tags: python, aiohttp, dota2, vuejs
---
I have built web service to be able to track dota2 pro matches on live and watch recent matches:

http://dotainsider.com

The repo is closed, but I can tell you that it was developed on latest version of aiohttp. This python framework is the best option for me to write small and big projects with async I\O operations. For storing data I use MongoDB. Front part is made with vuejs.

The most challenging part in this project is to collect all useful data is one place, but official web API has some fields in distributed API endpoints. 

Now it is in current development, but I think it's stable :)
Bad experiences in technicolor (part 1)
Tags: career, beginners, personal
Published: 2019-08-09 09:46:22

As my first post at this wonderful community, I thought I could write something about my experience in the field of web developing. This approach, although, would be boring and uninteresting since it will be very similar to everyone else's career in the same field.

So I'm going to write about f***ed up situations I've passed through my career so far (12 years!) because these will be different and maybe (hopely) I had learned some valuable things from them.

<h3>My beginnings</h3>

After 2 years of middle studies on computer programming (with excellent marks, I must admit), I get to work (unpaid) for a local company with a great reputation plus I get to work with one of my best friends who already was working there. Months later, my friend left the job for better opportunities. I started to get paid (poorly) while studying the upper grade and also passing through difficult times personally.

Two more years later I finish my computer studies and ask for a raise. I was working hard and bringing young blood and ideas to the company. As the opposite, I get laid off and the guy who replaces me is a very close friend of the boss. Great.

<h3>The lesson, dear reader</h3>

Like we say over here, it's not gold everything that shines. Since I was a child I dreamed about working with computers and later about programming. The company at first seemed perfect for me: very close to my home, working with my best friend, good reputation... But not everything is what it seems and usually you need to go deeper to know the truth.

I'll go on in part 2. Thanks for reading :)
Free Javascript script courses on Udemy
Tags: reactnative, javascript
Published: 2019-08-09 09:32:34

---
title: Free Javascript script courses on Udemy 
published: true
description: 
tags: #react #reactnative  #beginner #javascript
---
I just enroll in this wonderful course on Udemy 
If u 're interested you can join me 
It free if u join from the coupon link 
[Link](https://www.udemy.com/full-stack-javascript/?couponCode=PDFFREE2&fbclid=IwAR07ARJ6542aKH0bFYR3vt6X9kcW8XP-iIkn0V2quOf6bMW_zmGLdDA-zKs)&
How to debug in production build of iOS
Tags: ios
Published: 2019-08-09 08:55:33

Here is small article for developers who are facing bug which is in production but not in developer environment.

Recently I also got in one issue when I was working on ionic project.
I wasn't sure whether issue was due to bug in google map plugin or due to some code changes from fellow developers.

My mind was in doubt state that how I can do debugging in production build iOS. Truth is you can't but while doing some search I found about one tool called (iOSConsole)(http://lemonjar.com/iosconsole/) so [here is a link of this tool](http://lemonjar.com/iosconsole/). 

What a developer can do put some logging code.(i.e. console.log in case of phonegap or ionic base project) and put try, catch and finally syntax.
Why so serious? Collection of remarkable tweets #4
Tags: fun, twitter
Published: 2019-08-09 08:28:12

Take a pause. Put work aside for a minute and look how much fun is on Twitter. Many knowledgable people share tons of great tips there. But today, I gathered tweets containing entertaining and sometimes even very realistic content.

They come from different areas: [`#development`](https://dev.to/t/development), [`#design`](https://dev.to/t/design), [`#UI`](https://dev.to/t/ui)/[`#UX`](https://dev.to/t/ux), [`#philosophy`](https://dev.to/t/philosophy), office and ordinary [`#life`](https://dev.to/t/life). Sorted in random order without any preference and split across four posts.

I hope my selection will make your Friday even more joyful!

{% twitter 1138237351078105088 %}
{% twitter 1109384554962259970 %}
{% twitter 1053006038478331908 %}
{% twitter 1002938327945932805 %}
{% twitter 1110985650193477632 %}
{% twitter 1152027018982068226 %}
{% twitter 1154169387470823425 %}
{% twitter 1050768979201945601 %}
{% twitter 1155289146505793536 %}
{% twitter 1155293759929835520 %}

This is the last post of the "not so serious" series:

- [Why so serious? #1](https://dev.to/rmnvsl/why-so-serious-1-276j)
- [Why so serious? Collection of remarkable tweets #2](https://dev.to/rmnvsl/why-so-serious-collection-of-remarkable-tweets-2-10hj)
- [Why so serious? Collection of remarkable tweets #3](https://dev.to/rmnvsl/why-so-serious-collection-of-remarkable-tweets-3-mgo)
- Why so serious? Collection of remarkable tweets #4 👈

That's all folks! **I'd love to see your favorite tweets**, so please, put some of them in the comments section. 🎉
Quick tip! Map loop, already returns a array
Tags: javascript, productivity, functional
Published: 2019-08-09 08:22:12

It is common to see this approach when we are creating a new array using map loop

```js
const newArray = []

array.map((item) => {
  newArray.push(item.value)
})
```

Right? but map loop already returns a array.
So we can do that instead

```js
const newArray = array.map((item) => {
  return item.value
})

```
![Cool huh!](http://giphygifs.s3.amazonaws.com/media/KI9oNS4JBemyI/giphy.gif)
Cool huh!
Taking a leap on data: Revolutionizing data usage with tokenization

Tags: 100aio, tokenization, dataprocessing
Published: 2019-08-09 08:13:51

Strict privacy regulations on how to use and manage sensitive data can bind you. But you cannot stop working on your business. Data de-identification and minimization are techniques that pave the way for you to use the data without compromising on privacy. One of these revolutionary techniques is tokenization. Let us understand it further.

The basic concept of tokenization is to replace sensitive (or any other) data with tokens that can represent the original values. Finance and healthcare industries are examples of the usage of such techniques, minimizing the exposure of confidential information to processing systems. Token values allow a smooth business operation by letting analytical workflow use the information they need. 

For example, a company is working on developing a product that can help people improve their credit score according to their age. The raw data they pull up will have sensitive information like Social Security Number, email, or contact details. Tokenization will mask this data with surrogate values that will reduce the risk while you analyze the information as per requirements. 

Cryptographic token formats can keep their referential integrity that might be required as a unique identifier. The system will be able to process it and give you a report without jeopardizing the privacy of that data. You can visit 100a.io to create a number, i.e., a digital representation of your data and an access link that can be used online or offline. The data can be white papers, books, codes, or any other text. Just use the unique number for back data conversion.
How to blur a screen in React Navigation
Tags: javascript, react, reactnative, reactnavigation
Published: 2019-08-09 07:50:46

Screens overlap each other in stackNavigator. React Navigation provides us not only with changing the background color of these screens, but also controlling their transparency. 

To make the screen background blur, we first need to make the screens transparent.

```js
import { createStackNavigator } from 'react-navigation';

export default createStackNavigator(
  {
    HomeStack,
    BlurModal,
  },
  {
    ...NAVIGATOR_CONFIG,
    mode: 'modal',
    cardStyle: { opacity: 1 },
    transparentCard: true,
  },
);
```

And then use blurView as background.
```js
import React from 'react';
import { BlurView } from '@react-native-community/blur';
import Styled from 'styled-components';

function BlurModal() {
  return (
    <BlurWrapper blurType="light" blurAmount={20}>
      <Text>Modal with blur background</Text>
    </BlurWrapper>
  );
}

const BlurWrapper = Styled(BlurView)`
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
`;
```

![](https://thepracticaldev.s3.amazonaws.com/i/2qzpzquumbelqrrp2c5l.png)