teleren/devto huggingface dataset:
What it takes to make your first YOUTUBE video?
Tags: showdev, beginners, webdev, html
Published: 2019-12-09 17:41:30

I have been procrastinating to make a youtube video for so long, it took me about 30 hours since I firmly decided to make a video.

The desire to make a tutorial video started long back when I was unable to understand many tutorials on youtube and other sites. The issue is not that the videos are good enough, the issue is the teaching style didn't work for me.

Finally, I decided to make a video about 2 months ago, I want my first video should be simple and useful to the #webdev community.

**Step 1 (Deciding on a topic)**: Again procrastinating comes into play, I spent a lot of time thinking on the topic HTML? CSS? JAVASCRIPT? JAVA? finally, I ended up picking [How to make VS CODE User Snippets](https://www.youtube.com/watch?v=kP7rc2shTA8&t=1s).

**Please [CLICK HERE](https://www.youtube.com/channel/UCBRX8VfhAp7FJ_13uzpI_pQ?sub_confirmation=1) if you like to subscribe**

**Step 2 (Tools)**: As a beginner, we strive for perfection and quality, so I started trying a bunch of screen recording tools, microphones, audio mixers, etc.. and if I have to buy the best products in the market I would definitely go bankrupt. so I decided to use **Camtasia 2** for screen recording and editing which I bought years ago on the app store with a gift card I got from apple,(Imovie and Quick time are free tools you can use if you have MAC). I wanted a decent microphone as audio plays a major role, so I bought the Blue Yeti USB microphone during thanksgiving deals.
1. Camtasia 2(Video/Screen Recording and Editing).
2. Blue Yeti Microphone (For good voice quality).
3. Canva (To create thumbnail and title animation).

**Free Tool Alternative:**

1. QUICK TIME & IMovie For MAC, CamStudio for windows.
2. Use the inbuilt MAC/PC microphone or your Earpiece microphone.
3. Canva (It's free for creating thumbnails or simple stuff, there is a paid plan as well)

**Step 3 (Recording & Editing)**: Its recording time, it felt very weird hearing my voice recorded, I spent almost 2 hours for a 10 minute video re-recording what I recorded the first time, surprise it didn't get any better than the first time and I got really tired. Final step editing, since me being a newbie in editing it took me 2 hours to edit the video and get it down to some 8 minutes, I wanted the video to be crisp so I edited a lot of gaps and fillers.

Finally, I uploaded the video on youtube and got a huge number of views, just kidding I got 10 views all mostly from my friends whom I asked to watch.

{% youtube kP7rc2shTA8 %}

The bottom line is just don't wait to be perfect in anything, just started doing even though it sucks like my [VIDEO](https://www.youtube.com/watch?v=kP7rc2shTA8&t=1s) on youtube. I will try to make more tutorials and fun videos on my channel [HackerHeap](https://www.youtube.com/channel/UCBRX8VfhAp7FJ_13uzpI_pQ). Please [CLICK HERE](https://www.youtube.com/channel/UCBRX8VfhAp7FJ_13uzpI_pQ?sub_confirmation=1) if you like to subscribe.
Mock-ups: The Issue with Placeholder Text
Tags: webdev, javascript, design
Published: 2019-12-09 17:20:17

Collaboration between designers and developers has become more crucial ever since the web went responsive. It becomes harder when content is dynamic.

## Line breaks

Ever had this perfectly polished Photoshop file with beautiful cards presenting the valued employees "Jane & John Doe" only to find out that this month's actual employee of the month is "Herbert Anthony Rudolphson-Myers" and your 2-line name suddenly ruins everything? Welcome to the club.

But how do we best test for variations in text and word-length? Isn't there this magical placeholder text called "lorem ipsum"?

## The lorem ipsum problem

Well, that's the go to, isn't it? But unfortunately we tend to use it according to our needs rather than adapting to how potential users fill out what e.g. is intended to be a 3-line bio. And trying out various text-length while fighting with CSS is an inconvenience. Unless...

## Filler tools 

There are a couple of tools specifically targeting this issue. My personal solution is [fillr](https://github.com/sroehrl/fillr). I simply include the the following tag

```HTML
<script src="https://cdn.jsdelivr.net/gh/sroehrl/fillr@v0.2.0/fillr.min.js" defer></script>
```

and that's all the setup required.

## How does it work?

Let's first investigate the markup

```HTML
<!-- this generates text for what is intended to be .5-2 lines -->
<h2>{{lorem}}</h2>

<!-- this generates text for what is intended to be about 5 lines -->
<p>{{lorem.rows(5)}}</p>

<!-- this generates text for what is intended to be .5-2 lines and repeats the element 3 times -->
<ul>
   <li>{{lorem.loop(3)}}</li>
</ul>

<!-- you get the idea: -->
<p>{{lorem.rows(5).loop(3)}}</p>

```
_NOTE: if you are using Vue, Angular or similar, you might want to use the alternative [[]] instead of double curly brackets_

Try it out: [codepen](https://codepen.io/neoan/pen/ExYJMwE?editors=1000)

## Now what?

What will happen now is that on every reload you will produce a slightly different output rather than a static placeholder text. This enables you, your customer and your designer to experiment and adapt to variations.

**PRO tip: depending on your backend, you might even use e.g. your CMS authoring form to play around with certain output (fillr's markup should be easy to teach)**

Knowing most of us fight with this problem: what is your solution?
Day 6 - Require & Module - Learning Node JS In 30 Days [Mini series]
Tags: node, javascript, codenewbie, tutorial
Published: 2019-12-09 17:19:39

Today we're going to learn about `require` and `module`

__We use require to call some other file and we pass different things from that file using module.__

Now we are starting with creating two files `app.js` and `song.js`. You can create your files as your desired name.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/km86gxiyandy3ehjfbph.png)


First we’ll write some codes in `song.js` file

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/f7f7nzboywjsm8tyvpvu.png)


I know what you are thinking why there is a extra line `module.exports` in the end of this file ?

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/f7f7nzboywjsm8tyvpvu.png)


This `module.exports` will available this function sing to everyone who required it. So how to require ?

You can just start require by writing `require(‘./song)` it will automatically understand it is a js file

Now you can call the sing file by require it and store it in a variable

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/09oe2exbhoievuuwelqn.png)


Now you can call the function from the `app.js` file (Sorry I made a mistake there will be `Song()` not `song()`)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/xarkgcewtglvdfrdrkbv.png)


You can run the file now by command `node app.js`

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/wbtcrap4bg90w0c4447l.png)

