teleren/devto huggingface dataset:
Resources to make Github Actions useful
Tags: github, actions, automation, devops
Published: 2019-08-21 17:03:27

As the new Github Actions feature is rolling out worldwide, I wanted to take a minute and compile a short list of resources that will help you get started with Actions and take full advantage of extreme power that they bring.

Here are the resources that I recommend you check out when starting with Actions:

- Check The Action Bible, aka "Workflow Syntax" to look through the syntax of Actions: https://help.github.com/en/articles/workflow-syntax-for-github-actions
- Browse through the list of "Awesome Actions" to find some inspiration: https://github.com/sdras/awesome-actions
- When you want to use existing actions or find examples of Actions, check the Actions Marketplace:
https://github.com/marketplace?utf8=%E2%9C%93&type=actions&query=
- If you're migrating actions from old syntax to new syntax: https://help.github.com/en/articles/migrating-github-actions-from-hcl-syntax-to-yaml-syntax
- To understand the events that trigger workflows: https://help.github.com/en/articles/events-that-trigger-workflows

Hope you find these resources useful, have fun, and stay active!
Make CSS3 grid layout in 1 minute
Tags: css, grid, layout, design
Published: 2019-08-21 16:42:19

---
title: Make CSS3 grid layout in 1 minute
description: This tool was created to create css3 grid layouts. This generates the grid and aims to generate css output. It is also a good place to learn CSS3 grid.
tags: css,grid,layout,design
published: true
cover_image: https://res.cloudinary.com/dmtrk3yns/image/upload/q_auto/v1566374571/grid-maker/demo.gif
---

<p align="center">
  <a href="https://layout-master.now.sh/" target="_blank" rel="noopener noreferrer">
    <img width="100" src="https://thepracticaldev.s3.amazonaws.com/i/8s6ku5rxmyhzbg8xg8e2.png" alt="Layout-master logo"></a>
</p>

