teleren/devto huggingface dataset:
My first Hacktoberfest
Tags: hacktoberfest
Published: 2020-10-29 16:11:11



### [Hack ToberFest]
I'm Farshad, recently joined to dev community in January but actually didn't contribute much, which is sad but then Hacktoberfest came and I was excited to do something...

I have some years of experience in PHP and Golang and I was thinking about what should I in the hacktoberfest this year since it's my first time.

So, I did some checking through big and small repositories and found some small but interesting projects, made PRs and tadaaa most of them got merged. I must say it felt so good that I think I should do it from time to time.
The other good thing happened for a project of mine, I got really quality PRs which added some nice functionalities to one of my projects which is called [Wait4it](https://github.com/ph4r5h4d/wait4it).

So, looking back in October, it is a win-win. And I'm happy about it. Hope I can contribute more to the open-source community.
ARIA in CSS
Tags: a11y, aria, attributes
Published: 2020-10-28 15:37:26

---
title: ARIA in CSS
published: true
date: 2020-10-27 16:27:15 UTC
tags: accessibility,a11y,aria,attributes
canonical_url: https://adactio.com/journal/17566
---

[Sara tweeted something recently](https://twitter.com/SaraSoueidan/status/1319992242262757377) that resonated with me:

> Also, Pro Tip: Using ARIA attributes as CSS hooks ensures your component will only look (and/or function) properly if said attributes are used in the HTML, which, in turn, ensures that they will always be added (otherwise, the component will obv. be broken)

Yes! I didn’t mention it when I wrote about [accessible interactions](https://adactio.com/journal/17546) but this is my preferred way of hooking up CSS and JavaScript interactions. Here’s [old Codepen](https://codepen.io/adactio/pen/oxLNwY) where you can see it in action:

```
[aria-hidden='true'] {
  display: none;
}

```

In order for the functionality to work _for everyone_—screen reader users or not—I have to make sure that I’m toggling the value of `aria-hidden` in my JavaScript.

There’s another advantage to this technique. Generally, ARIA attributes—like `aria-hidden`—are added by JavaScript at runtime (rather than being hard-coded in the HTML). If something goes wrong with the JavaScript, the `aria-hidden` value isn’t set to “true”, which means that the CSS never kicks in. So the default state is for content to be displayed. There’s no assumption that the JavaScript has to work in order for the CSS to make sense.

It’s almost as though accessibility and progressive enhancement are connected somehow…
4 great Linux resources 
Tags: discuss
Published: 2020-10-29 16:02:02

My 4 favorite Linux resources:

🐧https://itsfoss.com/
🐧book 'How Linux works'
🐧book 'Linux pocket guide'
🐧https://wiki.archlinux.org/

🎬I made a video review about the books here: https://youtu.be/IuhP4fjgVck

What are your favorite Linux resources? 😊
Don't initialize collection multiple times with ->create(), instead cache the collection -  Magento 2
Tags: magento2advance
Published: 2020-10-29 16:00:54

I had to take category collection in two separate phtml files.
So the following method was called two times.

```
public function getSecondLevelCategories()
{
	$data = [];

	try {
		$collection = $this->categoryCollectionFactory->create();
		$collection->addAttributeToSelect('*');
		$collection->addIsActiveFilter();
		$collection->addAttributeToFilter('level', self::CATEGORY_LEVEL_2);
		$collection->addAttributeToFilter('include_in_menu', 1);
		$collection->addOrderField('position');

		foreach ($collection as $category) {
			$data[] = [
				'url' => $category->getUrl(),
				'label' => $category->getName()
			];
		}
	} catch (\Exception $e) {
		$this->_logger->error($e->getMessage());
	}
	return $data;
}
```

By using ```$collection = $this->categoryCollectionFactory->create();``` in the above method, I initialize the collection two times when the method is called in two different phtmls, which reduces the performance of the site.

Instead of the above, it is good to cache the data with get and set into a separate singleton class.

To do that, 
1 Create a Model with get and set
```
<?php
namespace Vendor\Module\Model;

class CategoryListModel
{
    /**
     * @var array
     */
    protected array $items = [];

    /**
     * Set items
     *
     * @param array $items
     */
    public function setItems(array $items): void
    {
        $this->items = $items;
    }

    /**
     * Get items
     *
     * @return array
     */
    public function getItems(): array
    {
        return $this->items;
    }
}
```

2 In the block class call call the above Modal with get/set methods.
In this, if you find items already loaded, it will be used for the second time.

```
<?php
namespace Vendor\Module\Block;
...
use Vendor\Module\Model\CategoryListModel;
...

/**
 * @var CategoryListModel
 */
private CategoryListModel $categoryListModel;

public function __construct(
...
	CategoryListModel $categoryListModel,
...
) {
...
	$this->categoryListModel = $categoryListModel;
...
}


public function getCategories()
{
	$model = $this->categoryListModel;

	if (empty($model->getItems())) {
		$model->setItems($this->getSecondLevelCategories());
	}

	return $model->getItems();
}

public function getSecondLevelCategories()
{
	$data = [];

	try {
		$collection = $this->categoryCollectionFactory->create();
		$collection->addAttributeToSelect('*');
		$collection->addIsActiveFilter();
		$collection->addAttributeToFilter('level', self::CATEGORY_LEVEL_2);
		$collection->addAttributeToFilter('include_in_menu', 1);
		$collection->addOrderField('position');

		foreach ($collection as $category) {
			$data[] = [
				'url' => $category->getUrl(),
				'label' => $category->getName()
			];
		}
	} catch (\Exception $e) {
		$this->_logger->error($e->getMessage());
	}
	return $data;
}
```
Agregar webreference en SSIS VS2015
Tags: ssis, webreference, vs2015, csharp
Published: 2020-10-29 15:49:50

En SSIS VS2015, al agregar una referencia web, dentro de un script-component, se deben usar las referencias del framework 2.0 y no reusar las existentes.

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

De esa manera se evita tener el problema que se compila correctamente el componente, pero el flujo DTS marca error 
SSIS Error: The binary code for the script is not found
Simple And Easy Introduction of CPP 
Tags: tutorial, cpp, beginners
Published: 2020-10-29 15:47:17

_Hii everyone, This is just a simple introduction of cpp language_
# _CPP introduction_ 
  ...
#### Some basic points of cpp programming language.
  * The C++ were first invented by Bjarne Stroustrup in 1979.
  * C++ is a programming language began as an expanded version of C.
  * The alternative name of cpp programming is "c with classes".
  * You can say -> this is the extension of c programming.
    * Because the inventor of cpp (Bjarne Stroustrup) introduce a object oriented concept in c language that is classes.
    * That is why c++ is also called "c with classes".
  * CPP is high level language. 
    *  High level language : you can get various definitions of high level language. but in simple or in slang words --> "the high level language is those programming languages which is near about to hardware or memory management". 
    * CPP is generally use to develop the system software and the system software needs to manages our memory in system  _that is why CPP is high level language and why we use cpp to develop the system software_ 


#####This is some point that I think everyone should know if you starting CPP or a beginner in CPP. 

_I know there is not something special in this post but if you are beginner in programming and found something new , you can give me a reaction_😁😁

************************************_Happy Coding_********************************
📰 Bypass paywalls; read your news on the terminal
Tags: go, showdev, news, elm
Published: 2020-10-29 15:08:02

Last night I built a new go tool to let me read websites on the command line. [Readcli](https://github.com/trashhalo/readcli)

```shell
readcli https://medium.com/compass-true-north/go-unit-testing-at-compass-3a7cb85ab54a
```

![](https://github.com/trashhalo/readcli/raw/master/sample.png)

## Install (on mac)

```shell
brew install trashhalo/homebrew-brews/readcli
```

## Website Content
Due to the way I am scraping website content not every url will work. I've tested it with medium.com and nytimes.com.

The algorithm is as follows:
1. Use [go-readbility](https://github.com/go-shiori/go-readability) to download a stripped down version of the website.
2. Use [html-to-markdown](https://github.com/JohannesKaufmann/html-to-markdown) to convert the clean html to markdown.
3. Use [glamour](https://github.com/charmbracelet/glamour) to render the markdown content.

## Bubbletea

The cli interaction is controlled by an elm inspired go library [bubbletea](https://github.com/charmbracelet/bubbletea). Its be a absolute dream to work with.
Easy to Git
Tags: hacktoberfest, github, git
Published: 2020-10-29 15:43:07

## What I Learned From Hacktoberfest

This was my first Hacktoberfest and I learned a lot.  I had previously tried making valuable pull requests to apply for an Outreachy internship, but struggled to know how to help on a very large project.  Recently I came across a [project](https://github.com/DavidMatthewFraser/easy-to-git) that was designed for beginners to Git and GitHub to be able to contribute to a simple project, even as a beginning coder.

The repository, {% github DavidMatthewFraser/easy-to-git no-readme %} provided a few challenges that added items to the project website, such as creating and customizing a profile card with only html and css
![Image of six of the cards produced](https://dev-to-uploads.s3.amazonaws.com/i/esgj7kixrdlcxmemkqzu.png)

or adding an animated object to a solar system page.
![Image of solar system page with space objects](https://dev-to-uploads.s3.amazonaws.com/i/yoygdwivnpcjcjkioag0.png)

I was easily able to code these challenges and began adding other changes such as adding a new color theme and a weather widget.  I was asked to be a collaborator just prior to Hacktoberfest because I was consistently making changes, so I was a new maintainer as well as a contributor.  Hacktoberfest gave the project reach so I was able to review and approve many pull requests.

I feel ready to use Git and GitHub in a team at a company, needing to learn the particular workflow of the company, but knowing the basics enough to be confident saying, "I've used Git and GitHub" on my resume.
Announcing Blindsend: Open Source End-to-End Encrypted File Transfer
Tags: javascript, privacy, scala, java
Published: 2020-10-29 15:41:00

Hi everyone, 

We are happy to announce our new open source project. Blindsend enables easy, end-to-end encrypted file transfer between two parties. 

https://github.com/blindnet-io/blindsend

We hope it will be of use to anyone looking to tackle privacy issues in their apps, reduce your system’s exposure to personal users’ data, and ensure GDPR compliance.

Feel free to use it, send us feedback, or simply star the project - we can use all the love we can get :)
Experience of my first ever Hactoberfest.
Tags: hacktoberfest, digitalocean
Published: 2020-10-29 15:00:58

@digitalocean
✨I came to know about Hacktoberfest through a seminar. Though I was hearing about this term a few weeks before the month of October started, I wasn't sure what exactly it is until I attended a particular seminar dedicated to opensource and the Hacktoberfest! 
I felt really lucky to have known about this month-long celebration program on opensource. I was really keen to participate in the challenge. I only came to know about it on October 3rd, and I registered myself then and there!
For a week, I was just roaming about here and there in the opensource world as I didn't had much knowledge on making what is known as "Pull Requests". So, I was struggling for a few days. Finally, I made my first PR on the 6th of October, but it was marked as 'ineligible'. It took me 2 days to understand what "ineligible repository" meant in Hactoberfest!
Hence I started again! By this time, it was over 10th of October, and I was giving up hope that I could gain a T-shirt. But, I believed from the initial stage that even if due to some reasons I would not make it on time, I still wouldn't give up!
From starting only, I avoided making small changes and creating PRs just for the sake of the T-shirt. I wanted to learn! I wanted to learn the correct method of making PRs and contribute towards opensource. I never wanted to do it just for a T-shirt, I wanted to do it all for myself, and my learning curve.
Hence, as time passed by, I left the hope of getting a T-shirt, as I was still struggling to make just one eligible PR. 
Since I wasn't getting much ahead, I decided to take help from the internet itself! I realized that there are many repositories in which PRs can be created easily, and they are not completely invalid also. Therefore, I started opening easy codes in my preferred programming language, and added them via PRs.
On 14th October 2020, I completed all my PRs that too in a single day, and they went into the review period. I was really happy that I was able to make it.
I have now completed the Hacktoberfest challenge, more of which, I gave to myself!
I look forward to contribute even more into this world of opensource. 
This is not the end, it's just the beginning.
 ✨
Autogenerate VHOSTS on macOS X
Published: 2020-10-29 14:52:06

Every time I wanted to activate a new virtual host on my local macOS machine for development 

I had to do the regular steps
1. create directory
2. create apache vhosts entry
3. create /etc/hosts entry

So, I have built myself a tool. 

* PHP-cli tool

* Site Directories must end in .local to be picked up

* example /path/site.local will become http://local.site 


```
define('SITES_PATH', '/Users/your-user/Sites');
define('VHOSTS_FILE', '/etc/apache2/extra/httpd-vhosts.conf');
define('HOSTS_FILE', '/etc/hosts');
```

# Usage (must be super user):

```sudo php index.php```

# PHP-Cli Output Example

![Alt text](https://i.postimg.cc/Xq4kc3hs/Screenshot-2020-10-29-at-16-41-20.png )

Find out on github:

https://github.com/crivion/autogenerate-vhosts-osx

Feel free to use as you wish.
I Made A Coding Card Game!
Tags: html, coding, games
Published: 2020-10-29 14:47:31

---
title: I Made A Coding Card Game!
published: true
description: I turned my Coding Game Idea into reality. 
tags: HTML, Coding, Games
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/k7xjbrx6uhsqj8obia12.jpg
---

# I Made a Coding Card Game!

If there are two things I love doing in this world it’s playing board games and programming. So, as a maker of things, and with the help from some very awesome people, I did the only logical thing and combined the two. Here enters (gallops? swoops?) Unicorn Ninjas.

![A herd of Unicorn Ninjas playing Unicorn Ninjas](https://dev-to-uploads.s3.amazonaws.com/i/1ieqkf2ficncmhdib5w1.png)

Over the course of a year this game has seen a lot of action out here in sunny South Korea. It visited my table to entertain friends visiting from abroad, helped teach kids at an international school in Seoul, made its way around board game design meetups, and even was put through its paces as kindergartners played it as a matching game to learn about websites. 

![Getting the hang of it!](https://dev-to-uploads.s3.amazonaws.com/i/i3u2421nhymjpuchgg1z.gif)

Unicorn Ninjas is easy to learn and unique to play. Our core goal was to make a fun game, with education coming in a close second. We didn’t want it to be too heavy, and our hope is this can be a stepping stone for anyone who wants to get a better grasp on how web pages work under the hood. 

I think that developing a working vocabulary is the first step in taking on something new. Through this game, players build their terminology by using cards like “Navbar”, “Headers and Paragraphs”, “Image or Video”, and “Button”. These are terms I use everyday as a web developer. Players also get to “build” site cards (i.e. general patterns you can see in websites) to get points and also, perhaps subconsciously, link how HTML elements are the building blocks of sites. 

![The Building Blocks](https://dev-to-uploads.s3.amazonaws.com/i/cm014pnnpncao113zjkx.gif)

This is the core premise: the more you play, the more familiar you get with using HTML terminology and experience how these pieces can be stacked together to create websites. Repetition makes remembering these HTML elements easier, and a comic booklet that comes in the game allows for easy access to realize what’s happening under the hood of your favorite websites in an accessible way. We want to make learning almost an afterthought, an invisible action that loops every time you play.

The real fun starts with bluffing cards and bugs, which you can check out here https://www.unicornninjas.net/rules/


![GG my friend!](https://dev-to-uploads.s3.amazonaws.com/i/hd2c50eov5y6t7kdiwve.gif)
^^^(His mistake was my victory XD)

If you’re interested in this thought experiment turned real, check out our [Kickstarter.](#https://www.kickstarter.com/projects/unicornninjas/unicorn-ninjas-card-game-ignite-your-coding-spirit) 

For more info, follow us on our [FB](#https://www.facebook.com/unicornninjas.official) / [IG](#http://instagram.com/unicornninjas.official) or check out our [website](#https://www.unicornninjas.net/).
Composer install error Failed to extract
Tags: php, webdev, docker, composer
Published: 2020-10-29 14:43:51

Yesterday I updated a CakePHP app as I routinely do and a strange error popup-ed in the `composer install` stage of my docker build:
```
Failed to extract wyrihaximus/twig-view: (9) unzip -qq  '/var/www/html/vendor/composer/tmp-d8e7d258ae112df88e50fadda2ad540d' -d '/var/www/html/vendor/composer/c379dd11'

unzip:  cannot find or open /var/www/html/vendor/composer/tmp-d8e7d258ae112df88e50fadda2ad540d.

    This most likely is due to a custom installer plugin not handling the returned Promise from the downloader
    See https://github.com/composer/installers/commit/5006d0c28730ade233a8f42ec31ac68fb1c5c9bb for an example fix
    Failed to extract cakephp/bake: (9) unzip -qq  '/var/www/html/vendor/composer/tmp-0ea29ff25d5dad521623339cec9bf3bb' -d '/var/www/html/vendor/composer/cc137293'
```

The same happened with `cakephp/debug_kit`, `cakephp/migrations`, `cakephp/bake` and `josegonzalez/cakephp-upload` dependencies.

After researching and testing I realized Composer had updated to version 2 a couple of days ago and in my Dockerfile I installed it with the command:
`RUN curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/bin --filename=composer`

Clearly this brought Coposer's latest version and broke some dependencies. The solution was to freeze Composer's version download to 1.x:
`RUN curl -sS https://getcomposer.org/composer-1.phar -o composer.phar`

Doing this also required me to run `php composer.phar install` instead of `composer install`.

And done, the app was good and running once again!
Create collections from API with Gridsome
Tags: vue, gridsome, node, javascript
Published: 2020-10-30 01:38:19

---
title: Create collections from API with Gridsome
published: true
date: 2020-10-29 14:38:33 UTC
tags: vuejs, gridsome, nodejs, javascript
canonical_url: https://phongduong.dev/blog/create-collections-from-api-with-gridsome/
---
Gridsome provides many source plugins that help you create collections from your source. But if you want to create collections from your API or a third-party API, you have to create collections manually. 

In `gridsome.server.js` file, you call `loadSource` method of `api` parameter. You pass a callback function which you will fetch the API and create collections from data.

Your callback has an `actions` parameter, it has `addCollection` method. You will use this method to create your collections

```javascript
const axios = require("axios")

module.exports = function(api) {
  api.loadSource(actions) => {
    const { data } = await axios.get('https://example.com/api/v1/posts')
    const postCollection = actions.addCollection("Post")
    
    for(const post of data) {
      postCollection.addNode({
        id: post.id,
        title: post.title
      })
    }
  }
};
```

After you start the server, it will create `Post` collection. To get the collection, you call `getCollection` method with the collection's name

```javascript
actions.getCollection("Post")

```
Frameworks are Powerful and Awesome and Frightening
Tags: discuss, beginners, career, webdev
Published: 2020-10-29 14:30:11

I am new to all this. I haven't worked in the industry yet, and I am only now building my first project for my final year at college. I played with Flutter a bit before and, more recently, with VueJS a little bit more.

Frameworks, for me, seem to be a double-edged sword. On one end, they make more projects feasible to individual developers and small teams. Projects are the best way to learn, and good projects enrich the industry, so that's cool. On the other end, they seriously lower the barriers to entry and make it harder to distinguish experience by looking at the end result alone. The code will always be revealing, of course, but the code is rarely looked at.

For my final-year project I am using Firebase with Quasar. This is where the fear kicked in. The combination of tools I am using made things easy; maybe even _too_ easy. 

Initially, I planned out long durations for small tasks to account for my lack of experience. However, once the work began, the time in which I learned the concepts and finished my authentication form with the accompanying services, surprised me. I thought I would need two weeks just for tutorials, let alone having something functional. I needed three days for both.

The Firebase SDK and Firestore rules did all the backend heavy-lifting, and Quasar made me laugh at myself as I looked at the elegant form that would have maybe cost me a month to build without those out-of-the-box components.

So the natural question that followed was this:

> How afraid should we - the new kids on the block - be from competition in such a hot industry that keeps lowering the barriers to entry? What is the most efficient approach for a noob web developer to stand out?


I would love to hear how my fears are unfounded and how my question is invalid. This may be one of the rare occasions where one wishes for disapproving opinions. 

So, whether you agree, have tips on how to compete, or you completely disagree; please, do share.