Final result (Sorry I made a mistake there will be `Song()` not `song()`)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/6kmah0qxubmliwsbhtsm.png)


Do you understand why we use `require` and `module` now ?

You can see the graphical version here
{% instagram B52-K1TAFxq %}

Originally it published on [nerdjfpbblog](https://blog.nerdjfpb.com/day6-nodejsin30days/). You can connect with me in [twitter](https://twitter.com/nerdjfpb) or [linkedin](https://www.linkedin.com/in/nerdjfpb/) !
My Journey
Published: 2019-12-09 17:16:37

Imagine being a kid and having an Amstrad CPC464 with a green screen monitor staring back at you, loading eagles nest and being instantly hooked on this wonderful technology. That was the first time I wondered how this piece of plastic with the tape deck driving away managed to make the screen tell me a story and how I could control my little army guy to make my own story. Computing was still new at that time in 1988 and I was 6 years old, the world still had the easter bunny, the tooth fairy, and Santa Claus.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/8v18oljx1rbu846h8yjr.jpg)

So the games kept coming and I kept playing still wondering how it all worked, so lets fast forward to 1992 and my memory is a little fuzzy here, but I think it was around this time we got our Amiga 1200 (Still one of the best machines I have ever owned!) and yes I want one now. The 1200 simply did everything, I had a 12mb hard drive! Man, that was so cool, workbench and a 12mb hard drive, insane! Beneath a steel sky could fit so easy on the thing and I'd only have to change a few disks instead of all 10. This is when I started to play around with code and see how things worked.

