teleren/devto huggingface dataset:
I know what to write!
Tags: improve
Published: 2019-03-03 01:54:22

---
title: I know what to write!
published: true
description: cognitive dissonance
tags: improve
---

I know what to write!

A good friend of mine, he's a new friend but a good one, told me that cognitive dissonance was important. That's funny, because one day I read in 1984 that that was a bad thing, and it stuck. But then I heard Tom Bilyeu mention that it's useful, or good, or something, to be able to hold two conflicting ideas in your head.

I think that's true now, because sometimes, or many times, those two conflicting ideas only *seem* conflicting, but might not be, as you begin to understand the ideas more, and realize that in fact they reconcile well. Or maybe they're two parts to a larger whole.

Cognitive Dissonance, Marisa Peer style: I am not a grumpy father. I accept my three year old son's whining and crying and screaming at kids. I don't scream at my son back when he screams at the top of his lungs because he spilled his milk. I don't do that. Cognitive dissonance: I understand that he is only three, that he is basically run almost exclusively by his limbic system. Cognitive dissonance: because I know that intellectually and have digested it viscerally (my prefrontal cortex said to the amygdala, "Hey guy, this stuff is real" and the amygdala said "Hey cool I got it," because of that excellent intra-brain communication (cognitive dissonance) I now no longer scream at my son when he screams in the car because we won't go to the Italian restaurant he wants to go to.
Using Custom Properties to ⚡️Supercharge your CSS⚡️
Tags: customproperties, css, javascript
Published: 2019-03-03 01:12:34

---
title: Using Custom Properties to ⚡️Supercharge your CSS⚡️
published: true
description: How to use custom properties to supercharge your CSS
tags: custom properties,css,javascript
cover_image: https://i.kinja-img.com/gawker-media/image/upload/s--PeC_225Q--/c_scale,f_auto,fl_progressive,q_80,w_800/1387224718989088432.jpg
---

