teleren/devto huggingface dataset:
Ethereum Wallet Sample code
Tags: ethereum, privatekey, bip39, javascript
Published: 2020-04-01 15:35:05

---
title: Ethereum Wallet Sample code
published: true
description: 
tags: ethereum, privatekey, bip39, javascript
---

```javascript
var Wallet = require('ethereumjs-wallet');
let hdkey = require('ethereumjs-wallet/hdkey');
var EthUtil = require('ethereumjs-util');
let bip39 = require("bip39");

// input secret
const privateKeyBuffer = EthUtil.toBuffer('0xb3daa3c32f6f6c71a3fc0c3af081e971c78706459f358b43451a1ba0d4ef3dba');
const wallet = Wallet.fromPrivateKey(privateKeyBuffer);

// public key from secret key
const publicKey = wallet.getPublicKeyString();                                                                                                                                                                                                                                                               
console.log('public key: ' + publicKey);

// address from secret key
const address = wallet.getAddressString()
console.log('addres   : ' + address);

const mnemonic = "soldier clump basket brain suit wire whisper equip aim neck kangaroo rely";

// hd wallet from mnemonic
let hdwallet = hdkey.fromMasterSeed(bip39.mnemonicToSeedSync(mnemonic));

// master key
console.log('master private key: ' + hdwallet.privateExtendedKey())
let wallet_hdpath = "m/44'/60'/0'/0/";

// generate wallets
for (let i = 0; i < 5; i++) {
  let wallet = hdwallet.derivePath(wallet_hdpath + i).getWallet();
  let address = wallet.getAddressString();
  console.log('address-' + i + ': ' + address);
}
```

```shell
public key: 0x12dd7df75e3a2b2b2d17358221f0811a6a19251c66cf502a6ca02a23205f3d27b7c416eca8e9e7ae45e47862ff7bf0ccc013f27a81e4fc9a0d513808db28d90b
addres   : 0x72a60325bbcff70e6278f03482b7ae44d175503b
master private key: xprv9s21ZrQH143K3oPizmavifFSRXSdVFTxVn3zdWqa3X2AqAidQnef4sxPVLsFM9PtZcASh14fr3e1Fwac7qdvKyqQgdg8tCKTDQ4LLgkvLmh
address-0: 0x72a60325bbcff70e6278f03482b7ae44d175503b
address-1: 0x2bd38b66259092248e9a1943acd63dffda479010
address-2: 0x48a0806dc7c143f4e31a68dd5590cb57b1b89cda
address-3: 0x54072de9b7c7d29dbf189fb0ed4670d53975a6a6
address-4: 0xf6b82083948be7ce8e36699a00041ddc1be2354d
```
Getting started with Node + Express on Glitch
Tags: glitch, express, node
Published: 2020-04-01 15:10:03

---
title: Getting started with Node + Express on Glitch
published: true
description: Freshening up Glitch’s full-stack starter app
tags: glitch, express, nodejs
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ha2z7izsy6al7y3mu452.jpg
---