[Website](https://layout-master.now.sh/)

If you are having difficulty with CSS3 Grid and you need to quickly write a layout, then this tool may help you.

The interface of the tool is very simple, you can change the size, change the location of the widgets. You can highlight rows and columns in the grid, and in the end you just get the generated CSS code


![](https://res.cloudinary.com/dmtrk3yns/image/upload/q_auto/v1566374571/grid-maker/demo.gif)

Let's create our html file and put the already generated css code

```html
<style>
  /* A little style 💅 */
  .container > div {
    background-color: rgb(211, 234, 252);
    text-align: center;
    padding: 20px 0;
    font-size: 30px;
  }

  .container {
    display: grid;
    grid-template-areas:
      "Header Header Header Header Header"
      "Left Main Main Main Right"
      "Left Main Main Main Right"
      "Left Main Main Main Right"
      "Left Main Main Main Right"
      "Left Main Main Main Right"
      "Footer Footer Footer Footer Footer";
    grid-template-rows: 100px auto auto auto auto auto 100px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 10px;
  }

  .head {
    grid-area: Header;
  }
  .left {
    grid-area: Left;
  }
  .main {
    grid-area: Main;
  }
  .right {
    grid-area: Right;
  }
  .footer {
    grid-area: Footer;
  }
</style>

<div class="container">
  <div class="head"></div>
  <div class="left"></div>
  <div class="main">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    cillum dolore eu fugiat nulla pariatur.......
  </div>
  <div class="right"></div>
  <div class="footer"></div>
</div>

```

I just changed the `grid-template-rows`

Let's look at the result

![](https://res.cloudinary.com/dmtrk3yns/image/upload/q_auto/v1566374438/grid-maker/layout-master-demo2.gif)

##### Links

<p align="center">
<p><a href="https://layout-master.now.sh/">Website</a></p>
<p><a href="https://github.com/vaheqelyan/layout-master">Repo</a></p>
<p><a href="https://github.com/vaheqelyan">@vaheqelyan</a></p>
</p>
Organizing Local Tech Scenes, A Podcast Episode
Tags: discuss, career, productivity
Published: 2019-08-21 16:24:17

Hey everyone! I haven't forgotten about all of you. Just had a wild week and a half at work that we're just now getting on top of.

There are still some posts in the pipeline about building, configuring, and running applications on my Raspberry Pi Kubernetes cluster!

Until then, I thought it would be worth sharing an episode of a podcast I was on this past weekend.

[Between Two Rocks Podcast: Episode 22 - NewHaven.io](https://betweentworocks.com/episode-22-newhaven-io/)

In my free time, I help run a local tech group called [NewHaven.io](https://newhaven.io). Several years ago, this group was created to pull all of the disparate Meetup groups in town (different languages, stacks, technologies) under one banner. I've been involved as a board member for about a year now and it's been a wild ride.

We were invited onto this podcast by another of our board members and we discussed how we want to grow out our local scene and focus more on inclusivity and diversity.

Hopefully, this might provide some nugget of wisdom to any of you out there who might be wanting to get more involved in your local developer community. Whether you want to help organize more events or stand up a Meetup group of your own, rest assured that there are developers in your area who will greatly appreciate the effort you put in to help grow your scene.

For all of you already helping run similar groups, what are you doing to provide more value for your members? We're always trying to find ways to do more with less help organizing, so I'm curious about anything and everything you're doing regarding throwing events, growing a sense of community, and fostering a support group.

---

Again, Raspberry Pi cluster articles inbound! Until then, stay frosty.

[https://henryneeds.coffee](https://henryneeds.coffee)
[Blog](https://henryneeds.coffee/blog)
[LinkedIn](https://linkedin.com/in/henryquinniv)
[Twitter](https://twitter.com/quinncuatro)
Byte Sized Episode 3: The First Ever Sorting Algorithm
Tags: computerscience, radixsort, bytesized, history
Published: 2019-08-21 16:12:21

---
title: Byte Sized Episode 3: The First Ever Sorting Algorithm
published: true
description: The full story of Herman Hollerith and his amazing contributions to computer science history.
tags: computerscience, radixsort, bytesized, history
cover_image: https://thepracticaldev.s3.amazonaws.com/i/n3sxoelzd0owznrclzdk.png
series: Byte Sized Season 1
---

Today's episode of Byte Sized is about [Herman Hollerith](https://en.wikipedia.org/wiki/Herman_Hollerith), [IBM](https://en.wikipedia.org/wiki/IBM), and the creation of the [Hollerith Machine](https://en.wikipedia.org/wiki/Tabulating_machine) and [Radix Sort](https://en.wikipedia.org/wiki/Radix_sort).

For more about Radix Sort, check out this post:

{% link https://dev.to/vaidehijoshi/getting-to-the-root-of-sorting-with-radix-sort %}

Follow **Byte Sized** for an adventure through computer history, a few minutes at a time. More great episodes to come.

{% organization bytesized %}

<center>
# **Today's Sponsor**
</center>

{% organization heroku %}

{% link https://dev.to/devteam/why-dev-hosts-on-heroku-and-how-we-configure-our-service-1caj %}
svelte-emoji-selector: Emoji picker Svelte component
Tags: showdev, javascript, svelte
Published: 2019-08-21 16:10:39

![Screenshot](https://thepracticaldev.s3.amazonaws.com/i/zzbzkg5viqz08mm7kcln.png)

Another emoji project? Why not! I have been playing with Svelte a lot these past few weeks. I adapted some of the code from https://emojipicker.app to build an emoji picker of sorts for Svelte apps.

It has features like search, skin tone variations, and it will save your recently used emojis.

Unfortunately the npm package name `svelte-emoji-picker` was already taken, so I went with `svelte-emoji-selector`.

Demo here! https://joeattardi.github.io/svelte-emoji-selector/

Code here! https://github.com/joeattardi/svelte-emoji-selector
Share Tech Links - A platform to share tech resources
Tags: dotnet, angular, javascript, showdev
Published: 2019-08-21 15:52:57

**Share Tech Links** — a platform to share links of articles, blogs, tutorials, and resource links of software technologies to the community.

I've recently developed a web-based application conceptualized, designed and back-end entirely done by me. The concept is different from other Blogs/Q&A sites. Here only links can be shared with a short description.

**URL** — https://sharetechlinks.com

**Following technology used**
	
* ASP.NET Core MVC
* MySQL - Backend
* Material Design
* Hosted in Linux server

**Features**
	
* Tagging Support
* Posts categorization under appropriate topics
* Dynamic - Each page runs using back end no static content
* Any one can share - Will be visible to the public after the moderator approved.
* Gamification - Credit to Contributors for each post
* Google Login
* SEO optimized
* Optimized for speed
* Progressive Web App
* Mobile friendly
* Bookmark feature
* Like/Unlike the post
* User Profiles
* Filters to sort by  - recent, popularity, most viewed


**Home Page**
In this site, tech resources are well categorized into Topics and Tags spanning several software technologies.


Topics across various technologies are available
* General
* GitHub — Projects links
* Software and Tools
* ASP.NET Core
* Angular
* Android
* Javascript
* Databases
* Xamarin
* Blazor
* Web Development
* UI/UX Design
and more to come



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

**Tags**
Each post contains tag support for quick access.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/w8f5vso9e22s9ywvz8wp.png)

**Bookmark, Like, View Count**
You have to sign to bookmark / like a post

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


**Filters**
Several filters provided for quick access

**Contributors**
Top contributors are listed. you can also become a contributor by sharing links. You earn 5 points for each approved post.

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


**Create Post**
* Anyone can submit a post, For submitting a post you need to log in using your Google account.
* You can share a link to Blog Post, Articles related to the category specified.
* Post created will be sent to Admin for approval. You will get 5 Points for each approved posts
* If you don't find the appropriate category you can include in Notes.

**Upcoming Enhancements**
* Universal Search by content
* Email Subscription
* App Notifications
* Follow User / Category
* Auto fetch of meta tags from the link for quick posting.
* Android app

**Conclusion**
Share Tech Links provides a good platform to share valuable technical resources with the community.
Your contributions and feedback are welcome.

If any feedback please drop an email at — sharetechlinks@gmail.com
Chrome Extension that improves tab navigation UX
Tags: chromeextension, tabs, ux, tabmanager
Published: 2019-08-21 15:50:08

---
title: Chrome Extension that improves tab navigation UX
published: true
cover_image: https://artrayd.com/quicka/screenshot-4.png

description: Switch tabs 2x times quicker. Made for VueJs ❤️
tags: #chromeextension #tabs #ux #tabmanager
---

Hi devs,

Please checkout chrome extension I made, it may save to you 5-10 minutes a day on tab switching. 

##### Screenshot:
![](http://artrayd.com/quicka/product-hunt-screenshot-3.png)


##### Here is how:
1. Clicking target is 2x bigger
2. Mouse path is shorter, because it's in the center of screen


[Here](https://medium.com/@dmitrymind/this-web-extension-will-help-you-to-save-1-5-cee580480881) I wrote short UX research artricle with more details

##### Link:
https://chrome.google.com/webstore/detail/quick-a/gilkjbonaifnnghbdpjmbomjjfffabmn
Start of BeCode
Tags: webdev, career, beginners
Published: 2019-08-21 15:47:59

I don’t know where to share this with people so I decided to do it here! 

Last week I started a course in Web Development at BeCode Brussels.

BeCode offers short-courses in Web Development in Belgium (6months) and I can’t believe I am part of this.

They help me developing myself into a developer which is one of my dreams.

So far so good, thanks to BeCode! Hopefully I made the right choice!
NimWC New Release
Tags: nim, webdev, showdev
Published: 2019-08-21 15:21:35

---
title: NimWC New Release
published: true
description: New release of NimWC
tags: nim, webdev, showdev
---

# New stuff

- Hardened by default (based from Debian Hardened+Gentoo Hardened).
- Compressed signed database backups (SHA512,GPG,Tar Gz).
- Design by Contract.

# Others

- Nim `0.20.2` compatibility.
- CLI logic refactored.
- Updated Docs.
- Bug Fixes.

# Features of always

- Self-Firejailing Web Framework (It Firejails itself).
- 2 Factor Authentication by default (TOTP).
- App Store integrated.
- Admin Dashboard.
- Admin can choose how much CPU & RAM NimWC can use.
- Log Viewer directly from browser.
- Auto-Rotating file Logger.
- Server Status Page for Admins.
- Email notification on critical errors.
- Colored output on the Terminal.
- ReCAPTCHA (Optional).
- Plugin skeleton creator to create your own new plugins.
- High Availability design by default.
- Full Stack with the same programming language, including DevOps.
- WebP automatic Image and Photo Optimizations.
- Libravatar/Gravatar support builtin.
- Upload/Download files and images (private or public).
- WYSIWYG & Drag'n'Drop Editors.
- Simple INI config.
- Postgres or SQLite.
- JavaScript framework agnostic.

*...and a lot more.*


# Learn more

- https://dev.to/juancarlospaco/self-firejailing-web-framework-h5l


# Get it

- https://github.com/ThomasTJdev/nim_websitecreator#nim-website-creator


# Thank you for playing

[![](https://thepracticaldev.s3.amazonaws.com/i/4huq62a5r8tck64apdtd.png)](https://nim-lang.org)

- [NimWC Live Demo.](https://nimwc.org/login)
- [Learn Nim today.](https://nim-lang.org/learn.html)
- [Play with Nim on a sanbox directly from browser.](https://wandbox.org/permlink/uB9X6XJh2D7jmwdS)
- Say *Hi* on the bridged [Gitter](https://gitter.im/nim-lang/Nim), [Matrix](https://matrix.to/#/#freenode_#nim:matrix.org), [Telegram](https://t.me/nim_lang), [IRC](irc://freenode.net/nim), [Discord](https://discord.gg/ezDFDw2).

👑
Daily Challenge #46 - ???
Tags: challenge
Published: 2019-08-21 14:57:11

---
title: Daily Challenge #46 - ???
published: true
series: Daily Challenge
description: Removing question marks
tags: challenge
---
Today's challenge requires you to write a function which removes all question marks from a given string.

> For example: `hello?` would be `hello`

***
_This challenge comes from [aikedaa](https://dev.to/aikedaa) here on DEV._

_Want to propose a challenge idea for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
Steve Jobs & Steve Wozniak is to Apple as ___ is to ___
Tags: justforfun, jquery, game, rails
Published: 2019-08-21 14:55:47

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

A. @ben, @jess, @peter/DEV 👨‍💻👩‍💻
B. John Resig/jQuery 📡
C. DHH/Ruby on Rails 🛤

Or suggest your own answer.
Introducting RunCLI
Tags: commandline, tools, cli, showdev
Published: 2019-08-21 14:17:16

---
title: Introducting RunCLI
published: true
description: Easily share CLI commands
tags: commandline, tools, cli, showdev
---

> I just released the first version of a new little tool called RunCLI. 

[RunCLI](https://runc.li) let's you easily share commands with a URL. It's really basic right now - just paste a command in the textbox and click "Create". The main use case is for apps like Twitter, where sharing a medium-sized CLI command is difficult to do well.

Here is an example with a Git command:

https://runc.li/#Z2l0IGxvZyAtLXByZXR0eT0iQCVoIiAtLW51bXN0YXQgLS1mb2xsb3cgPEZJTEVfTkFNRT4gfCBncmVwIC12IFx8IHwgIHRyICJcbiIgIiAiIHwgdHIgIkAiICJcbiIgfCBhd2sgJyQyID4gNCB7IHByaW50ICQyLCAkMywgJDEgfSc%3D

I probably won't add a lot more to this, but I'd love to know what you would like to see it do!
Ruby Gem rest-client 1.6 compromised
Tags: ruby, rails, security
Published: 2019-08-21 14:16:50

Good morning everyone, if your Ruby project happens to be using rest-client 1.6.13, you may have some backdoor code.

Here is a link to the issue on github:
https://github.com/rest-client/rest-client/issues/713#issuecomment-522735093

This is just a PSA, double check your gems and have a great day!
Named Function vs. Variable Function?
Tags: help, discuss, codenewbie
Published: 2019-08-21 13:12:24

---
title: Named Function vs. Variable Function?
published: true
description: What is better, named function or one assigned to a variable?
tags: help, discuss, codenewbie
---

Hi guys, I'm reading a JavaScript book and came across this example, but it doesn't fully explain when to use each and what the usecases are other than the fact that named functions are hoisted?

Can someone explain if one is better than the other all the time or what the usecases for each are?

function fun() {
Console.log("Hello from func 1"
}

var fun = function(){
Console.log("Hello from func 2"
}

Both can be used as callbacks etc, to me assigning a variable to a function seems just like a named function? Thanks!

Sorry for lack of formatting, wrote this on my phone. Also couldn't seem to add the image via mobile?
Weekly Picks #89 — Development Posts
Tags: webdev, css, javascript, productivity
Published: 2019-08-21 12:55:47

* [Best web development frameworks in 2019](https://app.dailynow.co/r/09e4a5995b0e9eb05052c57c796f649b)
* [You Don’t Need CSS-in-JS — Why I Use Stylesheets](https://app.dailynow.co/r/8eff6a9ee87e88fed9ba692f5de7dfba)
* [6 points you need to know about async/await in JavaScript](https://app.dailynow.co/r/05262792798b154aea0493ca016de1d1)
* [Reactide — The first React dedicated IDE](https://app.dailynow.co/r/49ad20ef226e59f87a2b1131e8fc38c3)
* [Top 5 Animation Libraries in React Native](https://app.dailynow.co/r/bcebd575d2cb0ca7473d397a3f71553c)
* [Top Angular Open Source Projects](https://app.dailynow.co/r/d1434e39e0bfbe7a28e4837962ff38fe)
* [How to Build a Command Line (CLI) Tool in NodeJS](https://app.dailynow.co/r/f72082f2f133660253eaf91049f7679d)
* [Creating a Pomodoro Timer in JavaScript in 10 Lines of Code](https://app.dailynow.co/r/ed1cddbde68c1ea22b62ef348068b650)
* [8 VS Code Extensions Every Javascript Developer Should Use](https://app.dailynow.co/r/eb93e8fc6becd8e99e65d9895a5430fd)
* [Building Custom React Hooks](https://app.dailynow.co/r/87d1886ca450d0dc374b855ab9ce6d48)

* * *

[_Thanks to Daily_](https://www.dailynow.co/) _developers can focus on code instead of searching for news. Get immediate access to all these posts and much more just by opening a new tab._

[![Daily promotion cover](https://cdn-images-1.medium.com/max/1024/1*7bwIhcH467BKX5Ni8XWpQg.jpeg)](https://www.dailynow.co/)
Setting the box in container to full width with CSS Grid
Tags: css, layout, grid
Published: 2019-08-21 12:46:13



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

I made fixed width box and full width box in grid container.
It was new about me and wanted to share :heart_eyes:

{% gist https://gist.github.com/SelenGora/9a44b581a55fcc1de0f4910aea772b24 %}
React em 1 Minuto!
Tags: react, javascript, tutorial, html
Published: 2019-08-21 12:35:02



[![React em 1 Minuto!](https://thepracticaldev.s3.amazonaws.com/i/w3ikap5z60f7t88upfa5.jpg)](https://www.youtube.com/watch?v=9dJYu32dK1g)

Você sabia que dá pra adicionar react em seu site já existente?

No vídeo de hoje eu vou ensinar como utilizar as bibliotecas React e ReactDOM para adicionar react a qualquer site existente e mostrar os fundamentos de um componente simples.

[➜ Link do video](https://www.youtube.com/watch?v=9dJYu32dK1g)

[➜ Participe da nossa lista de desenvolvedores](https://emersonbroga.com/e/participe/?utm_source=devto&utm_medium=post&utm_campaign=2019-08-21)
[➜ Aprenda ES6](https://amzn.to/2J4XnLg)
[➜ Veja as dicas no Instagram](https://www.instagram.com/emersonbrogadev/)
[➜ Assista nosso canal no YouTube](https://www.youtube.com/c/emersonbroga/)
[➜ Curta nossa página no Facebook](https://www.facebook.com/emersonbrogadev/)
[➜ Não perca as atualizações no Twitter](https://www.twitter.com/emersonbrogadev/)
[➜ Veja os repositórios no Github](https://www.github.com/emersonbrogadev/)

=)
Abstraction vs. Experience/Habit
Tags: discuss
Published: 2019-08-21 12:34:20

---
title: Abstraction vs. Experience/Habit
published: true
tags: discuss
---

This question is geared more towards people that have been doing IT "for a long time":

**Do you find that, as technologies abstract and simplify things, that said "simplification" negatively impacts your ability to adopt?**

Because I've been working in IT since *long* before GUIs (among other things) became common, it feels like whenever someone tells me "try this IDE" or "try this (simple) language/framework", etc., my brain trips over that simplification. It's like it's incomprehensible that I _don't_ have to write all sorts of plumbing to get a task done - that I can just include/import/etc. a library or module and then write one further line of actual code rather than dozens.
Setting up Flutter dev environment for MacOS/iOS
Tags: flutter
Published: 2019-08-21 12:26:36

Visit below for more details,

https://flutter.dev/docs/get-started/install/macos#update-your-path

#### Overview
1. Gather all required tools
1. Install Flutter SDK
1. Update path
1. Install Xcode, run the following
```bash
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
```

Run a shell, then execute ```flutter doctor``` follow listed steps on the result


##### Notes:
Launch an iOS simulator
```
open -a Simulator
```