teleren/devto huggingface dataset:
Running CSS Animations Once Per Session
Tags: javascript, css, webdev
Published: 2020-07-18 22:35:53

I was working on some intro animations the other day for my site and had an idea to have a user land on the homepage, and the word “hello” would slide in from the left greeting them.

The animation bit was reasonably straightforward, I used CSS animations to translate the text’s X value from -100% to zero. When testing the animation, I got what I wanted; the text now slid in from the left. 

```css
@keyframes slideInFromLeft {
	0% {
		transform: translateX(-100%);
	}

	100% {
		transform: translateX(0);
	}
}
```

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

There was a problem though, every time I refreshed the page, the animation would replay, this got pretty annoying when navigating through the site and returning home. So I decided to use some JavaScript and the Window's session-storage property to solve my problem.

For those who may be unfamiliar with the session-storage property: think of it like local-storage. With local-storage, we can store data that won't expire. The difference with session-storage is that the data expires after the window or browser tab is closed.

I started with an if statement that read something like “If a property called animated within the session-storage property is equal to null, run the following code”  

```js
if (window.sessionStorage.getItem(‘animated’) === null) {} 
```
Within that if statement code block, I targeted the text that would be animating, added the “animate” class to it, which contained the CSS animation rule, and then set the animated property within session-storage to 1. 
```js
if (window.sessionStorage.getItem(‘animated’) === null) { 
	document.getElementById(‘my-text’).classList.add(‘animate’);
	window.sessionStorage.setItem(‘animated’ ,1);
} 
```
And now, the animation only fires once per session. A quick and easy way to ensure we don’t annoy our users with our fancy animations.
contributed code to the 2020 GitHub Archive Program
Tags: github, code, opensource, floss
Published: 2020-07-18 22:21:41

---
title: contributed code to the 2020 GitHub Archive Program
published: true
description: contributed code to the 2020 GitHub Archive Program
tags:
- github
- code
- opensource
- oss
- floss
//cover_image: https://direct_url_to_image.jpg
---

i'm happy to know that I have contributed code to the 2020 GitHub Archive Program.

