teleren/devto huggingface dataset:
Day 74 : I Don't Know
Tags: hiphop, code, coding, lifelongdev
Published: 2020-01-27 23:18:23

_liner notes_:
- Saturday : Getting used to broadcasting in the new station. Had a lot of fun doing the show. You can check it out at https://kNOwBETTERHIPHOP.com

![Radio show episode image with the words January 25 2020, WXYZ](https://dev-to-uploads.s3.amazonaws.com/i/jeez60c07lx6ui433wav.jpg)

- Sunday : Spent the day resting and catching up on things since the Miami trip, like laundry and ironing my clothes.

- Professional : Did my expenses for the month. Wasn't that bad. I only had one conference trip and made sure to take pictures of all the receipts. It's my first expense report, so I don't know if I got everything correct. There were no errors, so we'll see. haha Also got the ball rolling for getting my hotel booked for the Atlanta trip later in February. Also worked on reworking a tutorial on the company's site to use Web Components. Going pretty well. Just a couple of more to go.

- Personal : Talked with a friend, E-Turn, who will be going to be touring Europe around the same time as me so we were coordinating schedules. Going to finish up ironing and work on some side projects.

![A forest in Harz, Germany with sunlight shining through the trees](https://dev-to-uploads.s3.amazonaws.com/i/1e1mf5mqfnlyie8hhghy.png)

Tomorrow, I've got a meeting with my manager. Hopefully he got to read some of my report. I would like to also demo what I've done with the Web Components project that I've been working on.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube NvzMu0DXIvo %}
Getting Started: Easy Way to Objects in JavaScript
Tags: javascript, beginners, htt
Published: 2020-01-27 22:56:09


Almost Everything in JavaScript are objects, ranging from functions to object itself etc, except the primitive values. 
Even some primitive values when called with the ‘new’ keyword will still return an object.

Math, RegExp, Date, function are all objects, 
with the new keyword string, number, Boolean will also return an object.

In JavaScript objects controls almost everything, objects is the main route, the emperor of JavaScript, if you understand how objects works in and out, there’s chances you will understand how JavaScript works. 

what are primitive values ?
Primitive values are values with no property and methods, In JavaScript Primitive values are not objects, they are immutable and hard coded value, which can’t be change.

Example of primitive values in JavaScript are string, numbers, Boolean, null, and undefined. 

Let name = ‘John Doe’

Primitive data types 
Are data that has a primitive value. 

What are objects 
Let take a glance through variables in JavaScript, 
const pie = 3.14 

JavaScript variable can only contain a single value, in this example the only value is 3.14, Objects are also variables. 

Objects are variables that can contain more than one value, basically a collection of named values

Read More on howtothese.xyz
Keeping up with my goals by having daily/weekly goals
Tags: productivity, management, career, showdev
Published: 2020-01-27 22:42:16

I tended to procrastinate a lot, especially when I am unhappy with work, relationships or with the task I am currently working on. This has led me to some serious procrastination issues, where I ended up not doing anything I had to, nor anything I've wanted to do. 

By procrastinating, I ended up procrastinating on goals I wished to accomplish, like reading more books, improving my career or anything related to my life goals. 

I started using some daily/weekly "templates", which has helped me overcome my procrastination during hours I should not be procrastinating. Although procrastinating isn't necessarily bad, these tips I try to apply during my day/week routine, so I don't slip on hours I should not.

## Preparing my week

Every Sunday evening, I set up an hour to establish my *3* weekly goals I want to accomplish during the coming week. There may be smaller goals, meaning they take little effort to accomplish but requires some days, like finishing a book. However, there may be a bigger goal you want to accomplish that might take a month to do so, such as delivering a project you are working on. The latter should be divided into subgoals, such as implementing the payment system in week 1.

For example:

```md
# Jan 27 - 31
* Implement the payment system for project Y
* Finish book XYZ
* Meditate before sleep
```

That's it. It's simple, straight to the point and doesn't feel or look scary or anything you would want to run away from. Keep in mind that these goals are goals for improving yourself and making you feel better, and not designed for work-related, although you could adapt a version alike. 

## Preparing my day

Every day in the evening, I take a few minutes to think of 3 things I want to accomplish tomorrow. I think of future goals I would like to accomplish, that I could very well be starting tomorrow. Such as improving my algorithm thinking, or reading some paper related to my field. 


```md
# Jan 27
* Read 25 pages of book XYZ
* Swimming classes
* Solve 3-4 work code-related tasks
```

## Keeping it up

Keeping this up is easy to forget, so you have to get **write** them down, I write down my daily goals in my todo app, which makes it easier for me to keep track and read it during the day. My work uses Google Calendar for meetings and events, so I sync todo list with Google calendar, so I only have to check my goals and todos in one place.

I keep my weekly goals written down in a file. I do that because I might add some notes related to that week so I can check later.  

## Conclusions

By making sure I had all these goals set during my week, I've been able to confront my goals and accomplish them every day and every week, without feeling the guilt of procrastinating when having goals set or feeling time pressure. Three goals daily and weekly allows me to have time for other things which may not necessarily be a goal.
Colorful main section, Fade in animation | Module Monday 71
Tags: showdev, githunt, webdev, javascript
Published: 2020-01-27 22:20:26

---
title: Colorful main section, Fade in animation | Module Monday 71
published: true
description: Module Monday 71
tags: showdev, githunt, webdev, javascript
cover_image: https://res.cloudinary.com/component/image/upload/b_rgb:ffffff,c_lpad,h_350,w_800/v1580100548/phantom_bk0caa.gif
canonical_url: https://guide.anymod.com/module-monday/71.html
---

## Open source mods

Mods are modules that can be used on any website, web app, or anywhere else. There are hundreds more like these built & shared on [AnyMod](https://anymod.com).

Click a mod to see it along with its source code.

## Phantom main
A main content section based on the Phantom theme.
<a class="btn btn-sm" href="https://anymod.com/mod/phantom-main-mlrnnm?preview=true">View mod</a>
<a href="https://anymod.com/mod/phantom-main-mlrnnm?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1580100548/phantom_bk0caa.gif"/>
</a>

## Fade in hero section
Fades and translates into place when the page loads.
<a class="btn btn-sm" href="https://anymod.com/mod/story-hero-mlrbad?preview=true">View mod</a>
<a href="https://anymod.com/mod/story-hero-mlrbad?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1580100546/story-hero_jzemw0.gif"/>
</a>

## Overlay traveler
A circular overlay that elegantly moves out of the way when closed.
<a class="btn btn-sm" href="https://anymod.com/mod/masonry-gallery-with-collapsible-call-to-action-overlay-barnrn?preview=true">View mod</a>
<a href="https://anymod.com/mod/masonry-gallery-with-collapsible-call-to-action-overlay-barnrn?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1562985793/header_hgrore.gif"/>
</a>

## Fractal theme footer
A subtle reusable footer based on the Fractal theme.
<a class="btn btn-sm" href="https://anymod.com/mod/fractal-footer-ballmr?preview=true">View mod</a>
<a href="https://anymod.com/mod/fractal-footer-ballmr?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1580100541/footer_oigwxf.png"/>
</a>

## Responsive call to action (CTA)
Image underlay with buttons that look great at any angle.
<a class="btn btn-sm" href="https://anymod.com/mod/cta-call-to-action-raldrd">View mod</a>
<a href="https://anymod.com/mod/cta-call-to-action-raldrd">
  <img src="https://res.cloudinary.com/component/image/upload/v1580100549/cta_pveceb.gif"/>
</a>

<hr>

I post new mods from the community [here](https://dev.to/tyrw) every (Module) Monday -- I hope you find them useful!

Happy coding ✌️
Released 1.5
Tags: saas, humanresource, unicorn, release
Published: 2020-01-27 21:50:27

This week was quite a busy week over at Unicorn.io. We made several deployments and updates.

A summary of what has been done:

Massive mobile optimizations
Deployment of Cloudfare
New Terms of Use for Employers/Companies
New Terms of Use for Talents/Candidates
Calendly integration
Deployed the first version of the German version of unicorn.io (beta)
Frontend Country translations based on the language selected
Pushed Schema.org across unicorn.io
Implemented Pro-sitemaps
Integrated Whatsapp Chat widget
Created a Reddit subreddit
Created a Medium channel
Automated submissions of new blog articles on Telegram
This is a details of the change log we have updated.

[1.5.1] — 2020–01–17 [stable]
– Mobile optimization of the lists
– Mobile optimization of the footer
– Mobile optimization of the homepage
– Mobile optimization of the talent page
– Mobile optimization of the employer page

[1.5.0] — 2020–01–17 [stable]
– Deployed Cloudflare
– Deployed new Terms of Use for Employers/Companies
– Deployed new Terms of Use for Talents/Candidates
– Added Whatsapp Chat Integration with support from 9:00–21:00 EET
– Added direct links to ToU for Employers/Candidates signup page
– Added direct links to ToU for Talents/Companies signup page
– Removed hardcoded urls, replace with global var in index and hire
– Updated translations (en/de/fr)
– Other bug fixes

[1.4.9] — 2020–01–16
– Fixed an issue with c++ and .net urls in /cvs /resumes
– Updated the translation files
– Added Calendly integration for talents
– Added Calendly integration for employers
– Added employer.registration.light to fast track Employers’ registration
– Added medium link in footer https://medium.com/@unicorn_io
– Other bug fixes

[1.4.8] — 2020–01–15 [stable]
– Fixed an issue with c++ and .net urls in /cvs /resumes
– Optimized remote.talent.upload-avatar in post to wait for success response before redirecting
– Optimized getOGImage()
– Fixed display issue in grid for location (after adding schema.org)
– Fixed sitemap issues
– Added Schema.org Person on grid
– Added icons as global
– Added generateSchema()
– Added generateSchemaPerson
– Added uploadProfilePictureRemote()
– Other bug fixes

[1.4.7] — 2020–01–14 [stable]
– Made the grid under search results, mobile friendly
– Fixed translation issues in grid under search results based on the language you selected
– Fixed translation issues in list element
– Added Reddit subreddit in footer https://reddit.com/r/unicornio
– Added console() function
– Other bug fixes

[1.4.6] — 2020–01–14
– Added WP-Rocket Plugin on blog
– Added WP-Telegram Plugin on blog
– Added Linkedin Pixel
– PBX Update for all properties
– Massive title additions across the website
– Started auto-translation of Country/Countries on Grid/Core
– .htaccess modifications
– Deployed German version https://unicorn.io/de
– Updated international translations (fr/en/de)
– New security measures
– Added Kosovo ISO code XK
– Footer — Added Shop and Support
– Other bug fixes

The road ahead is still long, but we will keep working hard on making this project a success.
CSS Variables Explained in 2 Minutes with an Interactive Demo
Tags: webdev, css
Published: 2020-01-27 21:48:51

---
title: "CSS Variables Explained in 2 Minutes with an Interactive Demo"
published: true
description: "CSS variables have been around for quite some time now, but are nevertheless extremely useful. The value of a variable can be just about anything, from pixel values to colors to linear-gradients. You can use a variable almost anywhere by wrapping it in a var function."
tags: #webdev, #css
cover_image: "https://xtrp.io/api/content/static_files/css-variables-explained-with-demo/photo2.jpg"
---

CSS variables have been around for quite some time now, but are nevertheless extremely useful.

They can be defined in an element like this:

```css
element {
	--my-variable: #555;
}
```

The value of a variable can be just about anything, from pixel values to colors to linear-gradients. 

You can use a variable almost anywhere by wrapping it in a `var` function:

```css
another-element {
	color: var(--my-variable);
}
```

## Why Not Use a Preprocessor for Variables?

This is a very common question, as preprocessors seem to have solved the CSS variable problem even before native CSS variables existed!

However, **CSS variables can be changed in real-time** and aren't compiled, which means that it is possible to change the value of a CSS variable within JavaScript, and all references to that variable will be automatically changed. The example coming up uses this ability pretty well, and uses this ability of CSS variables to its advantage.

## A Demo of CSS Variables in Action

One use CSS variables is the ability to use a singular variable for a site's primary color, and then allow the user to interactively change that primary color as they wish.

Here's a fun little CodePen that shows just that!

{% codepen https://codepen.io/xtrp/pen/ZEYZKOw %}

Here, I use some basic JavaScript code to change the CSS variable, and thus changing the theme color of the entire page.

## Other Use Cases of CSS Variables

The example above is one of the many example use cases of CSS variables. Other possible uses include:

 - Creating a CSS variable for a default font size of an element and dynamically changing that for disabled users
 - Creating a CSS variable for the height and width of an element and dynamically changing that variable in a CSS animation
 - Creating CSS variables for each of the colors on your site an dynamically changing those variables to create a "dark mode" or different theme

## Browser Support &amp; Conclusion

CSS variables are supported in all major browsers except IE, QQ, and Baidu: [CanIUse Data for CSS Variables](https://caniuse.com/#search=css%20variables).

I hope you enjoyed this explanation and demo of CSS variables and find them to be useful in your sites. I personally use CSS variables for colors and font sizes on the several of my sites, and have found them to help keep my styles much cleaner and easier to read and refactor.

Thanks for scrolling.

&mdash; Gabriel Romualdo, January 27, 2020
How often do you use tools from GitHub Marketplace?
Published: 2020-01-27 21:48:11

I've built my own tool and last week my app was published on GitHub marketplace as unverified. I am now working towards verified version. But I have no increase in number of users since then. Any suggestions how drive traffic and what are criteria by which GitHub sorts the app in each category on the Marketplace. Or anyone has recently listed their app on GitHub marketplace? 

Thank you!
How to Schedule a Python Script to Run Daily
Tags: python, tutorial
Published: 2020-01-27 21:38:44

When I started programming, I remember feeling frustrated that I didn't have a simple way to take my python script and get it to automatically run everyday. With the WayScript beta (free tool), we created a super rapid way for you to get your script running in the cloud without any DevOps setup. 

Sample Template - https://wayscript.com/shared/D9ToJA2M

Tutorial Video - {% youtube PHyrJ3fOmas %}
break, continue, and return
Published: 2020-01-27 21:04:04

The break statement results in the termination of the loop, it will come out of the loop and stops further iterations. 

var sum = 0;
 for var i = 0 ; i < 5 ; i++ {
    if i == 2 {
        break //this ends the entire loop
    }
    sum += i //thus only 0 and 1 will be added
}


The continue statement stops the current execution of the iteration and proceeds to the next iteration. 

var sum = 0;
for var i = 0 ; i < 5 ; i++ {
    if i == 4 {
        continue //this ends this iteration of the loop
    }
    sum += i //thus, 0, 1, 2, and 3 will be added to this, but not 4
}  


The return statement takes you out of the method. It stops executing the method and returns from the method execution.


function returnMe() {
    for (var i=0; i<2; i++) {
      if (i === 1) 
        return i;
    }
}

alert(returnMe());
// 1



func myMethod(){
    newMethod()
}

func newMethod(){
    var sum = 0;
    sum += 2;
    if sum > 1 {
        return //jumps back to myMethod()
    }
    sum += 3; //this statement will never be executed
}

Returns can also be used to return a value from the function.

func myFunc() {
    let value = newFunc() //assigns 5 to "value"
}

func newFunc() -> Int {
    return 5 
}
How to style a select element with CSS
Tags: css
Published: 2020-01-27 20:56:09

{% youtube m9dNLMbCjkk %}

View the [demo on CodePen](https://www.youtube.com/redirect?v=m9dNLMbCjkk&redir_token=eMH7fW1DLzfagrUm-gEqKDcWXRx8MTU4MDI0NDgzMUAxNTgwMTU4NDMx&event=video_description&q=https%3A%2F%2Fcodepen.io%2Falexcarpenter%2Fpen%2FzYxbgVX)
Laravel custom Pivot Model events (many-to-many relationship)
Tags: laravel, php, events, refactoring
Published: 2020-01-27 20:47:54

---
title: Laravel custom Pivot Model events (many-to-many relationship)
published: true
description: This post will help understand how to handle events of custom Pivot Model in Laravel.
tags: laravel, php, events, refactoring
---

Laravel [offers events](https://laravel.com/docs/5.8/eloquent#events) like *created*, *updated*, *saved* and many other for regular Eloquent models. What about **Pivot** models?

>Starting from Laravel 5.8, Pivot Model events are supported.

For a refresher on Pivot Models, refer to docs [here](https://laravel.com/docs/6.x/eloquent-relationships#defining-custom-intermediate-table-models).

##Scenario

Let's take consider the example from docs about Many-to-Many relationship. User and Roles. 

We are interested in following use case:

>Whenever, a Role is assigned to a User, send a notification to Admin.

We can simply use `attach` method and then send notification right after that like below:

```php

$user->roles()->attach($roleId);

$admin->notify(new RoleAssigned);
```

Wouldn't it be cool if we can refactor this notifying part to dedicated event and listener and clear up our controller method?

##Dude, tell me already!

Let's define the Pivot mode, as `RoleUser`.
```php
namespace App;

use Illuminate\Database\Eloquent\Relations\Pivot;

class RoleUser extends Pivot
{
    //
}
```

Let's add the secret sauce, `$dispatchesEvents` array:


```php
namespace App;

use App\Events\RoleAssigned;
use Illuminate\Database\Eloquent\Relations\Pivot;

class RoleUser extends Pivot
{
    protected $dispatchesEvents = [
      'created' => RoleAssigned::class
    ];
}
```
Be sure to register this event and its listener in `EventServiceProvider`.

Event and its listener can be simply defined just any other Event/Listener.

```php
class RoleAssigned
{

    public $roleUser;

    /**
     * Create a new event instance.
     *
     * @return void
     */
    public function __construct(RoleUser $roleUser)
    {
        $this->roleUser = $roleUser;
    }

}
```


```php

class MessageCreatedListener implements ShouldQueue
{

   public function handle($event)
   {

      //access the Pivot model like below...
      
      $event->roleUser
     
      //send a notification here
   }

}
```

Extracting logic like "sending notifications" into Event/Listeners can be beneficial, as Listeners can be queued and notification can be sent in background.

Now, our controller function will be super simple:

```php

public function store()
{
  $user->roles()->attach($roleId);
  
  //
}
```

Above line will fire the event (RoleAssigned) and its Listener will send the notification.

Peace 🙌🏼
Module 5 Project 1
Published: 2020-01-27 20:26:15

<!DOCTYPE html>
<html5>
	<head>
		<title>Form</title>
	</head>
	<body>
    <form>
   First name:
   <input type="text" name="firstname"><br>
   Last name:
   <input type="text" name="lastname"><br>
      Email: <input type="email" name="email"><br>
         Age <input type="number" name="quantity" min="1" max=”90">

    </form><br>
      <form>
      Which of the following states have you visited?<br><br>
         <input type="checkbox" name="state1"><value="Texas">Texas<br>
        <input type="checkbox" name="state2"><value="New Mexico">New Mexico<br>
        <input type="checkbox" name="state3"><value="Utah">Utah<br>
      <input type="checkbox" name="state4"><value="California">California</form><br><br>
      <form>
      Which of the following colors most closely resembles or is your favorite color?<br><br>
         <input type="radio"name=”color" value=”Red">Red<br>
   <input type="radio" name=”color" value=”Yellow">Yellow<br>
            <input type="radio"name=”color" value=”Blue">Blue<br>
   <input type="radio" name=”color" value=”Orange">Orange<br>
             <input type="radio"name=”color" value=”Green">Green<br>
      <input type="radio" name=”color" value=”Purple">Purple</form><br><br>
      <form>
      Pick your favorite food from the list below.  If your favorite food is not in the list below, select "other"?<br><br>
             <input type="radio"name=”food" value=”Buffalo Wings">Buffalo Wings<br>
   <input type="radio" name=”color" value=”Yellow">Yellow<br>
            <input type="radio"name=”food" value=”Hot dogs">Hot dogs<br>
   <input type="radio" name=”name" value=”Fried chicken">Fried chicken<br>
             <input type="radio"name=”food" value=”Meat loaf">Meat loaf<br>
   <input type="radio" name=”food" value=”Cheesesteak">Cheesesteak<br>
         <input type="radio"name=”food" value=”Cheeseburger">Cheeseburger<br>
   <input type="radio" name=”food" value=”Grits">Grits<br>
            <input type="radio"name=”food" value=”Macaroni and cheese">Macaroni and cheese<br>
   <input type="radio" name=”food" value=”Chicken fried steak">Chicken fried steak<br>
             <input type="radio"name=”food" value=”Corn dog">Corn dog<br>
      <input type="radio" name=”food" value=”Other">Other<br><br></form>
     
      <form>
        Short Biography:<br>
 
   <textarea rows="4" cols="50">

   </textarea>
</form>
<form>
   <select name="carlist" form="carform">
      <option value=”accord">Honda Accord</option>
      <option value=”civic">Honda Civic</option>
      <option value=”altima">Nissan Altima</option>
      <option value=”impala">Chevy Impala</option>
   </select>
</form>
           <form method=“post” action=“process.php”>
   <input type=“submit” value=“Submit”>
</form>
                 
	</body>
</html5>
Starting 2020 with a coding challenge
Tags: javascript, react, python, 100daysofcode
Published: 2020-01-27 20:22:34

# 30 Days Of JavaScript

We started the new year with a coding challenge and the result was very impressive, we are on day 25th challenge and it has made a great  impact.
👉  In the last two months, I have been publishing Python and JavaScript challenges and it reached to every corner of the planet and inspired thousands of developers. 

👉 The Python and JavaScript materials are sited by many websites and developers as the best programming reference materials for learning and teaching.  I am glad to see that the material has created a world impact in just a short amount of time and this inspired me to do more challenges in the rest of the year. 

🔥 The challenges start the first day of every month. You can give a try

💻  30DaysOfJavaScript Github: https://lnkd.in/efqy_df
💻  30DaysOfPython Github: https://lnkd.in/epW6d_U

👥  Join the 30DaysOfJavaScript group: https://lnkd.in/er7kdTE
👥 Join the 30DaysOfPython group:  https://lnkd.in/eE5Qgqd