teleren/devto huggingface dataset:
#4 of 100DaysOfCode
Tags: 100daysofcode, react
Published: 2021-04-15 14:14:16

Fourth Day,
I got mixed feelings about today. 
Yesterday after making my second project, I started feeling like I am pretending to know everything but in reality, I know nothing.
<del> I know what the term is, just don't wanna say it .</del>😅

So, I took today's whole day for revisiting all the facts and concepts. So-called "revision".
I wasted some of my time too but I also did a remake of my yesterday's project.

My today's project : 
Github Cards app but with the help of functional components this time.

```javascript
const Card = (props) => {
  return (
    <div className="github-profile">
      <img src={props.profile.avatar_url} />
      <div className="info">
        <div className="name">{props.profile.name}</div>
        <div className="company">{props.profile.company}</div>
      </div>
    </div>
  );
};

const CardList = ({ profiles }) => {
  return profiles.map((profile) => <Card profile={profile} />);
};

const Form = (props) => {
  const fetchInput = (event) => {
    event.preventDefault();
    let inputData = document.getElementById("input_cardName");
    props.onSubmitHandler(inputData.value);
    inputData.value = "";
  };
  return (
    <form onSubmit={fetchInput}>
      <input type="text" id="input_cardName" />
      <button type="submit">Add Card</button>
    </form>
  );
};

const App = () => {
  const [currentProfiles, addProfile] = useState([]);
  const addCard = async (profileName) => {
    const resp = await axios.get(`https://api.github.com/users/${profileName}`);
    let profile = await resp.data;
    addProfile([...currentProfiles, profile]);
  };
  return (
    <div>
      <div>Github Cards Application</div>
      <Form onSubmitHandler={addCard} />
      <CardList profiles={currentProfiles} />
    </div>
  );
};

ReactDOM.render(<App />, mountNode);