[Glitch](http://glitch.com?utm_medium=weblink&utm_source=dev.to&utm_campaign=blog&utm_content=dev) has a cornucopia of projects you can remix, customize, and make your own. But sometimes you just need a quick mostly-blank slate. That's why we provide three "hello world" apps that are designed to be but mere vessels for your great idea or simple experiment. We want to make sure these projects are up-to-date and reflect the latest best practices, so we periodically give them a fresh coat of paint. Recently I wrote about the [changes made to our simple database starter `hello-sqlite`](https://dev.to/glitch/hello-to-the-new-hello-sqlite-5044). Next up was `hello-express`, which provides a simple [Node.js](https://nodejs.org/) and [express](https://expressjs.com/) app!

We want the `hello-` apps to strike a balance between simple and instructive- there should be minimal functionality that's easy to build on top of or replace, but enough there that creators newer to the technologies can get a baseline understanding of how they work. As with `hello-sqlite`, it was again decided to add a little more functionality to `hello-express` to make it a more "complete" app.

Previously, the app did little more than use Node and Express to serve a static site that was functionally the same as [`hello-webpage`](https://glitch.com/~hello-webpage?utm_medium=weblink&utm_source=dev.to&utm_campaign=blog&utm_content=dev) (a basic webpage starter). That didn't really show why one would use a server for the task at all! The sample client-side JS now loads information from the server, demonstrating both how to send JSON from the server as well as the basics of using [`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) on the client side to get the data.

The big structural change aside, we also did some other tidying and upkeep:

* 📦 updated Node to latest Long Term Support release, version 12, as well as updated all dependencies
* ⚖️ file naming consistency between `hello-express` and `hello-sqlite`
* ✨ shiny modern ES6+ features on both frontend and backend
* 📝 rewriting the README to explain the new project structure
* 💆‍♀️ some gentle style massage

So with that, enjoy the new `hello-express`:

{% glitch hello-express %}

Merry remixing!
💡How to update your npm dependencies easily 🏎
Tags: npm, javascript, tip
Published: 2020-04-01 15:00:49

In large projects with many dependencies it is sometimes hard to track which dependencies are outdated or not. Whenever you need to update them, the __npm-check__ tool can help you with that.


This tool has an interactive mode that can be run with:
```
npx npm-check -u
```

The tool interactive mode looks like this:
![Tool interactive mode](https://dev-to-uploads.s3.amazonaws.com/i/ny9b36stuf8dq69wkcrl.png)

Then you just need to use the up/down arrow keys to navigate between the packages and use the space bar to select those that you want to update. In the end, just press enter to update and install the previously selected packages.

Besides listing outdated libraries, it also adds a link to the package documentation, which is very useful to quickly access the release notes to check the migration guides.

Please check the tool [documentation](https://www.npmjs.com/package/npm-check) for extra options.
Dev Log: mbedtls for dart  
Tags: dart, mbedtls, webassembly, ffi
Published: 2020-04-01 15:00:40

I has started to create a mbedtls package for dart.
https://github.com/kyorohiro/mbedtls_dart
This library will support webdev and server side 's environment.

### What is mbed TLS
Mbed TLS is a greate SSL and Crypto library. This library is written at Clang. and Very small size code. We can use this library for a embed system too. 
https://tls.mbed.org/

### Things I want to write
I use dart:js and dart:ffi in this package to call clang API, This allowed the library to support both webdev side and the server side.

In this process. I could get some know-how.
ex: I found and learned that how to write common code with dart:js and dart:ffi.

I'll want to introduce these know-how.
- how to use dart:ffi (todo link)
- how to use dart:js and wasm (todo link)
- info.kyorohiro.mbedtls for dart 's coding strategy (todo link)

and I'll add some link here.
An open-source curl-based command line tracker for coronavirus or covid-19 with historical chart.
Tags: covid19, coronavirus, tracker, cli
Published: 2020-04-01 14:50:35

Hello, I just wanna share my command line project with you. I created a program called COVID-19 Tracker CLI which is a curl-based and local command line tracker for pandemic coronavirus.

Great idea? For me no... it is a basic command line tracker just to track the cases around the world.

![Project Preview](https://github.com/WarenGonzaga/covid19-tracker-cli/raw/master/lib/img/screenshot.jpg)

Visit the repository here:
<https://github.com/WarenGonzaga/covid19-tracker-cli>

Love the project? Support it...
<https://warengonza.ga/coffee4dev>

Let me know your feedback about the project in the comment section. I want to improve the project.
Using next-i18next in Storybook
Tags: react, storybook, i18n, nextjs
Published: 2020-04-01 14:46:00

next-i18next is built to work server-side as well as client-side. Storybook doesn't support server-side rendering so there's nowhere to add the next-i18next middleware. The good news is that means we don't have to support server-side rendering and can just use the underlying react-i18next and i18next-instance.

## Adding a Storybook Decorator

We're going to add a [decorator](https://storybook.js.org/docs/basics/writing-stories/#decorators) which will allow us wrap all stories in the `<I18nextProvider>`.

The decorator will be added to `.storybook/preview.js` so you need to create one if you haven't already.

```jsx
import { I18nextProvider } from 'react-i18next';
import i18n from './i18n';

addDecorator(storyFn => (
  <I18nextProvider i18n={i18n}>{storyFn()}</I18nextProvider>
));
```

## Configuring i18next

We can't use the same i18n config that we use in next-i18next. We need to use a [react-i18next instance](https://react.i18next.com/latest/i18next-instance). I recommend creating the file at `.storybook/i18n.js` since it's just for Storybook config. The setup can be as simple as this:

```js
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';

i18n.use(initReactI18next).init({
  fallbackLng: 'en',
  debug: true
});

export default i18n;
```

## Configuring Static Paths in Storybook

The last step is to tell Storybook that it should serve the locales dir as a [static path](https://storybook.js.org/docs/configurations/serving-static-files/#2-via-a-directory). We achieve this with the `-s` CLI flag.

```json
{
  "scripts": {
    "start-storybook": "start-storybook -s ./public"
  }
}
```
Write Your Own Reduce Function JavaScript
Tags: javascript, functional, tutorial
Published: 2020-04-01 14:34:56

The JS reduce function is a powerful utility in any developers tool belt and as such it’s crucial to have a good understanding of it. To get an understanding, there is no better way than to build your own.

Imagine we want to get the sum of an array of numbers. Using the native reduce function we would write the following.

```javascript
    // native reduce function

    const numbers = [1,2,3]

    const sumReducer = (initialValue, current) => initialValue + current;

    const sumOfNumbersNative = numbers.reduce(sumReducer, 0)

    console.log('Native reduce function, ' + sumOfNumbersNative)

    // Native reduce function, 6
```

As you can see, the reduce function takes two arguments, firstly a callback, and secondly the initial value (a number, or an object for example). The callback is your ‘reducer’, which takes 4 arguments, the accumulator, currentValue, index and array. As you can see in the above example our sumReducer only needs the accumulator and the current value as it is only a simple version.

The initial 0 value is passed into our reduce function, which is then passed into our sumReducer function and added up with all the other numbers to return the number 6.

Be careful to note the difference between the main reduce function and the reducer that you pass into it. The reducer is the logic that you run your reduce with.

Let’s take a look at how we would build a custom reduce function to hopefully clarify things a bit. You should notice that we are looping over the array we pass into it, and running those values through a reducer that will be defined when we use the new reduce function.

```javascript
    // custom reduce function

    const numbers = [1,2,3]

    const sumReducer = (initialValue, current) => initialValue + current;

    const reduce = (reducer, initialValue, array) => {
      let value = initialValue;

      for(let i = 0; i < array.length; i++) {
        let currentValue = array[i]
        value = reducer(value, currentValue)
      }

      return value;
    }

    const sumOfNumbersCustom = reduce(sumReducer, 0, numbers)

    console.log("Custom reduce function, " + sumOfNumbersCustom);
```

You can see from the above that all your are doing is running an array of values through your desired logic to get a single output. This single output, could be a number, an array or an object. Similar to how you reduce your tomato sauce down by boiling it, we are reducing our array into a single desired thing. This is a powerful tool that can be utilised on a much more complex items, for example creating a nicely organised JSON object out of a string of data. If you don’t understand it the first time round, keep practicing and eventually it will stick and become second nature.
New Guide:👏Track your coverage statistics with SonarQube and Buddy! 
Tags: cicd, devops, webdev, tutorial
Published: 2020-04-01 14:34:19

This in-depth article by Kirill Konshin (@kirillkonshin) will show you, step-by-step, how to introduce SonarQube code coverage tracking in a CI/CD environment using Buddy. From setting up your code and SonarQube installation to Buddy integration and action configuration.

See how easy it is to track coverage statistics and find bugs in your code using those two amazing tools. <b>Full Guide --></b><a href="https://buddy.works/guides/sonarqube-guide?utm_source=devtoshare&utm_medium=social&utm_campaign=social_media_bz&utm_content=sonarqube_guide">HERE</a>
🎈🎊🥳Thank you for 30.000 followers! We celebrate this with an #AMA!
Tags: ama, webdev, beginners, javascript
Published: 2020-04-01 14:20:37

**Hello beautiful people** 🖐

After 60 posts and a weekly challenge to write a blog post!

We have reached 30.000 followers!

**Thank you all for that!**

To celebrate this we will have an #AMA here!

So ask me anything down below in the comments and I will answer **all** of them!

**👋Say Hello!** [Instagram](https://www.instagram.com/lampewebdev/) | [Twitter](https://twitter.com/lampewebdev) | [LinkedIn](https://www.linkedin.com/in/michael-lazarski-25725a87) | [Medium](https://medium.com/@lampewebdevelopment) | [Twitch](https://dev.to/twitch_live_streams/lampewebdev) | [YouTube](https://www.youtube.com/channel/UCYCe4Cnracnq91J0CgoyKAQ)
Show details transition using HTML and CSS
Tags: html, css
Published: 2020-04-01 14:12:54

---
title: Show details transition using HTML and CSS
published: true
description: Show details animation using HTML and CSS
tags: html, css
---


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


If you've seen the above transition and you liked it then it's time to move on and see how it's built.

It's pretty easy to build something like that using only HTML and CSS, so let's get ready:

We'll start as always with HTML part:

First we'll start off by adding a `div` container for our image and the mask that we will trigger when the hover selector gets activated:

### HTML
```html
     <div class="card">
        <img
          src="...some url"
        />
        <div class="mask">
          <div class="content">
            <h2>Programmer</h2>
            <p>
              You are the best!
            </p>
          </div>
        </div>
    </div>
```

### CSS: The container for our image

Next we're going to write down some basic css:

```css
.card {
  overflow: hidden;
  position: relative;
  background: #fff;
  border-radius: 5px;
}
```

We need `overflow: hidden;` because our `div` with details will be in the same container but just moved down so we can't really see it at first.

Then we need `position: absolute;` to be able to use `top`, `right`, `bottom`, `left` properties to move the details `div` down.

### CSS: Adding width and height for our image

We move on to styling the image that will be first loaded. The image needs to be spread throughout the container:
```css
.card img {
  width: 100%;
  height: 100%;
}
```

### CSS: Styling the details mask

Now its time for our details mask to get some styles:
```css
.card .mask {
  opacity: 0.8;
  top: 100%;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #181a1c;
  transition: 0.2s;
  color: #fff;
  border-radius: 5px;
  text-align: center;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
```
The important things here are :
```css
...
  opacity: 0.8;
  top: 100%;
  width: 100%;
  height: 100%;
  position: absolute;
...
```
We used `opacity: 0.85;` to make the details div transparent and we moved it from `top` by `100%;`, this means that it is no longer in view, and because we added `overflow: hidden;` on the container looks like it never existed.


### CSS: Triggering our transition

Now to trigger our transition we just need to set the `top` position to `0` and enjoy:

```css
.card:hover .mask {
  top: 0;
}
```


I hope you enjoyed, here is the [live version](https://codesandbox.io/s/details-mask-transition-wt291)
Microadventures with BASIC!
Published: 2020-04-01 14:02:08


My early memories of computers were those of the ATARI 800XL, this machine was the best thing has ever happened to me, at least when I was 8 years old!
Games such as Space Invaders and Missile command were the absolute fun and delight to enjoy between studying pauses, then I got Pacman, frogger and Donkey Kong ; and I was officially hooked to programming from that moment.

I did not want to learn programming to be a programmer, I wanted just to study the codes behind that curtain which makes a game A GAME that people can actually buy for REAL money but of course I wasn't interested in that when I was 8 but more of the magical lines that created this yellow ball being chased by some colored ghosts in a black maze with blue walls [pacman] and same for the other games.

Until now, I am fascinated by programming not because I want to eb an engineer or  a programmer in Google or a medium company or even a programmer at that small kiosk on the corner of the street! I am interested in programming because of the logic behind those statements written in hours and hours which created a full game ( application, design, web site or whatever) with characters weapons roads or anything else.

Recently, I was watching and episode of the8bitguy [ you'll find him easily on YouTube ] and his episode he was talking about BASIC language, and inside that episode there was another guy [ the LGR , another fantastic YouTuber ] and he was talking about some fascinating idea in the eighties to let kids like programming or at least to teach logical thinking through programming; and he talked about 
[[[[[ MICROADVENTURE ]]]]] and the concept of this is really awesome.

Microadvanetures with Basic is a small novel - a novella I suppose, with various mysteries, and in order to demystify a certain event or situation, you will need to write a small program in the BASIC language - of course the script is printed in the book - and then you will have the answer ; isn't that awesome ? I find it super cool, and you will be surprised to know that I was thinking about the same idea before I saw that it was an actual already implemented idea 35 years ago !! 

you can check that website for more information : https://microadventure.net
How to: Create a PowerShell alias with parameters
Tags: powershell, aliases
Published: 2020-05-24 21:20:27

---
title: How to: Create a PowerShell alias with parameters
published: true
date: 2020-04-01 14:00:00 UTC
tags: PowerShell,aliases
canonical_url: https://seankilleen.com/2020/04/how-to-create-a-powershell-alias-with-parameters/
---

I was recently asked how to create a PowerShell command alias that accepts parameters.

The asker wanted to know how to run a command such as:

`ffmpeg -i "take 1.avi" -vcodec h264 -acodec mp2 output.mp4`

but have the input and output values as parameters to the alias.

## You can’t do this with PowerShell…

In PowerShell, aliases are meant to be for hard-coded commands and aren’t able to be parameterized. Bummer.

## …but you can accomplish the same thing by storing a function in your profile!

We’ll be able to get the desired outcome in just a few steps, by creating our own function and then loading that whenever PowerShell loads, via the `Profile.ps1` file.

## Step 1: Create a PowerShell function

We’ll create a function to do what we need to do, with the appropriate parameters.

For example, let’s say we call the function `Encode-Video`:

```
function Encode-Video([string]$VideoFileName, [string]$OutputFileName)
{ 
    ffmpeg -i "$VideoFileName" -vcodec h264 -acodec mp2 "$OutputFileName" 
}

```

## Step 2: Create a Profile.ps1 file

Powershell handily uses a variable for your profile file, `$profile`.

So, if you were to run:

```
notepad $profile

```

You’ll either open the existing `Profile.ps1` file, or be prompted to create a new one.

## Step 3: Paste your function and save

Paste the function you created in step 1 into the `Profile.ps1` file and save it.

## And that’s it!

Now, whenever PowerShell loads, the definition for that function will also be loaded from your profile file, and you can use it as much as you’d like.

Happy scripting!
isNil - nullish coalescing ??
Tags: javascript, node, functional
Published: 2020-04-01 13:50:27

We have all been there. You need to check if something is `null` or `undefined`, but because false-like, `falsy`, values are a thing in JavaScript, `0`, `''`, and `false` are also captured in your checks. You become frustrated, and, may end up writing a helper like this:

```javascript
const exists = val => val !== null && val !== undefined
const isNil = val => val == null // actual lodash implementation
```

In the first case, you have to be verbose, and you check if something **is not** `null`, nor, `undefined`.

In the second, well, there's just something strange about using loose equality in modern JavaScript (wouldn't blame you if you didn't notice), and here you actually check, if something **is** `null` or `undefined`.

Of course, both can be re-written:

```javascript
const isNil = val => val === null || val === undefined
const exists = val => val != null
```

Nowadays, the `??` nullish coalescing operator has been introduced, and it sits currently at **stage-4**, and is available in Chromium already. This operator checks for `null` and `undefined` in one go.

```javascript
const str = (null || undefined) ?? 'default value'; // 'default value'
const num = 10 ?? 100 // 10
```

Using this new operator you could write `isNil` and `exists` like this:

```javascript
const isNil = val => val !== (val ?? !val);
const exists = val => val === (val ?? !val);
```

There's nothing inherently better, about either of these approaches. Other than perhaps, ~~showing off~~ expanding your JavaScript knowledge.

I think the latter looks cleaner, maybe because it removes the need to explicitly write `null`, or `undefined`. Maybe because it uses flashy new language features?

One additional consideration, which I personally like, is that `NaN`, is also deemed to not exist, because `NaN` cannot be equal to itself. 

Anyway, what do you think?
Hire Best Graphic Design Services
Published: 2020-04-01 13:39:05

Visual depiction is the craft of making a visual portrayal for a business or an association that shows the clients what a business does or the sort of administrations at offer utilizing a mix of visual designs just as the substance. The imaginative plan office Singapore cares for the structuring of pictures, designs, format, content which are according to the business prerequisites. It is the obligation of the inventive plan organization to manufacture and improve the brand personality of business by structuring outwardly engaging illustrations and administrations. 

Marking requires content as well as the structuring of visual topics and illustrations which catches the purchasers' consideration. We at Hipster are an improvement house as well as we additionally offer the best imaginative structure benefits in Singapore.
https://hipster-inc.com/software-services/graphic-design-company/