1996, my first PC and my first introduction to hardware, ok I'm a boy at this stage and I wanted to play Tomb Raider! So I have my brand new Compaq Presario but no 3D card to achieve the graphics required to hunt the tombs and find the relics! So what did I ask Santa for that year? Yep, a Voodoo 32X graphics card and Christmas Day came and I sat screwdriver in hand, my phone line connected to the internet( Or that 'God Damn Internet' Which is my dad's phrase) Installing the 3D greatness to play the game. Man, I cannot tell you how stoked I was when I managed to fire my duel pistols at that bear and scream as Lara fell to her impending doom. But I did it, I managed to fit and secure my first piece of hardware and I felt like a boss. But the biggest change was yet to come and that change was HTML! HyperText Markup Language, its a mouthful but armed with GIFS and a color palette my world was flipped upside down!

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/kxfasqw0mp3v9bkcpwjn.jpg)

It was an insane feeling having the power under my fingers and I can't wait to tell you more! Until next time folks...
Short Vim Tips #1 - Working with sentences
Tags: vim
Published: 2019-12-09 17:12:56

---
title: Short Vim Tips #1 - Working with sentences
published: true
description:
tags: vim
series: Short Vim Tips
---
Did you know that Vim has some decent motions for working with sentences. I was reminded of this while doing some markdown editing in Vim earlier today. Here are the motions:

`(` - Delete sentences backwards
`)` - Delete sentences forwards

Combining those with a few common operations in Vim let's you work some editing magic:

`d(` - delete the sentence before your cursor
`d)` - delete the sentence after your cursor

`c(` - delete the sentence before your cursor
`c)` - delete the sentence after your cursor


I rediscovered these earlier today and hopefully they'll help you too. Until next time! 👋
Where does serverless fit in cloud native apps?
Tags: serverless, podcast, azure
Published: 2019-12-09 16:15:38


A critical characteristic of cloud native architectures it the ability to dynamically scale and support massive numbers of users, events, and requests on these distributed applications and teams. Serverless can help in handling these challenges without having to worry about infrastructure or even an entire application. Jeff jumps into the show production and chats with us on how this fits into the plan for cloud native apps.