```
You can try and run the code in this [playground](https://jscomplete.com/playground).

But even after that, I didn't felt satisfied. 🤷‍♂️ 
So I started learning again. 
*I'll update the post if I'll learn something wonderful today.*

**Also I'd really appreciate it if someone wanna share their experience regarding this or best practices to learn.** 🙂

Till then,
Thanks for joining me.🤗
Have a beautiful day.🌷
How to Install a Canon G2010 Printer Without a CD Driver
Published: 2021-04-15 08:35:05

There will be a problem if the printer CD that was given when we bought the computer is lost. Often the things that we consider simple are not what we want to take into account very close to where. It becomes critical when we want to use the CD for the purpose of Install Printer.

There are some situations that require us to need to reinstall the printer driver, that is, after Windows is in a new format or the driver is lost, such as accidentally in Uninstall driver.

But don't worry if the printer driver CD is lost, because in the website of the printer supplier company such as Canon, HP and so on, there is a place for us to download the Priter Driver Software according to the model we use.

If you understand exactly the steps, it will be easy to do. Below I include a Website link to download the printer driver following the Company's brand.

Click Here: <a href="https://ijstartcanon.net/" target="_blank">IJ Start Canon</a> link

I will show you how to download one by one. Please pay close attention to be able to understand what I am conveying.

Step 1. Click on the Link I placed above. Will be displayed as in the picture below.

In this field, you enter the type of Windows that you use in your Computer, If windows 10, you enter Windows 10. Type you select Driver, Language can choose BM or BI.
And Lastly Enter Your Printer Capital Type.

Step 2. Let me show you an example of a Printer Driver search for the Pixma G2010 Model.

Once the Model you have selected appears like the picture above. You need to Scroll down to find the Download Link for the printer driver.

Click On G2010 Series Full Driver & Software Package

Then Click on Download Botten in Red above. The Download Process will Start automatically

After completing the Download Process. You click on the file and select Show in Faldor

You will continue to be taken to the File Download Folder

Once you have the Printer Driver File that you have downloaded earlier, it is time to process the installation of the driver into your computer system.

Here are some easy steps.

Steps to Install Pixma Printer Driver 2010.

Step 1.

(This is Important) Before that, make sure your Printer Connection to the Computer has been done. And your printer is on. The USB cable is already connected from the printer to your Computer or Laptop.

Double Click on the File that you have downloaded earlier.

 Click On Start Setup and Follow the Next instructions

Just follow the simple instructions until Finish. And the printer can already be used.

Ok this is my partnership. May it be useful to you.
DISCUSS: If there's one CSS feature you could add, what would it be?
Tags: discuss, watercooler, css
Published: 2021-04-15 14:08:16

---
series: "Thalita's weekly discussions"
---

CSS has gone a very long way from being a simple stylesheet to something more dynamic. Think of calc() and CSS variables. They haven't turned CSS into a programming language, but they sure are helpful!

But there's still a lot that could be added to CSS! Now, imagine you were a wizard who possesses the entire W3 team and whoever works on our browsers... 🧙‍♂️✨

# ✍ Comment below answering the following question

If there was one **CSS feature** you could add that gets **instantly supported** by all major browsers, what would it be?

This can be a new feature or something that's already in W3 but isn't supported yet. It also doesn't have to be a property, you can think about functions as well. The possibilities are endless!

---

![Thalita logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sa0hfs0886uf0g7c0b7e.png)

[Twitter](https://twitter.com/thalitadev) | [Website](https://thalita.dev)
Wildcard - a feedback please
Tags: devops, kubernetes, docker, testing
Published: 2021-04-15 13:50:10

Hi everybody!

I am co-founder at Wildcard, a devtool startup.

Our goal is to improve the UX for developers concerning the deliver of Cloud Native apps by making simple the CI/CD configuration.

We have launched our product since last march and we need of user feedbacks.

Can you please try our product and give us feedback (we have a slack and a crisp bot)?


Thank you very much for your help!

Sylvain
I Made $8280 in March 2021
Tags: freelancing, contracting, webdev
Published: 2021-04-15 13:43:46

---
canonical_url: https://kodeblok.com/posts/i-made-8280-in-march-2021
---

As always, I'm a tad bit late with this month's update.

As predicted in the previous income report, March was a record-breaking month.

I've earned $8280 working for two clients six-ish days a week. I've got a couple of people reaching out to me if I'm available for work but I had to decline them because I'm busy as it is.

I'll change up the format a little bit.

In previous updates, I'd try to break down everything I did for my clients but I've noticed that those sections are pretty thin so I'll replace them with tables that look like this.

| Clients   | Invoiced | Hours Worked (approx.) |
|-----------|----------|------------------------|
| Client #1 | $4800    | 112                    |
| Client #2 | $3480    | 58                     |
| **Total** | **$8280**| **170**                |

## What Happened to Get Django Saas?

If you've followed my income reports so far, you'd know I work on my product that is a Django/Vue Saas Boilerplate since I've built a few Saas products in this stack.

Well, I've put it on a pause right now. 

The combination of always working for clients and COVID restrictions is not playing nice with my motivation. Most days last month I'd wake up at 12, work till 9 and then go to sleep while watching One Piece (I'm on Wano arc so I'm almost done yay).

Luckily I didn't presell the product so there isn't any damage if I don't work on it again except for hours I've already sunk into it.

If nothing I've got a semi-functional codebase starter for my next project

## Expenses

These are difficult to track so I'll approximate it and try to keep it tighter the next month. 

| Expense     | Amount  |
|-------------|---------|
| Taxes       | $1000   |
| Investments | $1200   |
| Software    | $50     |
| New mic     | $50     |
| **Total**   |**$2300**|

## Conclusion

For April, I predict lower gross income at around $7k probably due to Ramadan and me not being able to put in as much energy as in other months.

In total, I've made **$8280** in gross revenue. If we take out **$2300** of expenses, I'm left out with **$5980** of profit.

I'm really rushing to put this thing out there so I apologize if it's not as detailed as previous updates.

I'd love it if you could give some feedback on this series. I'm always available on Twitter **([@triforceOP](https://twitter.com/triforceOP))** so you're more than welcome to send me a DM.

Until next month.

Adem Hodzic
Amazon FSx for Windows File Serverで隠し共有フォルダを作る
Tags: aws, windows, fileshare
Published: 2021-04-15 13:30:21

Windowsのファイルサーバーで隠し共有フォルダを作ることは簡単だ。Amazon FSx for Windows File Serverでもできないわけがない。うん。
でもまだしたことがなかったので、一応試してみた。

<br>
まずAWS管理コンソールから、FSxファイルシステムのDNS名を確認する。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gxi110s5kh3br2jafc4x.png)

<br>
そして同じADに所属しているWindows Serverから`fsmgmt.msc`を起動する。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vrr7qn8a9i6zl6ek4ex7.png)

<br>
「操作」→「別のコンピューター」を選んで、FSxファイルシステムのDNSの名を入力する。

ちゃんと権限を持っているユーザーであれば、接続して現在の共有フォルダの一覧を確認できる。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3nvopcl4rrps0owk04hy.png)

<br>
次に、共有フォルダ用のファイルを格納するための物理フォルダを新たに確保するとしよう。`secret`と名付けたフォルダを`D:\`直下に作る。
これは、普通に`\\FSxのDNS名\D$`でD:\のウィンドウを開き、その下に新規フォルダを作れば良い（もちろんコマンドプロンプトかPowerShellで、フルパスを指定してmkdirかNew-Itemしても良い）。

前から使っていた`share`と`share2`に加えて`secret`を作った。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qmsm7erkrcxtmjnmfw8e.png)

<br>
ではfsmgmt.mscに戻って、メニューから「操作」→「新しい共有」を選ぶ。

共有フォルダ作成のウィザードの2ページ目で、さきほど新たに作成した`D:\secret`フォルダを指定する

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jpavmbe0x1t1ns6gizpj.png) 

<br>
次のページで、共有名の最後に「$」をつける。隠しフォルダにするためにこれが必ず必要。今回は無難に`secret$`と名付けた。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ftqsx0qc93yrfdbskeqx.png)
 
<br>
アクセス許可を適切に設定して、完了すればOK。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o8vcekpuw30vgo2pg3jl.png)

<br>
アクセス権限がある場合でも、普段はDNS名だけでアクセスすると一覧が表示されてしまう共有フォルダが、隠し仕様だと表示されない。明示的に共有名を知っていてパスをアクセスした場合のみアクセスできる。

secret$は表示されない。。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yzxocag73p3e3gdk6gbn.png)

<br>
でも直パスでアクセスすると、ちゃんと使える。
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/alwree43enhtf0hfgh8i.png)
 
<br>
ちなみに、共有フォルダの「共有のアクセス許可」と「セキュリティ」両方の設定で許可されていなければ、ユーザーはアクセスできないので注意。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/trs3rw3qpo9dh7b9qgz5.png)

やはりFSx for Windows File Serverでも問題なく隠し共有フォルダを作成して利用できた。
¿ Cómo instalar Neovim en Linux ?
Tags: neovim, help, spanish, tutorial
Published: 2021-04-15 13:25:44

Ayudando a los amigos de Linux por el pedido de muchos y la ayuda de algunos amigos a los cuales les agradezco por ayudar a este post *Gracias a: [Jheyson Saavedra](https://github.com/jheysonsaav) y a _Matute_ que me ayudó con los comandos ❤👌😎

# 1.-Instalación de NeoVim en Linux

Primero vamos a instalar con los package managers integrados en Linux a continuación los Comandos:

#### Distros basadas en Debian

```
sudo apt install neovim
```

#### Fedora

```
sudo dnf install neovim
```

#### Distros basadas en Arch

```
sudo pacman -Sy neovim
```

#### NixOS

```
sudo nix-env -Ai nixos.neovim
```
#### Void Linux

```
sudo xbps-install -Sy neovim
```

#### Snap

```
sudo snap install neovim
```

Listo ahora tenemos instalado NeoVim dependiendo de tu distro si el comando no se encuentra aquí con mucho gusto escríbelo en los comentarios 😎

#  2.-Instalación del Package manager

Ahora procedemos a instalar el package manager más famoso y maduro llamado [Vim Plug](https://github.com/junegunn/vim-plug) una vez llegado a ese sitio corremos el siguiente comando en bash:

#### Linux, Unix

```
sh -c 'curl -fLo "${XDG_DATA_HOME:-$HOME/.local/share}"/nvim/site/autoload/plug.vim --create-dirs \
       https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim'