![Github popup notification saying I have a new badge bc I contributed code to the 2020 Github Archive Program](https://dev-to-uploads.s3.amazonaws.com/i/y8aac6z9zbicfcoyvsv3.png)

![Another Github popup notification saying some repos I contributed like: backbone-fundamentals, spyder and python Brazil repos](https://dev-to-uploads.s3.amazonaws.com/i/64rj2o8w8sqibvig2q4p.png)

Follow me on [Github](https://github.com/jfunez)
Little drops on C# Interview questions- Value Types x Reference Types
Tags: beginners, csharp, dotnet, career
Published: 2020-07-18 21:40:34

Little drops on C# Interview Questions series
The intention behind this series is to answer with a little bit of context or examples of some of most commons C# interview questions.
## Types on .NET
The values on C# are treated in two different types, value types or reference types.
## Value types
On value types, the data is stored within its memory allocation on the stack(More on this on the first post of the series). This means that if you assign this to another variable the value is copied and both will work independently.


Some examples of value types are basically primitive types, structures, or enums.

## Reference types
On the other hand, reference types held only a pointer to another memory location that holds the data.
Reference types are stored on the Heap which means that the value is available at runtime so when you copy a reference type it only creates another variable which knows the memory address of the actual data allowing it to be targeted by the Garbage collector(more on this later)

## Disclaimer
Some Value types can be boxed, or written on top level new C# syntax, this will make value types be stored on Heap. Some more info on this you can find on this amazing video by Nick Chapsas - 
https://www.youtube.com/watch?v=jONSIhMST9E&t=185s, also on my next learning post will talk more about boxing and unboxing operations


Some examples of reference types can be arrays, objects, classes.
## Wrapping up
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/zhygi4lom0wjx77hivn3.gif)
Value types are passed by copy and reference types are by? Duh reference. It's like when I copy a value type I'll have two variables holding ice creams and reference types its one ice cream but two variables know where the ice cream is.
State Management in React: When to Use What
Tags: redux, react
Published: 2020-07-18 20:10:45

When working on a React application, there are a few options we have for managing its state. The three that are most commonly discussed are:

> Composition
> Context
> Redux

All three seem to be developed out of comparable schools of thought when passing data. They can all be applied in some way to the scenario of needing to share data that must be considered “global” for a tree of React components that require it - such as the current authenticated user, a site's theme, or a language preference. 

There also seems to be a bit of a [performance discrepancy](https://stackoverflow.com/questions/57841048/is-there-a-performance-benefit-on-using-context-api-vs-redux) between Redux and Context when scaling an application.

This begs the question, in what condition of my application will using _____ state management aid me best?

## Composition 
*( most simple )*

Composition is a practice in React [when a more specific component renders a more generic one](https://reactjs.org/docs/composition-vs-inheritance.html#specialization) and configures it with props. It's great for smaller applications, particularly when you want to avoid passing a select few props through many levels. It gives you an acceptable amount of flexibility to customize a component.

**Good use case**
It's best contained to a select few components - a larger practice of it throughout an app can start becoming messy to keep track of.

## Context 
*( simple )*

Best for relatively simple apps where there are a few pages at most, as it was originally made for higher read operations than write operations as well as to avoid the problems that come with [prop drilling](https://kentcdodds.com/blog/prop-drilling). 

**Good use case**
A classic example is needing to change a theme or when some data needs to be accessible by *many* components at differently nested levels. Apply it sparingly because it makes component reuse more difficult. It also forces a reload of the page, whereas our next option won’t do that.


## Redux 
*( least simple )*

Redux is definitely building a huge fanbase, but if you assess the complexity of your application and using one of the previous two methods (or anything else) handles your state adequately and cleanly, then Redux can seem excessive.

**Good use case**
Ideal for more complex apps, or if you’re planning on scaling your application in the future. Its powerful global state management abilities handles data coming from multiple endpoints, allowing you to influence a single component/view.

### Closing Thoughts

Hopefully the state management of whatever React application you are building can configure into one of these categories. They each have their own ways of handling state, but a similar philosophy of "threading the data" through to whomever needs it.
Perhaps I Should Start a RaaS Platform (Reference as a Service)
Tags: recruiting, references
Published: 2020-07-18 21:16:46

---
title: Perhaps I Should Start a RaaS Platform (Reference as a Service)
published: true
description: 
tags: ["recruiting", "references"]
//cover_image: https://direct_url_to_image.jpg
---

Tired of losing references because they're being EXPONENTIALLY more exposed by PREEMPTIVE REFERENCE CHECKS, and asked to do CRAZY THINGS like FILL OUT ONLINE FORMS OR WORD DOCS, or called by STAFFING AGENCY ACCOUNT MANAGERS who care more about SELLING than ACTUALLY CHECKING your bona fides?

Try REFBOT, and spare the professionals you actually depend on!

### PRICING

#### CANCEL AT ANY TIME

### STARTER
Monthly: $20
Annual: $100
+ 10 reference checks/month (includes preemptive checks BEFORE YOU'RE EVEN SCHEDULED FOR AN INTERVIEW, and listening to staffing firm account managers' sales pitches)

#### RECOMMENDED OPTION
### PREMIUM
Monthly: $40
Annual: $180 (TOP SAVINGS!!!)
+ 30 reference checks/month
+ EVERYTHING INCLUDED IN STARTER
+ Answering emails, filling out Word docs or online forms (when ref checkers think calling is too hard on them and not burdensome enough on references)
Learn JavaScript the fun way: by fixing one-line functions!
Tags: challenge, javascript, html, css
Published: 2020-07-18 20:55:49

#Here's an easy example
Change one thing to fix it. Answer is at the bottom of this post.
```
function sum(a, b) {
  return a  b;
}
```

##There's 100s more of these!
- Easy, normal and hard difficulties
- Fix JavaScript, HTML and CSS
- You're guaranteed to learn new syntax, concepts, selectors and elements

##[Play 'Fix a function!' today and make it a daily habit](http://freecodegame.com)

Answer: `return a + b;`
How do you deal with internationalization?
Tags: help, discuss, javascript, i18n
Published: 2020-07-18 20:42:41

Hello there. In my case I'm trying to validate international phone numbers. I found a JavaScript plugin [here](https://github.com/jackocnr/intl-tel-input) but I would like to know what the community uses for this particular situation or in cases like language translation, time, currencies, etc.
Rails: Minitest results output in TAP-format for Heroku CI
Tags: rails, testing, heroku, tap
Published: 2020-07-18 20:31:38

When using [Heroku CI](https://devcenter.heroku.com/articles/heroku-ci) for automatic testing, the default output is just pass or fail without any parsing of how many tests passed or what errors where found.

This can be improved if you output the results in the [Test Anything Protocol-format (TAP-format)](https://testanything.org) according to [Heroku](https://devcenter.heroku.com/articles/testpack-api#output).

This format is not built into the test frameworks used in Ruby on Rails. Therefore I had to write my own test reporter.

I chose to implement this for Minitest and decided to use the gem 
[`minitest-reporters`](https://github.com/kern/minitest-reporters).

# Expected outcome
I have a small project where the test suit looks like this:
![Output of test results without formatting](https://dev-to-uploads.s3.amazonaws.com/i/h45ugpmogej1rghoiyvx.png)

To adhere to the TAP-format I need it to also output:
```sh
TAP version 13
1..7
ok 1 - AccountsControllerTest - test_renders_users_account
ok 2 - AccountsControllerTest - test_require_login
ok 3 - CallbacksMessagesControllerTest - test_handle_status_callback
ok 4 - MessagesControllerTest - test_should_create_message
ok 5 - ContactsControllerTest - test_should_create_contact
ok 6 - ContactsControllerTest - test_should_update_contact
ok 7 - ContactsControllerTest - test_show_contact
```


# Solution
I created a custom reporter called `TapReporter` by inspecting a standard reporter from the `minitest-reporters` gem called `ProgressReporter` ([see source](https://github.com/kern/minitest-reporters/blob/master/lib/minitest/reporters/progress_reporter.rb)):

{% gist https://gist.github.com/davidwessman/09a13840a8a80080e3842ac3051714c7 %}

![Output of test results with TAP-formatting](https://dev-to-uploads.s3.amazonaws.com/i/shx6xdze5btcjk4ds0t9.png)
# The solution on Heroku

### A failing test

![A failing test on Heroku](https://dev-to-uploads.s3.amazonaws.com/i/vtim1fgwo41i3egwa7ap.png)

### Successful tests

![Successful tests on Heroku](https://dev-to-uploads.s3.amazonaws.com/i/tmjcrjjwllbm8iisbset.png)

# Keywords 

- [Ruby on Rails](https://testanything.org).
- [Heroku](https://dashboard.heroku.com) - Platform as a Service, useful for hosting web applications.
- [Continuous integration (CI)](https://codeship.com/continuous-integration-essentials) - in this post it mostly refers to automated testing.
- [Test anything protocol(TAP)](https://testanything.org) - a protocol for test results.
- [Minitest](https://testanything.org) - a test framework for ruby.
As reformas necessárias para a PSF
Tags: python, opensource
Published: 2020-07-18 20:24:31

*Esse post é a tradução livre para o Português do post "La reformas necesarias para la PSF", da [Katia Lira](https://twitter.com/lakatialira), direcionado a comunidade da América Latina, disponível nesse link [aqui](https://dev.to/lakatialira/la-reformas-necesarias-para-la-psf-1hk).*



Revendo a discussão em torno da reforma eleitoral da PSF, notei novamente a falta de vozes latinas. Precisamos nos envolver nessa conversa, se queremos aumentar nossas chances de sermos representados no conselho de diretores.


Agora é o momento de nos informar sobre a situação atual para contribuir com nosso ponto de vista como comunidade, participar e aumentar o impacto que temos.


Minha opinião é que devemos postar algo em que concordamos juntos.

**A curto prazo**
* Limitar os votos ao número X de vagas abertas.
* Alterar os textos, trocar o "Select all candidates you think are acceptable" (Selecione todos os candidatos que você considera aceitáveis) e dizer "Select the top X candidates to be the next board members" (Selecione os X principais candidatos a serem os próximos membros do Conselho).
* A PSF dará recursos (não necessariamente dinheiro) para obter mais eleitores diversos.
* Traduzir informações da PSF e das votações

**A longo prazo**
* Eleger regiões. Podemos usar a [divisão regional da ONU](https://unstats.un.org/sdgs/report/2019/regional-groups/) como base
* Dessas regiões selecionadas, são concedidos assentos para seus representantes.
    - Seu voto será para as pessoas dessa região.
    - Para ser elegível, o trabalho nessa região ou comunidade deve ser verificável sem necessariamente ser o seu local de residência.
* Se o papel de embaixador for criado, eles deverão ter o poder de votar nas reuniões do conselho ou, pelo menos, de apresentar moções (1).
* Limitar a capacidade de inscrição se já houver um número X de pessoas da mesma região no Conselho de Diretores.

(1) O papel de embaixador de participar de reuniões, mas não poder votar, não gera mudanças no conselho de diretores. Podemos ter esses papéis, mas não para resolver esta situação.



**Meu objetivo pessoal para a próxima eleição**
* Conseguir 20 eleitores ativos para a próxima eleição em 10 meses. Por quê? Esse número teria garantido pelo menos dois assentos para candidatos latinos.

O documento em 24 de Julho para de receber comentários. Podemos trabalhar nessa solicitação até terça-feira 21 de Julho e todos os envolvidos postam uma versão do contrato na discussão do PSF.

Vamos trabalhar nesses pontos, esta é simplesmente minha opinião resumindo os comentários feitos também no documento:  https://discuss.python.org/t/psf-board-election-reform/4527/33
How to Introduce yourself
Tags: career, software, interview, tips
Published: 2020-07-18 20:05:16

As a Software engineer, learning how to introduce yourself and communicating what you do clearly can make a lot of difference in your career.

If you ever need to talk about yourself via DM or email, here are some tips I discovered:


## ✅ Talk about your success

Share your experience or background, and what you've achieved recently that you're proud of. Add links or references to back up your claim 🔗

- "I have been developing..."
- "My background is ..."
- "I specialize in..."

These are good ways to start.


## ✅ Talk about your strengths

Even though you might have experience with a lot of tools or technologies, it's important to point out areas you really excel 🌟🌟🌟

- "My strength is..."
- "Over the years, I realized that my real strength is..."

These are good ways to start.


## ✅ Tie it all together

Meaning, how do your experience and strengths apply to the other person or the company you're applying to. 🎯

- "What I'm looking for is..."
- "I believe I can add value to your company by..."
- "I'm looking to achieve...."

## ✅ End with a question

Whoever asks a question controls the conversation. Always end with these kinds of questions: Red question mark ornament

- "Am I the kind of person you're looking for?"
- "Is this what company X is looking for?"

Let the other person "say" you're the right fit, not you.

Hope you find this useful 😇
Let's Learn - Week 1 - WebServices
Tags: spring, microservices, learning, webservices
Published: 2020-07-18 19:50:31

# Introduction:
Spring has really evolved a lot. It has been around for over a decade and has found a place as the *de facto* standard framework for developing java applications. 

There are many exciting things in world of spring ecosystem such as Annotation, Spring MVC, REST, spring boot, spring cloud and micro services.

We are going to deep dive into world of restful web services, spring boot and micro services.

We will start with basics of restful web services, http request methods, how do you do exception handling, and validation and so on

# Introduction to Web Services:

#### What is a web service?


W3C definition : 
> "Software system designed to support interoperable machine to machine  (application – application )interaction over a network"

![webservice](https://github.com/csdinakar/SketchNotes/blob/master/Web%20service.png?raw=true)

Now we know what a web service is, let’s see the following:
* How does data exchange between applications take place
  * Consider a quiz application wants to  communicate with security application to know whether an user is authorised to be admin or not
  * So quiz application needs to send a request and security application will send a response	
  * Data exchange happens in form of request and response

* How can we make web services platform independent?
 * 2 popular formats – XML and JSON
```
<Learning>
    <Name>SpringBoot</SpringBoot>
    <Name>MicroService</SpringBoot>
</Learning>
```
 
```
[
{"Name":"SpringBoot"},
{"Name":"MicroService"}
]
```
* How does application know the format of Request and Response ?
 * Every web service offers service definition
 * It provides whether request-response format is XML , JSON or any other format
 * How to call the service , where is the service available 
 * What is the contract between service and consumer

To summarise the above

![webservice_structure](https://github.com/csdinakar/SketchNotes/blob/master/web%20service_1.png?raw=true)

Now we have seen a quick overview about web services, next let’s see about the different ways of implementing web services
Meeting up
Tags: 100daystooffload
Published: 2020-07-18 19:40:11

Recently I spent almost three hours sitting on a bench talking to a friend whilst enjoying this summer's beautiful late afternoon weather. Ordinarily, this wouldn't be a significant event to report, but this was the first time I'd sat down and talked to another person for seventeen weeks. 

It was reassuring – if surprising – that it felt incredibly normal. Conversation in person. Not novel, but something that hadn't happened for a quarter of a year. Even writing that down is the most bizarre thing, and I can't think of anything else to say. 

I now have one more week of work to endure before I'll see my family. I cannot wait.

*I'm publishing this as part of 100 Days To Offload. You can join in yourself by visiting [https://100daystooffload.com](https://100daystooffload.com).*
World of WoqlCraft - Ep.16 Knowledge Graph for NLP
Tags: python, database, nlp, graph
Published: 2020-07-18 19:26:36

---
title: World of WoqlCraft - Ep.16 Knowledge Graph for NLP
published: true
description: This time we try to see if we can store the structure of a sentence in a knowledge graph? We build a schema to store the SpaCy tokens and will store the structure of a SpaCy doc in a graph. This is a part 1, we will continue loading it into the graph in next episode.
tags: python, database, nlp, graph
---
This time we try to see if we can store the structure of a sentence in a knowledge graph? We build a schema to store the SpaCy tokens and will store the structure of a SpaCy doc in a graph. This is a part 1, we will continue loading it into the graph in next episode.

Find the source code from our [tutorial repo](https://github.com/terminusdb/terminus-tutorials).

Join the TerminusDB community at [Discord](https://discord.gg/Gvdqw97)
Make Sublime Text 3/4 Pretty
Tags: sublimetext3, sublimetext, codeeditor
Published: 2020-07-18 19:10:50

Here's my pretty Sublime Text 3:

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

It looks clean. No status bars, no line numbers, big, readable codes and iconography, and, still has the Sidebar and Minimap which is what made Sublime Text awesome.

My take here is, your editor is your canvas, not a pilot's cockpit. You are creating something. You're not driving a plane. Remove distractions, take your Zen a step deeper!

Here's the default Sublime Text 3:

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

First of all, if you're coming from editors like Notepad++, (*Ugh, those were the days...*) Sublime Text 3 already looks nice out-of-the-box by design. Read design story here:

[https://www.pixelstech.net/article/1379865910-The-story-behind-Sublime-Text](https://www.pixelstech.net/article/1379865910-The-story-behind-Sublime-Text)

## Setup

Make yours pretty too:

**1. Install Package Control**

Go to `Preferences -> Install Package Control`.

**2. Install Material Theme**

Install `Material Theme` via `Package Control`, activate then pick your favorite color. I like `Palenight`, it's light on my eyes.

**3. Install Fira Code**

[Fira Code](https://github.com/tonsky/FiraCode) is my favorite code font, download and install it on your system.

**4. Update Settings**

Hide Status Bar: `View -> Hide Status Bar`.

Add settings (`Cmd + ,` in Mac or `Ctrl + ,` in Windows):

    "color_scheme": "Packages/Material Theme/schemes/Material-Theme-Palenight.tmTheme",
    "theme": "Material-Theme-Palenight.sublime-theme",
    "font_face": "Fira Code",
    "font_size": 14,
    "line_numbers": false

## Done
Pretty, simple!
Digital estate
Tags: seo, agentur, marketing, estate
Published: 2020-07-18 18:47:55

Im Zeitalter der Digitalisierung kommt es zu neuen Wertschöpfungsprozessen im Geschäftsumfeld. Die Qualität von Daten, Rankings und Interaktionen im Web und den sozialen Medien korreliert direkt mit dem Umsatz von Unternehmen. 

Die in diesem Wertschöpfungsprozess entstehenden Vermögenswerte (Assets) werden auch als digital estate bezeichnet.

Position Digital entwickelt und verwaltet diese digitalen Assets für seine Klienten und steigert damit den Markenwert für Unternehmen und deren Kunden. 

Durch den strategischen Aufbau von Content, wertvollen Inhalten und somit Sichtbarkeit unterstützt die SEO Agentur [Position Digital](https://www.positiondigital.de) operativ bei dem Aufbau von digitalen Assets.

Dies geschieht primär durch die Steigerung der Sichtbarkeit in der Suchmaschine von Google, dem absoluten Marktführer, durch Optimierung bestehender Seiteninhalte und Erstellung neues Contents. Für jeden Kunden wird ein maßgeschneidertes SEO-Konzept erstellt, um in seiner Nische zur Autorität zu werden. 

Damit einhergehend sind eine Erhöhung des Markenbewusstseins, mehr Reichweite und Umsatz, bessere Sogwirkung für potentielle Mitarbeiter und Neukunden.