[![Watch episode on channel9](https://img.shields.io/badge/watcch%20episode%20on-CH9-orange)](https://channel9.msdn.com/Shows/The-Cloud-Native-Show/Where-Does-Serverless-Fit-in-Cloud-Native?WT.mc_id=cloudnativeshow-ch9-shboyer)

{% youtube 1kIH5qnlJzk %}

### Topics from the show

[Azure Functions](https://aka.ms/cldntvshw/functions)
[Azure Logic Apps](https://aka.ms/cldntvshw/logicapps) 
[Azure Application Insights](https://aka.ms/cldntvshw/appinsight)

See more episodes at https://aka.ms/cloudnativeshow or on our [YouTube Channel](https://www.youtube.com/playlist?list=PLlrxD0HtieHgyGYmk-h-NGpMEGCfn70Xc)!
Create a Super Simple Drawing Tool with paper.js
Tags: paperjs, javascript, html
Published: 2019-12-09 17:01:28

A short tutorial showing how to create a simple drawing tool with paper.js / javascript and html 

sourcecode - https://github.com/drnoir/Super-Simple-Drawing-Tool-with-Paper-JS-/blob/master/drawingtool.html

http://paperjs.org/
{% youtube oNR0PVx1MuA %}
Daily Challenge #133 - Suitcase Packing
Tags: challenge
Published: 2019-12-09 16:54:07

---
title: Daily Challenge #133 - Suitcase Packing
published: true
series: Daily Challenge
description: Write a function that, given the size of the squares and the suitcase, return whether the squares can fit inside the suitcase.
tags: challenge
---

Mr. Square is going on holiday. He wants to bring 2 of his favorite squares with him, so he put them in his rectangle suitcase.

Write a function that, given the size of the squares and the suitcase, return whether the squares can fit inside the suitcase.

`fit_in(a,b,m,n)`
`a,b are the sizes of the squares`
`m,n are the sizes of the suitcase`

*Example*
`fit_in(1,2,3,2) should return True`
`fit_in(1,2,2,1) should return False`
`fit_in(3,2,3,2) should return False`
`fit_in(1,2,1,2) should return False`

***
_This challenge comes from SADragonMaker 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 idea for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
CSS Animation Basics
Tags: css, tutorial, webdev, beginners
Published: 2019-12-09 16:29:06

Animations in CSS can be used to add make elements more dynamic within a webpage and add movement or actions within the page. You can use CSS animations to change the style of an element easily within a webpage.

We can set the animation to use on an element by using the 'animation-name' property. The animation applied to an element with the id of 'myElement' is called 'example'. The 'animation-duration' is used to set how long the animation should take from start to end.

```css
#myElement {
	animation-name: example;
	animation-duration: 4s;
}
```

The below code snippet shows creating the animation called 'example' using the '@keyframes' within CSS. The animation below will change an element's background color from the colour red to the colour yellow.

```css
@keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}
```

Obviously, there are different browsers, and people use different browsers to open webpages. CSS animations are a newer functionality available in CSS, and therefore is not directly supported in all browsers. The below code shows the same animation created above, but also specifying a browser type prefix so that different browsers can render/support the animation. In order, the browsers supported are Chrome, Firefox, Opera. Animations may not work in older browsers (such as IE 9). As well as the multi-browser support code below, you also need to generic animation creation code, as shown above.

```css
@-webkit-keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}

@-moz-keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}

@-o-keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}
```

The 'from' and 'to' keywords are no the only way to specify an animation. Percentages can be used to add additional steps within an animation. The below code snippets shows an animation that changes the background from red, to yellow, to blue, and then to green. These percentages can be any number that is a valid percentage, any number from 0 to 100. This can allow you to change the timing of an animation too.

```css
@keyframes example {
  0%   {background-color: red;}
  25%  {background-color: yellow;}
  50%  {background-color: blue;}
  100% {background-color: green;}
}
``` 

There are many different properties that you can change when using animations in CSS. Two of those properties are shown below, the delay and iteration count. The delay property determines how long after the page has loaded that the animation will start. The iteration count determines how many times the animation will play, this can be any whole number or the word 'infinite' which means the animation will loop forever.

```css
animation-delay: 4s;
animation-iteration-count: 2;
```

This article was originally posted on my website: https://acroynon.com/
dbExpress Drivers Support Latest Versions of RDBMS
Tags: delphi, database, databaseconnection
Published: 2019-12-09 16:24:05

---
title: dbExpress Drivers Support Latest Versions of RDBMS
published: true
description: Devart introduced the updated dbExpress drivers. Enhanced products now support the latest versions of RDBMS.
tags: Delphi, database, database connection
---

*Devart introduced the updated dbExpress drivers. Enhanced products now support the latest versions of RDBMS.*

Devart, a recognized vendor of professional database management software for developers and DBAs, released the updated dbExpress drivers. New RDBMS versions were supported in the associated drivers: InterBase 2020, PostgreSQL 12, and Oracle 19c. TLS 1.2 is also supported in the Direct connection mode of dbExpress driver for SQL Server.

The vendor also removed the limitation on the number of table columns users can retrieve in the trial version of dbExpress drivers on macOS and Linux. From now on, the codebase can be tested in a production-like environment.  

**dbExpress** is a database-independent layer that defines the common interface to provide fast access to SQL database servers from Delphi and C++Builder. For each supported server, dbExpress provides a driver as an independent library that implements the common dbExpress interfaces for processing queries and stored procedures.

All the breaking news about dbExpress drivers can be found at the official Devart website — https://blog.devart.com/tag/whats-new-dbexpress

**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/
Linux by example - Binutils, Math and Shadow
Tags: linux
Published: 2019-12-09 16:22:26

---
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/v0l936y5wm3bsqeqa9sp.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.
Dreaming in Code?!
Tags: codenewbie
Published: 2019-12-09 16:21:04

I know very little code at this point. Mostly HTML, CSS and a sprinkling of JavaScript and Python.

That was clearly enough for my brain to generate some imaginary lines and fill the gaps in a night of wild dreams.

I guess any code language works much like human languages with grammars, vocabularies and punctuations.

So dreaming in code isn't all that odd?! 

Whether you're learning Japanese or JavaScript, Portuguese or Python, you need to read, repeat and regurgitate.

I hope that's what my mind attempted last night. Not the most visually inspiring of dreams, but certainly vivid.

Has anyone else experienced something similar? Has anyone tried applying language learning tricks to learning coding?
Debugging Python Projects With PySnooper
Published: 2019-12-09 16:14:32

<p>Debugging is a painful but necessary practice in software development. The tools that are available in Python range from the built-in debugger, to tools integrated with your coding environment, to the trusty print function. In this episode Ram Rachum describes his work on PySnooper and how it can be used to speed up your problem solving in complex or legacy applications.</p><p><a href='https://www.pythonpodcast.com/pysnooper-python-debugging-episode-241/'>Listen Now!</a></p>
SnowflakeDB: The Data Warehouse Built For The Cloud - Episode 110
Published: 2019-12-09 16:01:14

<p>Data warehouses have gone through many transformations, from standard relational databases on powerful hardware, to column oriented storage engines, to the current generation of cloud-native analytical engines. SnowflakeDB has been leading the charge to take advantage of cloud services that simplify the separation of compute and storage. In this episode Kent Graziano, chief technical evangelist for SnowflakeDB, explains how it is differentiated from other managed platforms and traditional data warehouse engines, the features that allow you to scale your usage dynamically, and how it allows for a shift in your workflow from ETL to ELT. If you are evaluating your options for building or migrating a data platform, then this is definitely worth a listen.</p><p><a href='https://www.dataengineeringpodcast.com/snowflakedb-cloud-data-warehouse-episode-110/'>Listen Now!</a></p>
The 7 Most Popular DEV Posts from the Past Week
Tags: top7
Published: 2019-12-09 15:56:29

---
title: The 7 Most Popular DEV Posts from the Past Week
published: true
description: A round up of the most-read and most-loved contributions from the community this past week.
tags: icymi
cover_image: https://thepracticaldev.s3.amazonaws.com/i/sfwcvweirpf2qka2lg2b.png
---
Every Monday we round up the previous week's top posts based on traffic, engagement, and a hint of editorial curation. The typical week starts on Monday and ends on Sunday, but don't worry, we take into account posts that are published later in the week. ❤️

#1. Source Code Branching

Alessandro outlines a few examples of how git can be leveraged to achieve better results when implementing trunk based development.

{% link https://dev.to/alediaferia/git-tips-for-trunk-based-development-1i1g %}

#2. What is a unit?

Shahjada digs into three different methods of automated testing and explains why we can't rely on unit testing alone.

{% link https://dev.to/ebaytechberlin/100-test-coverage-is-not-enough-16d1 %}

#3. Business Platforms

Kevin explains the common struggles with growing a monolithic application, and how domain driven design can come to the rescue.

{% link https://dev.to/kmruiz/to-domain-driven-design-6ao %}

#4. Fav Commands

Maxence shares a cheat sheet intended for 'advanced' usage of git -- you won't find any basic commands here!

{% link https://dev.to/maxpou/git-cheat-sheet-advanced-3a17 %}

#5. A Single Window

If you ever need to download a file that'll take a few hours, you might want to consider using the screen command. In this post, Bobby explains how to keep a process running even after closing your SSH session.

{% link https://dev.to/bobbyiliev/how-to-keep-a-process-running-even-after-closing-ssh-connection-3cek %}

#6. More Readable, Less Confusing

Fred gives us an overview of the BEM methodology - a system for writing classnames and standardizing CSS style specificity.

{% link https://dev.to/xtrp/how-i-moved-a-step-closer-to-clean-css-and-how-you-can-too-with-the-bem-methodology-35bo %}

#7. Slides Are Secondary

Laurie shares their insight and advice for speaking at conferences -- from slide tips to traveling tips to the tech check.

{% link https://dev.to/laurieontech/confessions-of-a-conference-speaker-4789 %}


_That's it for our weekly wrap up! Keep an eye on dev.to this week for daily content and discussions...and if you miss anything, we'll be sure to recap it next Monday!_