teleren/devto huggingface dataset:
How to build a blog with Next.js 👨‍💻
Tags: nextjs, jamstack, webdev, beginners
Published: 2021-10-22 14:18:38

_This article was originally published on [my newsletter](www.tuomokankaanpaa.com/newsletter) last week. I publish previous week's newsletter here on the blog. If you want to read these as soon as they are published, [sign up](www.tuomokankaanpaa.com/newsletter) for the newsletter!_

Ahoy,

Couple of weeks ago [I wrote](https://tuomokankaanpaa.com/blog/best-vs-code-features-learning-material-ui) that I was working on a Next.js blog application and planning on making a video about it. I finally got the video done and I published it on the [Youtube channel](www.youtube.com/tuomokankaanpaa) last week.

{% youtube giHGL3ZppTQ %}

I ended up making it a two part video. In the first part, that is now published, I teach how to create a basic blog application with Next.js and in the process I will go through some basic concepts of Next.js, that are important to know especially for Next.js beginners.

The second part I am planning on publishing in the near future (maybe next week). That will be about integrating a headless CMS with the blog. So after that the blog will basically be ready to use in production.

Ok to be honest, it could use some styling before production, so I might also do another video about styling the blog and making it look a bit more nice. Let me know if this is something you would be interested in!

Design is really a part that I probably struggle the most. If I have a design ready and I only need to implement it, that's easy. But making the actual design is not my strong suit. So it will be fun to try to implement that to the application and I am sure that I will learn a ton while working on it.

## Top picks for this week 🎯

⚡ [14 Rules That Will Make You A Better Developer](https://medium.com/quick-code/14-important-rules-that-every-developer-should-follow-9839a574b59e)

⚡ [How to Improve as a Programmer?](https://medium.com/quick-code/15-tips-to-instantly-improve-as-a-programmer-9c9dde55471f)

⚡ [Github Universe (Oct 27-28)](https://www.githubuniverse.com/)

That's it for this week!

Cheers,
Tuomo
backseat coding
Tags: livecoding, javascript, opensource
Published: 2021-10-22 14:12:24

![james bond says "backseat driver"](https://media.giphy.com/media/3SQPke4cnY7TocJvFx/giphy.gif)

As mentioned on my post [a righteous PR](https://dev.to/mtfoley/a-righteous-pr-3404), I'm going to try to describe some of my perspectives over time with some issues in the [Open Sauced project](https://github.com/open-sauced/open-sauced).  

The Open Sauced project leverages a GitHub repo as a data store, which the user creates as part of onboarding. For me, the repo is `mtfoley/open-sauced-goals`. Each issue in it represents a GitHub repo that I intend to contribute to, so mine looks like this at the moment.
![goals](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k0wh42dz9dufipr097dt.png)

The data fields map like this:
- Issue title => repo full_name
- Issue description => my notes about it

The lifecycle events map like this
- Creating a goal => creating an issue
- Updating notes => editing issue description
- Removing the goal => closing the issue

This spring, @bdougieyo was doing a stream on [Twitch](https://twitch.tv/bdougieYO) dealing with issue [#955](https://github.com/open-sauced/open-sauced/issues/955) and [#833](https://github.com/open-sauced/open-sauced/issues/833). Updating notes were not working and removing a goal was not working properly. I had a [theory](https://github.com/open-sauced/open-sauced/issues/955#issuecomment-829945259) about these that there was some bug where a component that was supposed to be receiving data through a router was not getting what it needed. The `Repository` component expected the issue number value to come from the upstream router but it wasn't being supplied by the upstream `App` and `Dashboard` components.

Here's where the GIF I used about backseat driving comes into play.  Once the stream got to the point where it was time to try to fix these issues, I got pretty excited to voice my theory about the router parameters bug. When I'd attempted to fix it myself the code mostly did what I wanted, but it had broken other things locally, so I had never done a PR. With me and several others watching the stream and making suggestions in the chat, Brian got the code working, and the issues were fixed in [PR #980](https://github.com/open-sauced/open-sauced/pull/980). 

As someone who was still pretty new to all of this, it was nothing short of exhilarating to see my theory play out!
How To Create Your Online Business From Scratch? Startups and MSMEs
Tags: webdev, programming, mobile, beginners
Published: 2021-10-22 14:11:29

Several businesses from startups to MSMEs are always looking for ways to increase their sales and there is no place other than the internet to spread your roots. How? It is through website, app and software development along with best digital marketing practices. Every company from a startup to Micro, Medium, Small to Large Scale is well versed with the importance of owning an online business. 

The write up is to discuss some online business ideas along with some most important and info-rich IT development links. Stay Tuned till the last to make the best out of each detailed information. 

<b>The Draft</b>

<b>Types Of Online Business Tools</b>

A Business Website - An informative website that makes your service available to millions via a browser search. Explore <a href="https://www.vervelogic.com/blog/top-website-ideas/">business website ideas</a>. 

A Business Application - An Application is a highly responsive and feature-rich upfront for any business. An application is more dynamic and smartphone friendly than a website. Explore <a href="https://www.vervelogic.com/blog/110-mobile-app-ideas/">business application ideas</a>. 

An Ecommerce Website - E-commerce website is an online marketplace that allows buyers to shop from the comfort of their homes with virtual payments and home delivery. Explore <a href="https://www.vervelogic.com/blog/ecommerce-business-ideas/">E-commerce website ideas</a>. 
 
A Business Software - Software is customized to make remote processes easier whether the objective is management or sales. There are dedicated system and application software to serve businesses. Explore business software ideas for startups. 

<b>Digital Marketing Types</b>

<a href="https://www.vervelogic.com/search-engine-optimization.html">Search Engine Optimization</a> - The process of getting ranked on Google and other SERPs. Why is Search Engine Optimization important? 

<a href="https://www.vervelogic.com/social-media-optimization.html">Social Media Optimization</a> - Increasing your visibility on social media sites Facebook, Instagram Youtube, LinkedIn, etc. Importance of social media for business.  

PPC Marketing - One of the best online ad techniques to increase sales. Best PPC company in India.  

Content Marketing - SEO friendly content curation and keyword placement to help you rank your website on the SERPs and increase engagement. Recent content marketing trends to improve your sales in 2021 and beyond. 

<a href="https://www.vervelogic.com/blog/online-business-ideas/">Online Business Ideas</a>

There are a lot of business ideas that can successfully be turned to reality through a website or a full-fledged e-commerce portal. Know what all <a href="https://www.vervelogic.com/blog/things-to-make-and-sell-online/">businesses you can start from home</a>.  

Mentioned above is the combined information giving a direction to your online business plans, no matter at which stage your business is?

More info: <a href="https://www.vervelogic.com">vervelogic</a>
Setting up a Data Engineering Environment
Tags: database, windows, vmware, linux
Published: 2021-10-22 14:00:43


 Welcome back to our Data Engineering Series😊
 Its now time to set up our environment!

#Installing,Configuring and Setting Up VMware, MSSQL Server,Postgres and AdventureWorksDW&DB
When diving into the data engineering world, it is important for the set up  to be ready.

To set up a data engineering environment it is advisable to work on Linux Environment. 

To start with we started by using linux as a host machine.

Then we installed Virtual machine [VMware](https://www.linuxtechi.com/install-vmware-workstation-11-on-ubuntu-linux/). Then on the Vmware we installed the downloaded Windows operating system.

Now in order to make communication between host(Ubuntu) and virtual machine(Windows) we need to make configurations and networking on Vmware.You need to enable VNC connections as shown below.
### 
 ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gye98g1soddd1k182f3r.png) 
 

## Installation of MSSQL Server.
In this guide we walk you through the MSSQL Server installation in Windows on VMware.
The first step is to download SQL SERVER 2012. In this case it's the one we are using currently.
You can download it from [here](https://www.microsoft.com/en-us/download/details.aspx?id=50003) or download a later version. Then follow the instructions to install it,
then launch the SSMS(Sql Server Management Studio).The UI should be something like this:

### 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hte93cejk4ic76x8e6hi.png)


##Installation of Postgres Database on Ubuntu 20.04.
We will now install Postgres in our Ubuntu. To install this follow the installation steps [here](https://tecadmin.net/how-to-install-postgresql-in-ubuntu-20-04/).

For Postgres configuration steps: 
###To check for Postgres version 
         psql --version
###It is advisable to check if the Postgres is running using this command before you proceed
         sudo systemctl status postgresql
###Connection To PostgreSQL running.
         sudo -u postgres psql

## Installation of AdventureWorks2019 and AdventureWorksDW2019
First in order to start using the databases we start with installing Adventureworks2019 and DW.
To install follow the steps found [here](https://docs.microsoft.com/en-us/sql/samples/adventureworks-install-configure?view=sql-server-ver15&tabs=ssms). Once installed we need to configure them in MSSQL Server on a virtual machine using these steps [here](https://docs.microsoft.com/en-us/sharepoint/administration/configure-adventureworks).
After installation and configuration open SSMS and this should be the UI in SSMS:
### 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m5u2jw9luvlqhyjvf2yt.png)

Thanks and Happy Learning!

Article by 
[WanjohiChristopher](https://www.linkedin.com/in/wanjohichristopher/) 

[NicholasMusau]
(https://www.linkedin.com/in/nicholas-musau-69657186/)
Respects:[Neville Omwenga](https://www.linkedin.com/in/omwenganeville/)
Divtober Day 21: Magic
Tags: codepen, divtober, css, art
Published: 2021-10-22 13:48:03

---
title: Divtober Day 21: Magic
description: My entry for divtober day 21: magic. A magic trick with CSS and only an HTML element.
published: true
tags: codepen,divtober,css,art
series: divtober
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8qa1dv6ka8gox78y11rx.png
---

I forgot to publish this yesterday, but here it is... The word of the day was "Magic" so I coded a magic trick in CSS, with a single HTML element and no JavaScript:

{% codepen https://codepen.io/alvaromontoro/pen/zYdowmM %}

It started just with a [drawing of the magician](https://codepen.io/alvaromontoro/pen/VwzKxMB) and then I extended to look like this other [demo I created way back](https://codepen.io/alvaromontoro/pen/xagVOa).

Because it changes the value of the `content` property inside an animation, the demo will not work on Safari. Maybe I could modify it a little so instead of animating `content`, I could add some spacing and move the text around instead. 🤔
How to Install Git On Ubuntu 20.04
Tags: ubuntu, linux, tutorial, beginners
Published: 2021-10-22 13:47:50

##Introduction

Git is the world's most popular distributed version control system used by many open-source and commercial projects. It allows you to collaborate on projects with your fellow developers, keep track of your code changes, revert to previous stages, create branches, and more. Linus Torvalds (the creator of Linux) developed Git.

A version control system is a system that keeps a record of the changes in a file (or multiple files) over a period. This is so that a user may return to a previous version of the system's software whenever necessary. This article shows you how to install and configure Git in Ubuntu 20.04 LTS.

In this article, you will learn how to install and configure Git on Ubuntu 20.04 via the Command line.

###1. Prerequisites

1. The operating system running Ubuntu 20.04 Linux
2. A root or non-root user with Sudo privileges
3. Has stable internet connection
4. Terminal window / Command line

###2. Update Local Repositories

Update all system packages to the latest, Run the following command:
```
sudo apt-get upadate
sudo apt-get upgrade -y
```

###3. Install GIT

The Git utility package is available in ubuntu software sources, which can be installed by APT-GET. Run the following command:
```
sudo apt-get install git
```

###4. Check GIT Version

Verify the installation, run the following command:
```
git --version
```
That’s it, you have successfully installed Git on your Ubuntu, and you can start using it.

###5. Configure GIT
Set your global user name and email. Run the following command:
```
git config --global user.name "<YOUR NAME>"
git config --global user.email "<YOUR EMAIL ADDRESS>"
```

Thank you for reading this blog.
💡 Top 5 Cybersecurity Predictions for 2022
Tags: security, cybersecurity, devops
Published: 2021-10-22 13:35:23

#### 🔐 Security leaders will increase visibility and diversity of thought to meet consumer (and business) expectations

### <br>

From the Colonial Pipeline attack, which resulted in fuel shortages across much of the East Coast, to the devastating breach on Microsoft Exchange, it’s safe to say 2021 was a tumultuous year for cybersecurity. But what will the next year look like?

I reached out to Auth0’s leading security and privacy experts to hear their predictions for 2022, and to learn how organizations will grapple with a changing threat landscape and the ongoing pandemic.

![Predictions](https://images.ctfassets.net/23aumh6u8s0i/e8LLSbz9kUTIssTNzD33k/1c58e52ea17e0bf67b104322e8ade137/cybersecurity-prediction-sep1)
 
[Read more...](https://auth0.com/blog/top-6-cybersecurity-predictions-for-2022/?utm_source=content_synd&utm_medium=sc&utm_campaign=security)
TIL how to use Ansible-inventory for native ssh-connections
Tags: todayilearned, ansible, linux, ssh
Published: 2023-05-19 20:37:55

---
title: TIL how to use Ansible-inventory for native ssh-connections
published: true
date: 2021-10-22 13:23:00 UTC
tags: TIL,ansible,linux,ssh
canonical_url: https://www.zufallsheld.de/2021/10/22/til-how-to-use-ansible-inventory-for-native-ssh-connections/
---

Actually I did not learn this today but already some years ago. Sometimes I need to connect to remote servers that have no hosts-file or dns-entry. But I don’t want to remember IP-addresses!

Luckily I do have these servers defined in Ansible’s hosts-file and I could theoretically get the ip-address from there. However there’s an easier way: [ansible-ssh](https://github.com/selivan/ansible-ssh). This is a shell-script that combines `ansible-inventory` with ssh to allow something like this:

```
user@work$ cat hosts | grep server1
server1 ansible_host=192.168.0.1 ansible_user=root ansible_port=2222

user@work$ cat ansible.cfg | grep ssh_args
ssh_args = -C -o ControlMaster=auto -o ControlPersist=60s

user@work$ ansible-ssh server1
ssh_args: -C -o ControlMaster=auto -o ControlPersist=60s
ansible_host: 192.168.0.1
ansible_user: root
ansible_port: 2222
ansible_ssh_common_args:
result command: ssh ubuntu@192.168.0.1 -C -o ControlMaster=auto -o ControlPersist=60s -p 2222

```
[Resolução de exercícios]
Tags: javascript, webdev, beginners, braziliandevs
Published: 2021-10-22 13:13:13

Bom, para hoje irei mostrar como eu faria os exercícios que propus, no [post passado](https://dev.to/samoht/o-que-e-javascript-38b0). Tendo em mente que a programação não é algo com uma única solução, não se sintam mal caso esteja diferente da sua solução. 

<img src="https://media2.giphy.com/media/zOvBKUUEERdNm/giphy.gif?cid=ecf05e47klo9ua8nth8cgike8gzwkja6yg50y3ftw8whpk81&rid=giphy.gif&ct=g">

## Exercício 1

Nesse eu deveria criar variáveis para informações e atributos de um personagem de rpg. Então, *let's code*.

```
const nome;
let altura;
let xp;
let nivel;
let força;
let velocidade;
let inteligencia;

```

## Exercício 2

Enfim, o segundo era para procurar a diferença entre const, let e var. Essa questão eu provavelmente irei fazer um post separado sobre futuramente (_caso eu esqueça podem me cobrar que eu faço)_, me aprofundando mais no assunto.

### Mas qual a diferença?

Bem, começando pelo var (_ou variable_), é uma variável simples, porém é pouco usada devido a alguns erros que ela pode gerar.

O const (_ou constant_), é uma variável que como o nome diz é constante, ela não muda, independente da situação. Caso você tente modificar o valor de uma const, irá possivelmente retornar um erro (_com algumas excessões_).

O let é uma variável que substitui o var por assim dizer, ela aceita ser modificada, porém ela evita os erros que o var causa.

Assim sendo o let e o const as declarações mais usadas em Js.

## Exercício 3

Nesse eu pedi para você pesquisar os tipos de variáveis do Js, vou apenas listá-los, pois possivelmente irei fazer posts explicando cada um deles.

* Strings
* Numbers (integer, float, double, etc.)
* Booleans
* Arrays
* Objects
* Function (sim, variáveis podem armazenar funções também)

Futuramente irei tentar dedicar um post para cada um deles.

## Por hoje é só pessoal
 Até um outro dia, estou tentando fazer posts diários, eles são mais uma forma pra eu conseguir guardar melhor o conhecimento, mas caso você que esteja lendo tenha alguma dúvida, eu farei o possível para saná-la

>Ensinar é aprender duas vezes.
 -Joseph Roubert

<img src="https://media3.giphy.com/media/35EsMpEfGHkVoHbNTU/giphy.gif?cid=ecf05e47cwl0cm9nd17sourzqmnmlecxr7a4loo03iw0lqdq&rid=giphy.gif&ct=g">
Async Array Filter
Tags: javascript
Published: 2021-10-22 13:04:33

---
title: Async Array Filter
published: true
description: Code snippet for using async in a filter
tags: 
- JavaScript
---

```typescript
private asyncFilter = (arr, predicate) => {
  return Promise.all(arr.map(predicate))
    .then((results) => arr.filter((_v, index) => results[index]));
}
```
Use hook functions in class component: React
Tags: react, javascript, webdev, programming
Published: 2021-10-22 13:02:58

Converting the legacy class components to functional components is not an easy task if the component is dealing with complex logic.
 
There are times when we can implement custom hook functions to achieve a shared functionality like triggering the popup with a message on any component. Eg: Popup will be visible on the <App /> component. But we can't consume the hook directly in a class based component. However there's a workaround to achieve it.

![HOC with Hooks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g5pvbf3m464emf1vydx3.png)

#### Step 1:
Create a functional Higher Order Component which accepts the initialState for the hook and a react component as the param.

#### Step 2:
Import the hooks here and pass the hook functions as params to the return component.

#### Step 3:
Wrap the class component with our HOC component. Pass the initial states for the hook as params in the HOC.

#### Result:
Now we can call the hook methods from `this.props`.

##### *Comments are welcomed!*
How to start a meetup group for free?
Tags: tutorial, leadership, startup
Published: 2021-10-22 12:57:06

![How to start a meetup group for free?](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p8iz2rxihmvl16zmshjs.png)

## How much does it cost to start a Meetup group?

It’s 100% free! Anyone with an email address can register with Meetup.com and start joining groups immediately. Meetup will even suggest groups based on your interests, or you can do a search right on their platform to find groups.
And, as new groups are started based on your location and interests, Meetup will notify you in case you want to join.
Of course, as it’s pointed out above, you’ll have to pay dues in order to become a group Organizer.

## Is there a free equivalent of Meetup.com? Which I can use to start a meetup group for free?
![bylde.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/08pln5oynvigshbpvanc.png)

Currently, in the market, there are multiple alternatives of meetup. But most of them will need a lot of education in terms of how you operate them, or they have a similar subscription model.
The only platform which is truly amazing from a usability perspective and have literally £1/PCM fee is [bylde](https://www.bylde.com). You can easily migrate your group from meetup to bylde.

![local meetups](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v8zyyisaojf51asa1r8d.png)

Bylde.com Features:
* Fee: only £12 Annually.
* Integration with all social networks.
* You can charge a monthly fee to your group members to join your group.
* You can sell your event tickets for low commission fee.
* Automated marketing integrated into your event ticketing.

Learn more about it on bylde.

Native iOS and Android App for your group members.
You can read more about [Alternatives to meetup] (https://lonare.medium.com/9-alternatives-to-meetup-com-6094f5f27e18) and see 9 alternatives you could use.

## How To Create a Free Meetup Group?
To start a Meetup group for free, you need to first go to bylde.com and search for a group in your city.

If you don’t find a group in your city on bylde. Then you are at luck.

Hurry up and create a ticket with their [support department] (https://www.bylde.com/help) and tell them you would like to create the first group in your city.

Tell them what you are planning to do with that group and how you are going to promote it with your friends and family.

Bylde will then provide you with a lifetime coupon code so that you can create your group for free.

Voila…

Now if you want to know how you can make some money with your meetup group then please do comment below, and I will create a blog post for it.
DataStax Lunch & Learn: Astra DB, APAC (ANZ local time)
Tags: webdev, programming, python
Published: 2021-10-22 12:31:55

Join our experts at DataStax for a deep dive with Astra DB - our serverless NoSQL Cassandra DBaaS. Astra DB shines when you need a fast, always-on database without lots of operational overhead. It’s born of Apache Cassandra™ and simplifies cloud-native application development.

In this live session, you will learn:

-- Why you should consider Astra DB for rapid development
-- How you can reduce deployment time from weeks to minutes
-- How you can benefit from an auto-scaling database
-- Real-life examples and use cases for Astra DB
All attendees that attend the Astra demo will receive a 25$ Food Voucher. We will also have an interactive Q&A session at the end, and three lucky winners stand to win an Amazon gift voucher worth $100.

https://www.datastax.com/resources/webinar/datastax-lunch-learn-astra-db-anz?SkillUpANZ