teleren/devto huggingface dataset:
Announcing the FaunaDB Data Manager
Tags: fauna, serverless, jamstack
Published: 2020-07-09 16:11:31

Author: John Miller III and Summer Schrader
Date: Apr 10, 2020
[Originally posted on the Fauna blog.](https://fauna.com/blog/announcing-the-faunadb-data-manager)

---

We’re pleased to announce the highly anticipated release of the FaunaDB Data Manager (FDM). The FDM can assist with a variety of import and export tasks, including:

1. Copying documents, collections, indexes, functions, and roles from one FaunaDB database, at any particular point in time, to another FaunaDB database
2. Importing and updating data from:
A local directory using JSON or CSV files
An existing FaunaDB database, including at a specific point in time for auditing, version control, or data recovery purposes
Importing A SQL database, such as MySQL or Postgres, that is accessible over a JDBC connection
An AWS S3 bucket using JSON or CSV files
Exporting and backing up data to: 
A local directory (as JSON files)
Simple ETL (i.e., data formatting): 
Changing a field or column's name and/or data type
Setting a primary field (i.e., Ref column)
Setting the import time of a document
Ignoring fields
Creating a new database pre-filled with demo data, indexes, and roles for testing purposes
pin-latest: Easily resolve package.json “latest” versions
Tags: showdev, node, cli
Published: 2020-07-09 16:03:17

---
title: pin-latest: Easily resolve package.json “latest” versions
published: true
description: pin-latest is a cli tool for converting “latest” dependency versions to the resolved value.
tags:
  - showdev
  - node
  - cli
---

{% github wulfmann/pin-latest %}

The purpose of this project is providing an easy way to translate dependency versions specified in a `package.json`.

Any dependency that specifies a version of `latest` will be updated to the actual latest version of the package.

## Quickstart

Install

```bash
npm i -g pin-latest
# or
yarn global add pin-latest
# or
npx pin-latest
```

Given the following `package.json`:

```js
{
    "name": "example-project",
    "dependencies": {
        "react": "latest"
    }
}
```

Running `pin-latest` will result in the following output:

```bash
$ pin-latest .

{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}
```

To save changes pass the `--write` flag:

```bash
$ pin-latest .
package.json updated.

$ cat package.json
{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}
```

View more information in the [project’s readme](https://github.com/wulfmann/pin-latest).
animated banner for repository README
Tags: 10daysofanimation, gsap, javascript
Published: 2020-07-09 15:58:41

In the last blog, I talked about free TextPlugin of gsap. There is another plugin as `MorphSVG` of gsap available only to Greensock club members. I saw its usecases and fell in love with it.

## Challenge
Develop an animated gif banner for [portfolio](https://github.com/rahuldkjain/minimal-portfolio) readme.

## Solution
I really want to use `MorphSVG` for this. Greensock made this possible as its premium plugins are accessible on codepen. 
So, I thought of a plan that, I will develop the animation in codepen, then record it to convert into gif.

So I came up with this.
{% codepen https://codepen.io/rahuldkjain/pen/BajxYQr default-tab=result %}

Please look into the code to understand how I did it.

Let's see how to use the `MorphSVG` Plugin.

### Installation
Follow this [link](https://codepen.io/GreenSock/full/23d3979528b262cb07da37f6a7c7dd76) to get the cdn link to be used in codepen. Copy the cdn link.
```js
// otherwise include the cdn link 
<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/MorphSVGPlugin3.min.js"></script>
```
or you can import it if you are using npm module.
```js
// use this only when you are using webpack
import { gsap } from "gsap";
import { MorphSVGPlugin } from "gsap/MorphSVGPlugin";
```

then register the Plugin as
```js
gsap.registerPlugin(MorphSVGPlugin);
```

Now you are ready to use the plugin.

`MorphSVGPlugin` morphs SVG paths by animating the data inside the **d** attribute.

Remember that it only works with `path` data values, so you need to convert the primitive shapes to path. There’s a utility function, `MorphSVGPlugin.convertToPath()`, that can convert primitive shapes like `<circle>`, `<rect>`, `<ellipse>`, `<polygon>`, `<polyline>`, and `<line>` directly into the equivalent `<path>` that looks identical to the original and is swapped right into the DOM.

Now follow the [official documentation](https://greensock.com/docs/v3/Plugins/MorphSVGPlugin) to understand how to use it in a better way.

After developing the animation, record the animation. I would recommend [Screen Recorder](https://chrome.google.com/webstore/detail/screen-recorder/dhopldobnfjeckokfjimfcdagmlhjdce?hl=en) chrome extension to record the animation.
Then you can convert the video using [EZGif](https://ezgif.com/video-to-gif) converter to convert it in gif.

I hope you liked this one. More cool animations to come soon, stay tuned!

Happy Animating!
Liman MYS 1.1 Sürüm Duyurusu
Tags: liman, management, mys
Published: 2020-07-09 15:57:31

HAVELSAN tarafından geliştirilmekte olan Liman MYS 1.1 sürümü 1 Temmuz 2020 tarihinde Mert ÇELEN tarafından duyuruldu.

Henüz Liman MYS Kurumsal olarak duyurulan sürümde yeni oldukça güzel yetenekler bulunmaktadır.

# Değişim Günlüğü

## API sayfası erişime açıldı
* Liman MYS içerisindeki fonksiyonların 
dökümantasyonu oluşturulup, https://api.liman.dev adresine eklendi.

## Rehber sayfası erişime açıldı
* Liman MYS için temel seviyede kurulum ile ilgili Türkçe rehber, https://rehber.liman.dev adresine eklendi.

## Arayüz güncellemeleri
* Liman MYS Sunucusunun DNS yönetimi için arayüz eklendi.
* Arayüz tasarımı Vue.js benzeri bir yapıya benzer bir yapı kurularak sayfalar arası geçişler oldukça
hızlandırıldı. Javascript'in tekrar tekrar yüklenmesinin önüne geçilerek düşük donanımlı
bilgisayarlarda Liman MYS’nin performansı çok ciddi oranda arttırıldı.
* Liman MYS üzerine yapılacak sorguları oluşturabilmek için bir arayüz eklendi, kayıt butonuna basarak sistemdeki sorguların CURL sorgusuna otomatik çevrilmesi sağlandı.
* Eksik arayüz iyileştirmeleri tamamlandı.

## İşlevsel güncellemeler
* Log yapısı veritabanından standart formatlarda syslog'a yönlendirildi. SIEM uyumluluğu arttırıldı.
* Kişisel erişim anahtarı desteği eklendi, böylelikle sorguların dışarıdan da atılabilmesi sağlandı.
* Sunucu yönetimi tarafında SNMP desteği eklendi, böylelikle yazıcıları da Liman üzerinden ekleyip
komut çalıştırılarak yönetilmesinin önü açıldı.
* Domain eklentisine Raporlama özelliği eklendi. Herhangi bir arama sorgusunu otomatik olarak CSV
formatında kaydetme olanağı sağlandı. Bu  sorguların kaydedilerek kullanıcının istediği başka bir zamanda uğraşmadan aynı kriterlerde sorgu üretmesi sağlandı.
* Domain eklentisinde bilgisayarları domaine dahil ederken kullanılmak üzere APT Proxy desteği
eklendi.
* Domain eklentisindeki bağlantı sorunlarını çözümlemek için birden fazla kontrol sistemi eklendi. Böylelikle; Liman MYS'nin hedef adresi mevcut DNS'i ile çözümleyemediği, sertifikasına erişemediği gibi birçok durumda kullanıcıya daha anlamlı mesajların gözükmesi sağlandı.
* Kurumsal kullanımda oluşabilecek DNS sorunlarına yönelik domain eklentisinin daha kontrollü olarak DNS'i çözmesi sağlandı.

## Liman Market Entegrasyonu
* Liman MYS ile Liman Market bağlantısı tamamlandı. Eklentiler'in arayüz üzerinden otomatik ve güvenli bir şekilde yüklenmesi sağlandı.
while & do..while Loops
Tags: javascript
Published: 2020-07-09 15:56:34

JavaScript has many tools and ways to complete iterations, some with interesting quirks to them. While loops are used to execute a statement or perform an action as long as the specified condition(s) remains true. A do...while loop will execute one time before checking if a condition is true. After executing one time, then it will continue to loop until the condition is no longer true. 

<h3>While Loop</h3>
The counter variable is declared before the while loop statement.
The loop limiter or the condition is closed in parenthesis.
The code block enclosed in the curly braces will run while the counter is less than or equal to 5. The counter increments by 1 on each run.

```
let counter = 0;

while (counter <= 5) {
  
 alert(counter);

 counter++;
}

```

<h3>do...while loop</h3>

A do...while loop begins with the `do` keyword rather than `while`. The `while` clause is at the bottom of the statement.

```
let counter = 0;

do {

  alert(counter);

  counter++;


} while (counter <=5);



```




One notable difference between while and do...while loops is that the while loop may not necessarily ever execute its statement of code. This could be the case when the initial condition is never met. For example, if the loop is instructed to run as long as the variable `counter` is less than 5, but the variable `counter` is equal to 6, then that code block will never execute.

A do...while loop on the other hand will execute the code block at least one time before checking if the condition is true to continue execution. As you can see, the `do` statement executes before reading the `while` clause. 

These are just a few ways to rewrite for loops, and it is helpful to have different techniques depending on how you want the code to run.
How to Display Junction Tables in .NET Core MVC 3.1
Tags: help, csharp, architecture
Published: 2020-07-09 15:31:16

What is the best way to going about shared data with .NET Core? I understand that between the MVC model, you should keep information separated into their related areas.

Ex:
I've been working on a web app that builds Hiker profiles. It also connects to the National Park Service Rest API that populates the National Parks in the US.

All previous teaching tells me to break that down into the following:

Hikers:
-HikerController
-Hiker Model
-Hiker Views (Create, Details, Edit, Delete)

Parks:
-ParkController
-Park Model
-Park Views (Create, Details, Edit, Delete)

That all works great, but what happens when I want to create a Wishlist?

That would need information from the Hikers AND Parks models.

What is the best way to display that info on a view?
I've come across:
-Partial Views
-View Components
-Junction Table MVC (Don't know if there's a name for this), which would have the following

  -Wishlist Controller
  -Wishlist Model
  -Wishlist Views (Create, Details, Edit, Delete)

I've tried, unsuccessfully, on the Partial Views and View Components. The last option seems plausible, but it also seems like overkill. It might fall in line with clean architecture, but then what's the point in View Components or Partial Views.

Thanks
[Dev Note] .contains คืออะไร
Published: 2020-07-09 15:27:06

```html 
<div id="myDIV">

<p>
I am a p element inside div, and I have a 
<span id="mySPAN"><b>span</b></span> element inside of me.
</p>

</div>


```
```javascript
var div = document.getElementById("myDIV").contains(span);
```

เป็นการหาว่าใน div มี span จริงไหม ถ้าจริงก็ return true
Immutability and you: Part 3
Tags: immutability, javascript, beginners
Published: 2020-07-09 15:27:00

In this article we're going to see how you can change an object immutably

## Add new properties

```js
const programmer = {
  sleeplessHours: 5347,
};

const hacker = {
  ...programmer,
  nickname: 'h4ck3r_l1f3',
};

/*
hacker = {
  sleeplessHours: 5347,
  nickname: 'h4ck3r_l1f3',
};
*/
```

## Overwrite existing properties

```js
const twoYearsOldKid = {
  name: 'Come up with a name yourself',
  someOtherProp: 42,
  age: 2,
};

const threeYearsOldKid = {
  ...twoYearsOldKid,
  age: 3,
};

/*
threeYearsOldKid = {
  name: 'Come up with a name yourself',
  someOtherProp: 42,
  age: 3,
};
*/
```

## Remove a property

```js
const userData = {
  username: 'john.doe',
  someSecretData: 'I like cats',
  comments: 1234,
  averageRating: 4.3,
};

const { someSecretData, ...filteredUserData } = userData;

/*
filteredUserData = {
  username: 'john.doe',
  comments: 1234,
  averageRating: 4.3,
};
*/
```

## Putting it all together

Let's say we have this recipe object

```js
const recipe = {
  ingredients: [
    'bread',
    'meat',
    'salad',
    'fries',
    'gravy',
  ],
  price: 5.90,
  steps: [
    'Cook the meat',
    'Fry the fries',
    'Slice the bread',
    'Slice the salad',
    'Assemble',
  ],
};
```

And we want to add a new ingredient and a new step at the same time. Here's how to do it

```js
const betterRecipe = {
  ...recipe,
  ingredients: [
    ...recipe.ingredients,
    'secret sauce',
  ],
  steps: [
    ...recipe.steps.slice(0, recipe.steps.length - 1),
    'Add the secret sauce',
    ...recipe.steps.slice(recipe.steps.length - 1),
  ],
};

/*
betterRecipe = {
  ingredients: [
    'bread',
    'meat',
    'salad',
    'fries',
    'gravy',
    'secret sauce',
  ],
  price: 5.90,
  steps: [
    'Cook the meat',
    'Fry the fries',
    'Slice the bread',
    'Slice the salad',
    'Add the secret sauce',
    'Assemble',
  ],
};
*/
```

Notice that the new ingredient was added as the last item of the `ingredients` property, but the new step was added as the *second-last* item of the `steps` property (before "Assemble", the last one). This is done by "splitting" the array in two parts (the last step on the right and all the others on the left) and inserting the new step right inside the split.

If you liked this series please leave some feedback. See you next time!

Photo by [Salmen Bejaoui](https://unsplash.com/@slmnbj) on [Unsplash](https://unsplash.com)
Immutability and you: Part 2
Tags: immutability, javascript, beginners
Published: 2020-07-09 15:24:33

In this article we're going to see how you can change an array immutably

## Add new values at the end (push)

```js
const boringSuperpowers = [
  'X-ray vision',
  'Invisibility',
  'Super strength',
];

const yourSuperpowers = [
  ...boringSuperpowers,
  'Programming in JavaScript',
  'Using immutability',
];

/*
yourSuperpowers = [
  'X-ray vision',
  'Invisibility',
  'Super strength',
  'Programming in JavaScript',
  'Using immutability',
]
*/
```

## Add new values at the beginning (unshift)

```js
const starWarsBefore2000 = [
  'A New Hope',
  'The Empire Striked Back',
  'Return of the Jedi',
];

const starWarsAfter2000 = [
  'The Phantom Menace',
  'Attack of the Clones',
  'Revenge of the Sith',
  ...starWarsBefore2000,
];

/*
starWarsAfter2000 = [
  'The Phantom Menace',
  'Attack of the Clones',
  'Revenge of the Sith',
  'A New Hope',
  'The Empire Striked Back',
  'Return of the Jedi',
]
*/
```

## Remove the last item (pop)

```js
const week = [
  'Monday',
  'Tuesday',
  'Wednesday',
  'Thursday',
  'Friday',
];

const weekIdLike = week.slice(0, week.length - 1);

/*
weekIdLike = [
  'Monday',
  'Tuesday',
  'Wednesday',
  'Thursday',
]
*/
```

## Remove the first item (shift)

```js
const countdown = [3, 2, 1];

const almostMidnight = countdown.slice(1);

/*
almostMidnight = [2, 1]
*/
```

## Replace an item inside an array

```js
const starters = [
  'Bulbasaur',
  'Squirtle',
  'Charmander',
];

const sorrySquirtle = [
  ...starters.slice(0, 1),
  'Rattata',
  ...starters.slice(2),
];

/*
sorrySquirtle = ['Bulbasaur', 'Rattata', 'Charmander']
*/
```

## Remove an item inside an array

Note: You can remove any portion of the array with this technique, not just a single item

```js
const pickACard = [
  'Queen of Hearts',
  'Ace of Spades',
  '2 of Pikes',
];

const remainingCards = [
  ...pickACard.slice(0, 1),
  ...pickACard.slice(2),
];

/*
remainingCards = [
  'Queen of Hearts',
  '2 of Pikes',
]
*/
```

## Sort and/or reverse an array

```js
const people = [
  'Bob',
  'Alice',
  'Charlie',
];

const sorted = [...people].sort();

const reverseSorted = [...sorted].reverse();

/*
sorted = [
  'Alice',
  'Bob',
  'Charlie',
];

reverseSorted = [
  'Charlie',
  'Bob',
  'Alice',
];
*/
```


Photo by [Pietro Rampazzo](https://unsplash.com/@peterampazzo) on [Unsplash](https://unsplash.com)
Convert the endianness in C++ and test it with GDB and Python
Tags: cpp, gdb, python
Published: 2020-07-09 15:19:47

## Introduction
As we know the **network byte order** use **big endian** and the **x86** family processors use **little endian**. So, we need to convert them.

## Implementation
Here, it's one of the implementation. The idea is that we use the binary operation to rearrange the byte order.
```c++
auto little_to_big(int32_t num) -> int32_t {
  return (num >> 24 & 0x000000FF) ^ 
         (num >> 8  & 0x0000FF00) ^ 
         (num << 8  & 0x00FF0000) ^ 
         (num << 24 & 0xFF000000);
}

auto m = int32_t(0x12345678);
auto n = little_to_big(m);
```

## Testing
In GDB, we can easily observe the byte order. Set the break point, run it, assign the format and print it.
```shell
(gdb) break main
(gdb) run
(gdb) next
(gdb) next
(gdb) p/x m
(gdb) p/x n
``` 

We can use Python with GDB and make the testing more flexible. 
```python
import gdb

if __name__ == '__main__':
  gdb.execute('break main')
  gdb.execute('run')
  gdb.execute('next')
  gdb.execute('next')
  gdb.execute('p/x m')
  gdb.execute('p/x n')
```

And then, we can do a little bit code refactoring.
```python
import gdb

def config():
  cmd = ['break main',
         'run'];
  list(map(gdb.execute, cmd))

def trace():
  cmd = ['next',
         'next',
         'p/x m',
         'p/x n']
  list(map(gdb.execute, cmd))

if __name__ == '__main__':
  config()
  trace()
```

Thank you for reading, see you next time.

## References
- [Endianness](https://en.wikipedia.org/wiki/Endianness)
- [Debugging with GDB: Python API](https://sourceware.org/gdb/onlinedocs/gdb/Python-API.html)
- [Python: Map calling a function not working](https://stackoverflow.com/questions/19342331/python-map-calling-a-function-not-working)
Intro to Testing: Why Test
Tags: testing, android, tdd
Published: 2020-07-09 14:15:52

---
title: Intro to Testing: Why Test
published: true
description: Testing lets you move faster and more surely.
tags: testing, android, tdd
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/p979ngf2adap9jcq632c.JPG
series: Android Testing
---

When you write a feature, how do you know it works?
A lot of people, will run their code, and if you're an Android dev, you see it running on the phone and now you know if it works.

For Android in particular, this takes quite a while to do.
Have you ever sat down, and timed how long it takes from the time you write some function and hit run, to the time it actually starts up on a phone?
How many times do you do that procedure when writing code? How many times a day do you do it? Sure instant run might help a lot of times, but what if the thing you're checking requires you to go a bit deeper into the app? Each trial run could easily take 5 minutes and then if you just tried something 6 times, you've spent half an hour of your day on it.

# What if you could save all that time?

Testing has become associated with something complex but nothing could be further from the truth. Yes, you will be learning new techniques and learning to think a bit differently but the end result is that your work will be easier!

You're going to spend less time, to get more things done and you'll be more confident that things are working the way they should.

# We all test our code, the only difference is whether it takes milliseconds or minutes.

I use testing for two reasons:
1. Faster development.
2. A measure of confidence in its correctness.


We'll take a look at how to do this next time in this series, alongside when to do it, what to test, what not to test, mental models and benefits you get from it.

Meanwhile, take a look at one of the central concepts in testing that I wrote about [here](https://dev.to/aniketsmk/making-your-code-more-flexible-dagger-prelude-part-0-23l)

---
If your team could use some help, or would like getting things more often and faster with less time; I consult on Android. Reach out to me at consulting@aniketkadam.com
[Dev Note] อะไรคือ Storybook 
Published: 2020-07-09 15:14:38

- เป็นตัวช่วย ให้ dev เขียน ui ขึ้นมาก่อนและ Test จนเห็นภาพ (สั้นๆ ทำ Preview UI) พร้อมใช้งาน
- เก็บเป็น Collection ได้
- นำ Component ไปใช้ต่อได้อย่างสะดวก 

ex. ถ้านึกภาพเหมือนกับการวาดภาพลงในสมุดเก็บไว้เป็น Collection พอถึงเวลาเราอยากรู้ว่ามีภาพอะไรบ้างก็มาเปิดดูได้ หรือจะเอาภาพไปใช้ก็แค่เอาภาพไปใช้ได้เลย

usecase จริงๆ เวลาทำงานร่วมกับ ux/ui ก็นำ สมุดภาพของเราให้ ux/ui ดูเนี่ยแหละว่าเราทำตรงตาม design system ที่เค้าวางไว้มั้ย ถ้าตรง ก็คือ ผ่าน
React rendering cheatsheet
Tags: react, cheatsheet, tutorial, javascript
Published: 2020-07-09 14:55:31

---
title: React rendering cheatsheet
published: true
description: Why and how React renders components
tags: react, cheatsheet, tutorial, javascript
cover_image: https://will-it-render.vercel.app/social.png
canonical_url: https://www.kirillvasiltsov.com/writing/post/react-rendering-cheatsheet/
---

A few days ago I came across [this awesome article about React rendering behaviour](https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior/) by [Mark Erikson](https://twitter.com/acemarke). It's pretty deep and covers things that you won't find in the official docs and I think even on [Overreacted](https://overreacted.io/). I had problems with some rendering behaviours when building [react-easy-flip](https://github.com/jlkiri/react-easy-flip) and the article was very helpful.

For example, I didn't know that not everything re-renders when context value changes: under certain conditions (like when the child of the context provider is memoized with `React.memo`) only the providing component and the component that uses the context with `useContext` are re-rendered. Sometimes we really **want** a re-render even when props do not change, because we need to trigger some effect with `useEffect` or `useLayoutEffect`. If you notice that effect is not triggered for some reason, make sure the component is actually rendered by React.

## Cheatsheeted version

However, it is a BIG article so I decided to create a visual aid to it: with pictures and live Codesandbox examples that you can play with.

![rendering](https://will-it-render.vercel.app/meaningless-memo.png)

I thought that making it into an independent page is better so here's the link when you can see it:

https://will-it-render.vercel.app/
How are you dealing with quarantine?
Tags: discuss
Published: 2020-07-09 14:51:40

For me, even though I already have experienced remotely work, it's still difficult to maintain the mental health in this hard times.


In this period of quarantine I'm dealing with a anxiety and wasting performance in my work period I'm thinking how to get better, more motivated and focused at work time avoiding a negative thoughts.


Some steps I'm trying to avoid is stay at computer for more then 8 hours, reading books with different subjects then IT, watching series and things that make my mind more "free".


How are you dealing with this hard times?