```

#### Linux Flatpak
```
curl -fLo ~/.var/app/io.neovim.nvim/data/nvim/site/autoload/plug.vim \
    https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
```

Una vez terminado el comando proseguimos con la instalación de git.

# 3.-Instalación de Git

**PODEMOS OMITIR ESTE PASO SI YA TIENES INSTALADO GIT** lo puedes comprobar con:

```
git --version
```

Ya que existen varias distribuciones de Linux te dejaré el link con todos los comandos sacados del libro de Git [Link a los comandos aquí](https://git-scm.com/download/linux) debes anteponer *sudo* para poder instalar.

# 4.- Configurar el Editor

Para poder configurar Neovim necesitamos crear o entrar a esta carpeta:

```
$HOME/.config/nvim
```

Una vez allí puedes crear tu *init.vim* o clonar el repositorio mio para tener mis configuraciones a continuación el link a la configuración y como clonarlo en el siguiente paso.

# 5.- Clonar mi configuración OPCIONAL

Para poder clonar mi configuración necesitas estos requisitos

1.- Tener instalado node para descargarlo [aquí](https://nodejs.org/en/) 

Luego de esto nos movemos en la terminal *cd DIRECTORIO_DE_CONFIGURACION* ahora podemos seguir clonando mi configuración con el siguiente comando:
 
```
git clone https://github.com/TeoDev1611/NeoVim-Config.git .
```

Y listo ahora solo necesitas correr *:PlugInstall* y listo tendrías instalado Neovim.

# Agradecimientos 

Gracias por ver este artículo hasta el final cualquier cosa que quieras agregar los comentarios
What do you think it means to be a Senior Developer?
Tags: discuss, javascript
Published: 2021-04-15 13:19:21

---
title: What do you think it means to be a Senior Developer?
published: true
description: Let's discuss what people's interpretation of a senior developer is.
tags: discuss,javascript
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3yo3yzjugsmea65og96l.jpg
---

Let's discuss what people's interpretation of a senior developer is.
100 more underline/overlay animations | The upgraded CSS collection 🥇🥈🥉
Tags: css, webdev, beginners, codepen
Published: 2021-04-15 13:18:03

Ready for the 3rd round? let's go!

As usual: No SVG, No JS, No extra tag, No pseudo element, No keyframes. Only one element and transitions.

----

## Table of content

* [The Curved](#the-curved)
* [The Irregular](#the-irregular)
* [The Unexpected III](#the-unexpected-iii)
* [The Zig Zag](#the-zig-zag)
* [The Double III](#the-double-iii)
* [The Arrow](#the-arrow)
* [The Circular](#the-circular)
* [The All Sides II](#the-all-sides-ii)
* [The Fancy III](#the-fancy-iii)
* [The Inverted III](#the-inverted-iii)
* [The Buggy](#the-buggy)
* [The Morphing II](#the-morphing-ii)
* [The Broken](#the-broken)
* [The Arcade](#the-arcade)

---

### The Curved

{% codepen https://codepen.io/t_afif/pen/poRKgaP %}

### The Irregular

{% codepen https://codepen.io/t_afif/pen/OJWEMvV %}

### The Unexpected III

{% codepen https://codepen.io/t_afif/pen/xxgzZja %}

### The Zig Zag

{% codepen https://codepen.io/t_afif/pen/vYgrLrq %}

### The Double III

{% codepen https://codepen.io/t_afif/pen/QWdxyVd %}

### The Arrow

{% codepen https://codepen.io/t_afif/pen/ZELRQqv %}

### The Circular

{% codepen https://codepen.io/t_afif/pen/LYxrGXq %}

### The All Sides II

{% codepen https://codepen.io/t_afif/pen/zYNaryL %}

### The Fancy III

{% codepen https://codepen.io/t_afif/pen/YzNvwBm %}

### The Inverted III

The below doesn't work on Firefox due to a [known bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1571244)

{% codepen https://codepen.io/t_afif/pen/mdRKVgy %}

### The Buggy

I don't know what happened with the below ones. There is no underline/overlay, they are simply buggy ...

{% codepen https://codepen.io/t_afif/pen/vYgrLoY %}

### The Morphing II

{% codepen https://codepen.io/t_afif/pen/LYxrNPo %}

### The Broken

{% codepen https://codepen.io/t_afif/pen/yLgEONK %}

### The Arcade

{% codepen https://codepen.io/t_afif/pen/vYgrGLO %}

----

### That's it

You are probably wondering until where I can go with such collections? All depend on your reactions ❤️🦄!

{% post https://dev.to/afif/i-made-100-more-css-loaders-for-your-next-project-4ioa %}
Looking for Unity devs to collaborate on 5th Dimension
Tags: unity3d, music
Published: 2021-04-15 13:15:04

hi everyone,

We're a VR tech developer and content studio based in London and we've recently partnered with Twitch to create 5th Dimension, a space for creation of live music events in VR presented with a range of high profile DJs, record labels and music culture brands.

website here -

www.5thdimensionxr.com

We're looking for 2 unity developers to collaborate on this project, one focussed on UX / UI / front end and another on core app dev. Our existing team has some super talented people involved, however we are a small indie operation, total team size 12 ppl including biz dev / sales.

The roles will be remunerated with a mix of cash and equity in the company and will enable the ppl we work with to have a defining role in decision making around product development. We're ultimately looking for ppl who are just as passionate about the rapidly emerging live VR / CG music event space as we are and who will join our team long term.

While the cash competent of remuneration for these roles is low we are working on an investment / funding round atm and when the round closes (4 - 6 months) we'll happily redefine the cash component of the role.

If you're passionate about developing immersive tech to redefine live music and want in at the ground level of a fast moving startup that's just starting to scale pls email me: sam@vrjlive.com
Leading Mobile App Development Company | Web 3.0 India
Published: 2021-04-15 13:10:04

Leading Mobile App Development Company
Web 3.0 India is where digital experts thrive by helping the most admired companies globally with mobile applications that matter. We craft digital products that solve small and big business needs and drive market differentiation.

Our mobile app development team can fulfill all diverse business requirements with their high-experience & latest technology adapting skills. Many companies work with us to enlarge their app development teams & API integrations.
The Surprising Technicians’ Lack o’ Knowledge
Tags: education, culture, career
Published: 2021-04-15 13:09:50

[adt]: http://foldoc.org/algebraic+data+type
[ted]: https://www.ted.com/
[teded]: https://ed.ted.com/
[tedx]: https://www.ted.com/about/programs-initiatives/tedx-program

Original post in [ℳontegasppα’s Thoughts](https://montegasppa.cacilhas.info/2021/04/lack-o-knownledge.html)

-----

I’ve been really astonished by an unexpected fact: Computer technicians are afraid of knowledge. 😱

I’m telling you something happened with my team with no fear of diminishing anyone, ’cause the behaviour I’m describing isn’t an isolated case, but common to many technicians, if not to most of us.

I brought to my team <abbr title="I’m looking for that paper now, but I can’t found it. 😞">a paper</abbr> about [algebraic data types][adt] that was relevant to a project we was designing. The team reactions were since unbelief and repudiation to pure **horror**.

And it was nothing but a trivial academic paper on Technology!!

Thenceforth I’ve been paying attention to how technicians learn, and I discovered a very annoying reallity: technicians have learned from **professional panelists**[¹](#panelist) and **programming gurudons** instead of from formal education; they use tech-communities as information source instead of a place for sharing it. 😲

So the academic slang sounds alien for most of software developers.

This week I was debating with an external asset, and he was defending a plausable approach, but high-costed. I argued that approach, though plausable, aggregates not enough value to justify the associated cost.

So he told me: “*We technicians* have always done that way, so it’s the right way.” But **I’m a technician too!** 😤

That was my answer: that argument works for non-technicians; for me, he needed to present a well-grounded technical explanation. And he wasn’t able to do that.

That’s the same problem: an unaware technician trying to trick others to fake knownledge. Unfortunately it’s the standard.

I’m here **begging you** to get out of panelists and gurudons, and rather inform yourselves from proper sources; use communities to share your experience, not in search of education.

If you wanna watch some good tech videos, refer to academic ones, [TED][ted], [TEDEd][teded], and [TEDx][tedx], **not** stage developers and showman speakers.

Please…

-----

<span id="panelist" style="font-size: small;">¹I’m using the word *panelist* as pejorative for “stage speaker”.</span>
I made a VS Code theme!
Tags: vscode, javascript, hydroxy, html
Published: 2021-04-15 08:32:04

### I always wanted to have my own theme for my favorite code editor, Visual Studio Code, so I made one!

# Meet [Hydroxy](https://marketplace.visualstudio.com/items?itemName=VirejDasani.hydroxy)

- It is a dark theme with an awesome color scheme
- It comes in two flavors to match your taste!

![Hydroxy Screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yk5jywjuh85wqe3ypcr0.png)

> Hydroxy Original (above)

![Hydroxy Screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/adkhm3rov2qdxdmxb35p.png)

> Hydroxy Alt Colors (above)

###- Hydroxy is available to download on the [Visual Studio marketplace](https://marketplace.visualstudio.com/items?itemName=VirejDasani.hydroxy) or directly from the extensions tab inside VS Code.
You can also check out [Hydroxy on GitHub](https://github.com/virejdasani/HydroxyTheme)

### Here's how I made it
- I found [this](https://www.youtube.com/watch?v=QCqWzb-9Sy8) YouTube video. It pretty much shows you step by step how you can make your own VS Code theme!

A rating on the [Visual Studio marketplace](https://marketplace.visualstudio.com/items?itemName=VirejDasani.hydroxy), a star on the [GitHub repo](https://github.com/virejdasani/HydroxyTheme) and any feedback is highly appreciated!

- Check out some of my other projects and follow my socials from [my website](https://virejdasani.github.io/virej/)!
Protect class from disallowing changes to values outside in C#
Tags: csharp, dotnet, oop, class
Published: 2021-04-15 13:02:30

The nature of OOP is to make program which are organized better into classes rather than functional programming. One of them is the class protection from disallowing any changes to values outside, once they are set. When writing code in OOP, it's significant to preserve its integrity.

The following is a small sample in C#:

### Demo

```csharp
public class Student
{
   public string FirstName { get; set; }
   public string LastName { get; set; }
}
```
Fair enough :)

### Production

The above code should be:

```csharp
public class Student
{
   public Student(string firstName, string lastName)
   {
      this.FirstName = firstName;
      this.LastName = lastName;
   }
   public readonly string FirstName;
   public readonly string LastName;
}
```

This disallows any changes to FirstName and LastName outside. 

Hope you enjoy this post.

Happy coding :)