If you've been doing web development for a while you've probably heard of SASS. It lets you do cool things like nesting rulesets, and using mixins. What you may not have realized is that plain old CSS now has one of the most obvious features of SASS, ✨VARIABLES✨! In CSS parlance these are called [*custom properties*](https://developer.mozilla.org/en-US/docs/Web/CSS/--*).

We know why variables in SASS are useful, but why would they be useful in regular CSS? Let's show some examples.

#### Theming

Imagine you need to show each of your users a custom color on their profile page, (ala Twitter).

If you use SASS you'll need to generate a custom CSS file for each of your users, *YUCK*. 'Oh I'll just use Javascript', you say. That's sustainable if you have a few elements that need to change color, but let's say you have lots of CSS! With custom properties you can do this in a snap.

```css
/* user-theme.css */
:root {
  --custom-color: #FF00FF;
}

/* main-theme.css */
.title {
  color: var(--custom-color);
}

.main-header {
  background-color: var(--custom-color);
}
/* ... lots more css in here */
```

Custom properties let you generate a tiny CSS file that can easily allow you to dramatically change the style of your page with minimal extra work.

#### Interactive Styling

Another wonderful thing you can do with custom properties, is allowing Javascript to easily modify page styles. Say, adding different color themes or changing text sizes. This becomes trivial using custom properties.

```css
/* main.css */
:root {
  --body-font-size: 16px;
}

body {
  font-size: var(--body-font-size);
}
```

```html
<!-- Some HTML input -->
<input type="range" onchange="changeFontSize(value)">
```

```javascript
// Javascript code
function changeFontSize(value) {
  document.documentElement.style.setProperty("--body-font-size", `${value}px`);
}
```

#### Some things you may notice. 

* Custom properties must have a variable name that starts with `--` per the spec, and to reference them you use the `var()` method in your CSS.

* The `:root` element is used in the examples. You can also scope custom properties to a ruleset and they will be scoped based on the cascade, just like other CSS properties.

* Setting custom properties on the `:root` element will let you use the properties in all of your CSS.

* IE decided to sit this one out and does not support custom properties, but all other browsers, including Edge, do.

Custom properties are a really cool feature for designing dynamic themes and styles using basic CSS and JS. Happy styling! 💇
Which .dev domains have you registered so far?
Tags: discuss
Published: 2019-03-03 00:07:14

---
title: Which .dev domains have you registered so far?
published: true
tags: discuss
---

It's been a while DEV!

Working at a start-up has its perks and one of them is working with dedicated people.  Working with people of such a caliber drives you to work more.

Anyway, I hope to write some more now that our main feature goals are starting to slow down.

Have you registered any .dev domains, yet?

I've registered two so far and can't wait to get started with them.

Mine are `jonathanirvin.dev` and `damnit.dev`.  The first I plan on using for my own site, and the other I have no idea what I'll do with it.  Got any suggestions? 

Tell me about the domains you've registered!
Every Content Creator Should Know This - Creative Commons CC0 License & Pexels.com
Tags: cc0, pexels, content
Published: 2020-09-11 20:42:27

---
title: Every Content Creator Should Know This - Creative Commons CC0 License & Pexels.com
published: true
date: 2019-03-03 00:00:00 UTC
tags: [cc0, pexels, content]
canonical_url: https://mrpowerscripts.com/cc0-pexels/
---

Creating content all by yourself is really hard, so it’s helpful to use art, music, and other assets to help you share your message. If you want to monetize your content you need to be especially careful. If the content you create utilizes the copyrighted works of others then you might be in for a world of pain. Thankfully Creative Commons has been around for a few years helping content creators by creating content licenses. 

These licenses are easy for content creators to understand, and help them share their works for others to use in various ways. One license is incredibly useful for content creators to know about, which is the CC0 license

The CC0 license allows a content creator to revoke all copyrights to the content they’ve created. Thus allowing anyone to use that content in their own private or commercial projects. Need a happy person to include in your marketing ad? It’s difficult and time-consuming to hire a model and snap the pictures yourself. It can also be expensive to buy stock photography. Especially if you have little to no budget. Thankfully there’s a lot of places that already exist where you can find CCO license photos or other kinds of content.

My favorite place to find CC0 license content is [pexels.com](https://pexels.com). They have been around for a few years now, and their collections are always growing. They have all types of high-quality photography available under the CC0 license, so you can use them safely in your own projects without fear of violating someone elses copyrights. Pexels has also added a video site, which can be found at [Pexels video](https://video.pexels.com). The Pexels video collection isn’t as large since it is a recent edition, but it will continue to grow over time.

I’ve also contributed to Pexels by submitting over a hundred of my own photos for people to use. I log in every once in a while to check out the stats and see the download counter go up. I wish there was a way for me to know how my images were being used. It would be cool to see a picture I took modified and used for a magazine, or a brochure. In any case, I’m happy others are able to find some use for them instead of letting them sit on a hard drive somewhere never to be looked at again.

If you have your own photography or videos you think others might find useful consider uploading them to Pexels. Sure, one day you might sell that random photo of a sunflower for a million dollars. It’s tempting to hold onto the copyrights. You might have some others worth sharing though. Sharing is caring.
Get Rich While Sleeping
Tags: education, motivation, money, programming
Published: 2019-03-02 23:37:36

---
title: Get Rich While Sleeping
published: true
description: How to generate money while sleeping
tags: education, motivation, money, programming
---
Money is the key to happiness. Without it, you won’t be able to achieve your dreams.

Ambitious people always try to find ways to get extra money in order to invest in themselves. This is the best list to make money while sleeping:

<b>1- Programming</b>

Programming is essential nowadays. Parents should teach their kids how to code because the world is shifting towards software development.

You can become a game developer since by publishing a game with ads and in app purchases, you will get extra money while sleeping. High KPI = more money per ad watched. You can check unity3d.com which has a great and simple user interface for all developers (from 8 years old till 100 years old).

Also, you can become an android and/or IOS developer and create an application where thousands or millions of people download it, and if this app has in app purchase and/or ads, then you will get lots and lots of money.

Finally, you can become a fullstack web developer and create your own website. It depends on the type of websites you will develop. alibaba.com which his net worth is 41.8$ billion according to money.com

I will write an article soon that will calculate how much money you can make depending on the number of downloads you have.

<b>Related Article:</b> <a href="https://dev.to/hussein_cheayto/how-to-gain-millions-of-dollars-using-your-skills-1e0k">How to Gain Millions of Dollars Using Your Skills</a>

<b>2- Youtube</b>

You can create a Youtube channel and begin uploading videos about a topic that you’re really good at.

Trust me, filming a Youtube video is not that easy especially if you’re a programmer.

Don’t wait for the perfect conditions, just turn on your camera and begin filming. You will never know how many people will watch it.

These are some topics that you might want to consider to get high views easily: money, music, sports, fashion, and tutorials (programming for example).

<b>3- Sell Courses</b>

You can create your own courses on udemy.com. If you’re skilled enough, why not film your own videos and upload them to Udemy. Therefore, students would learn from you, buy your courses and most probably will become part of your community or followers.

<b>Related Article:</b> <a href="https://dev.to/hussein_cheayto/read-these-books-if-you-want-to-be-rich-4bgo">Read These Books if You Want To Be Rich</a>

I hope this article helped you to learn how to make money while sleeping.
Finding IP addresses downloading a torrent using Python
Tags: python
Published: 2019-03-02 22:16:13

---
title: Finding IP addresses downloading a torrent using Python
published: true
description: A short tutorial on how to find peers from a Torrent file.
tags: python 
---

_If you want to skip the intro, you can go right to the [tutorial on exploring a torrent using Python](https://matix.io/finding-peers-from-a-torrent-file-in-python/)_

Many people pirate movies, music and other files using the Torrent network. 

Users are used to visiting sites like The Pirate Bay, clicking a magnet link, and starting a download in their favourite application like uTorrent, qTorrent, Vuze, etc.

When the file is done downloading, they get to watch their movie, and that's the end of things.

What most users don't realize is __the world knows they are downloading the file__. It is __public information__.

HBO has leveraged this fact to [send out legal threats to people illegally downloading Game of Thrones](https://www.cbc.ca/news/business/hbo-game-of-thrones-piracy-streaming-1.4226959). They're not the only ones. The Torrent network has always been heavily monitored.

In this brief tutorial, we'll show how you can [use Python to open a torrent file and scan the network to see who is sharing & downloading it](https://matix.io/finding-peers-from-a-torrent-file-in-python/)


[View the tutorial](https://matix.io/finding-peers-from-a-torrent-file-in-python/)
---
Revamp my blog from Jekyll to Gatsby, and You have to try
Tags: gatsby, react, jekyll, blogs
Published: 2019-03-02 22:11:55

---
title: Revamp my blog from Jekyll to Gatsby, and You have to try
published: true
description: 
tags: gatsbyjs, reactjs, jekyll, blogs
---

I revamped my blog to be built on Gatsbyjs instead of Jekyll, Everything become cleaner, and faster. In this post I'll explain what are the differences I have touched and why have you to try Gatsbyjs? so let's start.

## Documentation

It's my first time to use Gatsbyjs, I've finished my blog in just two days, it's so easy, the documentation is a great resource to learn what you need in building your gatsby project, code samples is great and the system is easy to learn. Gatsbyjs is based on ReactJS, but if you don't know ReactJS I think basics will help you build great things. In Jekyll Doc isn't a great resource to know everything, although it'll help you build your site but you have to search alot to find how things done.

## Code Structure

I really felt the difference, ReactJS with GraphQL Make a significant difference in revamp, they made me can customize the behaviour and the data structures I wanna get from my pages or posts, something like customizing frontmatter data, the path of posts, words count, time to read with no configurations is so great.
I don't point to Jekyll doesn't have the previous features, but you have alot to do to use them.

In Jekyll if you wanna loop through your posts, you have to write your loop in liquid which something i don't like it, but in gatsbyjs you can write it in javascript.

Using Layouts in Jekyll led me to create modify css files more than almost hundred times :D .

## Plugins

I have found alot of plugins in Gatsbyjs, on the other side gems doesn't help you alot in jekyll.
RSS for example, in Jekyll you have to use it in xml format, there's no way to use JSON feeds.

This the first post I've written after revamp and I'm sure the list will go on.


*Read this post on [my blog](https://zeyadetman.github.io/blog/posts/revamp-my-blog-from-jekyll-to-gatsby-and-you-have-to-try/) or follow me [on twitter](https://twitter.com/zeyadetman)*
Aurelia: How do we React - Part 1
Tags: aurelia, react, javascript, jsframework
Published: 2019-03-02 22:05:21

---
title: Aurelia: How do we React - Part 1
published: true
description: A 3-parts blog post series describing how Aurelia handles common React scenarios
tags: Aurelia,React,JavaScript,JsFramework
---

From the blog post:



The other day [Sebastian Markbåge](https://twitter.com/sebmarkbage) posted [the following tweet:](https://twitter.com/sebmarkbage/status/1098310123796062209)

>  You may have noticed that most other frameworks don't have HoCs, render props or anything like React.Children. These account for a lot the differences between React and other frameworks. How would you solve these use cases if you had to switch to [other framework]?

Great question Sebastian! ...


Part 1:

https://aurelia.io/blog/2019/02/21/how-do-we-react-part-1
What does a backend developer's portfolio should look like ?
Tags: discuss
Published: 2019-03-02 21:24:54

---
title: What does a backend developer's portfolio should look like ? 
published: true
description: How look a backend engineer's portfolio looks like ?
tags: discuss
---

Designers can create visual stuff and publish them on behnace and others, same for front end dev. But when you only know how to optimize databases, SQL queries, and API what should you add into a portfolio ?
How to make Gantt chart by mermaid
Published: 2019-03-02 21:17:19

---
title:  How to make Gantt chart by mermaid
published: true
description: How to make Gantt chart by mermaid
tags: 
---

# Introduction
Mermaid is a simple markdown-like script language for generating charts from the text.
This document shows the way to create the following Gantt chart by using mermaid cli tool.

![Sample Gant Chart](https://thepracticaldev.s3.amazonaws.com/i/8jcx0uzgzsaod2ovg2jd.png)

Mermaid Github repo:
https://github.com/knsv/mermaid

# Environment

Ubuntu 18.04 LTS (x86_64)

# Setup

* Install npm command

    There are some ways to install npm. Google it :-)

* Install mermaid.cli via npm

  ```bash
      $ npm install mermaid.cli
  ```

# How to create a Gantt chart

* Create a  mermaid file, for example, test.mmd:

```
    gantt
         title A Gantt Diagram
         dateFormat YYYY-MM-DD
         section Section
         A task :a1, 2019-01-01, 30d
         Another task :after a1 , 20d
         section Another
         Task in sec :2019-01-12 , 12d
         another task : 24d
```

The syntax is here:
https://mermaidjs.github.io/gantt.html

*  Run mmdc command.

```bash
$ ~/node_modules/.bin/mmdc -i test.mmd -o test.png
```
You will see the PNG file as test.png.

# Tips

## To remove today's red line
* Create the following json file.
  ```json
  {
      "themeCSS": ".today {fill: none; stroke: red; stroke-width: 0px;}"
  }
  ```
*  Pass the json file as following.
  ```
  $ ~/node_modules/.bin/mmdc -c config.json -i test.mmd -o test.png
  ```
Angular 9/8 Change Detection Tutorial with Example
Tags: angular, angular98, angularchangedetection
Published: 2020-02-01 19:13:27

---
title: Angular 9/8 Change Detection Tutorial with Example
published: true
tags: Angular, Angular 9/8,Angular Change Detection
canonical_url: https://www.positronx.io/understand-angular-change-detection-strategy/
---

The post [Understand Angular 7 Change Detection Strategy in An Easy Way](https://www.positronx.io/understand-angular-change-detection-strategy/) appeared first on [positronX.io](https://www.positronx.io).


We are going to understand **Change Detection Strategy in Angular 7** in an easy way `ChangeDetectorRef` will be explored in this article for your reference. Things you wanted to know about ChangeDetectorRef will be covered here. Every time there is a change in the app, Angular will perform **ChangeDetectorRef** on all the components. Whether it is a network request or user event, change detection will be performed by Angular.

[Click here to read more](https://www.positronx.io/understand-angular-change-detection-strategy/)
learn how to make your web layout look better with FlexBox
Tags: html, css, webdesign
Published: 2019-03-02 20:37:50

---
title: learn how to make your web layout look better with FlexBox
published: true
description: Hello and welcome back to my new tutorial where i speak about flexbox
tags: HTML, CSS , Web Design 
---
<img src="https://thepracticaldev.s3.amazonaws.com/i/71dj07yoqsf5xgeob2bn.png">

hello everyone and welcome back to a new tutorial, today we will speak about FlexBox, you have heard about it everywhere and you want to know what is flexbox. You are at the right place, in this tutorial we will see what is FlexBox, how we can use it and in the end, we will see how to make a simple web layout for your future blogs and portfolio.
link : <a href="https://doctorcodetutorial.blogspot.com/2019/03/make-your-website-layout-using-flexbox.html">learn how to make your web layout look better with FlexBox</a>
Trim a string in shell script
Tags: bash, shell, trim
Published: 2019-03-02 20:15:37

---
title: Trim a string in shell script
published: true
description: 
tags: bash, shell, trim
---

Nice trick just using echo command:
```
$ str="  a string  "
$ echo "[$str]"
[  a string  ]

$ new=$(echo $str)
$ echo "[$new]"
[a string]
```

To trim an entire file:
```
sed 's/^[ \t]*//;s/[ \t]*$//' < input_file
```
I'm Making a Ruby on Rails Course
Tags: course, rails, ruby
Published: 2019-03-17 00:54:45

---
title: I'm Making a Ruby on Rails Course
published: true
tags: course, rails, ruby
canonical_url: https://web-crunch.com/ruby-on-rails-course/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/q251dzd8qgesl5xo64r7.jpg
---

I’m beyond excited to share the news that I am making a Ruby on Rails course called [Hello Rails](https://hellorails.io)!

The course has a [dedicated landing page](https://hellorails.io) covering all of the details surrounding the course with many more to come. I wanted to publish a vlog/behind the scenes reasoning for the course and how it could benefit you if you’re interested in learning the vast framework.

{% youtube sbG2ThcEVwA %}

### Some background

Ruby on Rails has been a big part of my professional life for over 2 two years now. I reached for the framework in an effort to build out an idea I had for a side project called Affinicasts. The application featured videos and courses around the Affinity-Serif platform. Sadly, I decided to go in a different direction and sunset Affinicasts as a result.

While Affinicasts took tons of effort, I learned so much about Ruby on Rails. In an effort to learn even more I started creating tutorials or “Let’s Builds” as I like to call them on my [YouTube channel](https://youtube.com/c/webcrunch). That got increased interest from people all over the world. My channel’s subscriber count quickly grew as a result (and is still growing).

The tutorials on my YouTube channel covered both basic and advanced concepts a developer might run into when building their own Ruby on Rails apps.

As I authored more tutorials, I noticed each lack the concept of building a complete app and shipping it to a production server step-by-step. My course Hello Rails is my answer to that void.

I would describe my own teaching style as rather thorough. I don’t like to skip important steps of the process as I know someone new to the process wouldn’t know some of the conventions or patterns I know. This is true even if it takes more time and effort.

As a result, I wanted to make the course about using Ruby on Rails to build a full-featured web application from scratch that we actually ship to a production server.

The course consists of a book version and a complete video version. I have already finished the book version and am in the beginning phases of the video recording process as I write this. I’m so excited to share it with you when it’s complete.

### Get notified

If you would like to get notified when it’s live head to the [course landing page](https://hellorails.io) and share your email with me so I can notify via email when it’s ready. They’ll be a discount in it for you if you do ;).

You can also [follow me](https://twitter.com/justalever) or the [course page](https://twitter.com/hello_rails) on twitter!

The post [I’m Making a Ruby on Rails Course](https://web-crunch.com/ruby-on-rails-course/) appeared first on [Web-Crunch](https://web-crunch.com).