teleren/devto huggingface dataset:
How to successfully host a regional IT conference in the midst of a lockdown
Tags: ruby, python, programming, eventsinyourcity
Published: 2021-11-25 14:19:33

Evrone has an office in the city of Voronezh, Russia, along with many other IT companies. But, there was no big professional IT conference held in Voronezh. [We decided to fix this with ITea Conf, an event where you can learn, share expertise, and engage in networking.](https://evrone.com/iteaconf2021)

ITea Conf was organized by Evrone, DataArt, DSR Corporation, Quantori, and the BeerJS enthusiast community. We decided to make a multi-stream conference about different technologies so that every IT specialist would find something interesting there. For the frontend and backend streams, we discussed Python, Ruby, Rust, Java, Go, Node.js, and .NET.
Pure CSS Responsive Grid Without Media Queries.
Tags: codepen
Published: 2021-11-25 14:12:28

<p>Pure simple and clean CSS3 Grid, Responsive on all devices, Without Media Queries,  so you no longer need to give breakpoints for any device using Media Queries, the code is written by Hidayat aka Alexis786 on Fiverr.</p>

{% codepen https://codepen.io/hidayat-dev/pen/rNzXNLm %}
How to mock environment variables with Jest
Tags: javascript, webdev, unittest, jest
Published: 2021-11-25 13:31:41

If you use Jest as your trusty testing framework for your Node.js application, you probably ended up in the situation where the code you are trying to test, uses environmental variables that you access with `process.env`.

The simplest way to do is to create a file, to be called `setEnvVars.js`, and to populate it with the env variables you need, for example:

```javascript
// .jest/setEnvVars.js
process.env.SOME_VAR = 'something';
process.env.SECRET = 'shh-do-not-tell-to-anyone';
// etc...
```

What I consider a good practice is also to place this file under a `.jest` folder, so we know that everything inside that, is related to Jest.

And just to make it more clear, you should have a file structure similar to this:

```
|-- .jest
|   `-- setEnvVars.js
|-- jest.config.js
|-- package-lock.json
|-- package.json
|-- server.js
```

Now the next thing to set up is to update your `jest.config.js` and tell it to use that file:

```javascript
// jest.config.js
module.exports = {
  setupFiles: ['<rootDir>/.jest/setEnvVars.js'],
  // ... other configurations
};
```

And that's it! Now when you will run the tests, the code will able to access to those mock environmental variables.
Aims to connect to its valued customers 
Tags: mistryworker, labourer, mason, constructionworker
Published: 2021-11-25 13:26:37

MISTRYMITRA AIMS TO CONNECT TO ITS VALUED CUSTOMERS

Mistrymitra, India's Local Search engine whose mission is to connect buyers to seller, service providers to service taken customers, and to deliver fast, free, reliable, and comprehensive information to our users. Our goal is to work hard and create materpieces that will provide our customers great joy. We never let our clients down since we believe in producing high - quality work.

HOW CAN I DO MY REGISTERATION WITH MISTRYMITRA??

You can login and register yourself for the services or send us your credentials. We will enroll your ID. Completely its free of cost.

OUR PRODUCT INFORMATION

Here at Mistrymitra we have the products information available online for the customers as it saves their time from looking for contractors, it is relevant at the same time, customers can access any time they wish for since its free of access, comprehensive and also advanced search at the same time. So we just made it very simple by having everything all their building needs available for all our valued customers which is just a few clicks away. If you need any type of Mistry & Contractor's then visit, www.mistrymitra.com
HTML
Published: 2021-11-25 13:26:27

What is HTML?
Okay, so this is the only bit of mandatory theory. In order to begin to write HTML, it helps if you know what you are writing.

HTML is the language in which most websites are written. HTML is used to create pages and make them functional.

The code used to make them visually appealing is known as CSS and we shall focus on this in a later tutorial. For now, we will focus on teaching you how to build rather than design.

The History of HTML
HTML was first created by Tim Berners-Lee, Robert Cailliau, and others starting in 1989. It stands for Hyper Text Markup Language.

Hypertext means that the document contains links that allow the reader to jump to other places in the document or to another document altogether. The latest version is known as HTML5.

A Markup Language is a way that computers speak to each other to control how text is processed and presented. To do this HTML uses two things: tags and attributes.u
C++
Published: 2021-11-25 13:23:57

C++ is a MUST for students and working professionals to become a great Software Engineer. I will list down some of the key advantages of learning C++:

C++ is very close to hardware, so you get a chance to work at a low level which gives you lot of control in terms of memory management, better performance and finally a robust software development.

C++ programming gives you a clear understanding about Object Oriented Programming. You will understand low level implementation of polymorphism when you will implement virtual tables and virtual table pointers, or dynamic type identification.

C++ is one of the every green programming languages and loved by millions of software developers. If you are a great C++ programmer then you will never sit without work and more importantly you will get highly paid for your work.

C++ is the most widely used programming languages in application and system programming. So you can choose your area of interest of software development.

C++ really teaches you the difference between compiler, linker and loader, different data types, storage classes, variable types their scopes etc.

There are 1000s of good reasons to learn C++ Programming. But one thing for sure, to learn any programming language, not only C++, you just need to code, and code and finally code until you become expert.
My Aha! Moment with Test-Driven Development
Tags: testing, webdev, programming
Published: 2021-11-25 13:19:27

---
title: My Aha! Moment with Test-Driven Development
published: true
description: It all started with a test written in plain English.
tags: testing, webdev, programming
---

My aha! moment with test-driven development were **acceptance tests** and I recommend everyone who is still a skeptic to start there.

{% post https://dev.to/semaphore/the-benefits-of-acceptance-testing-2b34 %}

Many years ago I was working on a Ruby on Rails app with a multi-step booking process. Each step had many possible states and outcomes.

Testing that manually after every change in code was painfully repetitive, slow, and embarrassingly unreliable. 😓

Getting anything done was hard. We’d change one thing, then spend about an hour on manual testing in the web browser to check if everything is still working.

We’d often be surprised by the fact that we broke a seemingly unrelated use case. 🤯

Sometimes we’d figure that out on our own, and sometimes we’d ship a new version to production and the client would email us about what had just stopped working.

Getting that kind of news felt the worst. It felt like we were wasting a lot of our client’s and our own time. 👎

Then, we discovered [Cucumber](https://cucumber.io/).

[Very easy to get started](https://semaphoreci.com/community/tutorials/introduction-to-writing-acceptance-tests-with-cucumber). We could write a test once, and it would automatically launch a web browser, run the application, and do the work of feature verification instead of us.

That felt like magic! 🪄 ✨

As soon as we started writing acceptance tests for a feature we had been working on, our development accelerated by an order of magnitude. 🚀

We could add and change code without worrying that we would break something. 😌

When something did break, a failing scenario would let us know, and we’d quickly fix it before deploying a new version to users. 🦄

So to all teams out there who don't write (much) tests, I Hundred points symbol recommend starting with acceptance tests.

**The ROI** — in peace of mind, reliability, velocity, and good feeling — of writing just a few is massive.

From that point on, it's really a downhill ride to adopting a test-driven mindset for all layers of code. 💪

_Originally published as a [Twitter thread](https://twitter.com/markoa/status/1463855491814072324)._
How does anti-virus work?
Tags: security, cybersecurity
Published: 2021-11-25 13:11:04

Antivirus software scans program using selected chunk of data from its database. If it gets a code that resembles to that of a malware stored in its database then that code is flagged as malware. Now this is either isolated or deleted
The detecting based anti-virus applications dominate the security industry over time. But due to rise in cybercrimes and criminal activities across the internet, these applications have not been very effective against the dangers. In the current times hackers are well equipped with efficient analysis workstations and penetration applications to check whether new malware software’s are being detected or not.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d7ymuejauxziw1grcm72.png)
Features of Antivirus Software
Background Scanning – the anti-virus scans the applications which are present in system, when they are opened in their backend state. This process is called an on-access scanning.  This assures that the system is safe from all sought of malware attacks
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h39hzsupkc4xs517c0a3.png)
 
 
 Complete System Scans. these scans are not much needed if there is on hand access feature on the system.it is well used if the anti-virus is installed for the first time or the security of the system is not updated for long time .this is implemented to ensure that there are no malware hiding in the most difficult locations and deep behind the codes of the system. Full framework scans are vital to scan your contaminated system
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/78y76o29cozbm9dufi0s.png)
 
 
Virus Definitions - Antivirus software codes are based on the definitions to differentiate a virus from a genuine file and a malware. This the vital step to check on new virus definitions. The virus definitions clears of the of the marks of any codes which are considered as hazard in the system code.in the scenario of virus definition finds a file with marks of malware that matches accordingly, then that file is immediately terminated from execution and is isolated. The antivirus software runs through the malware, analyses it, and sends to lab to find out the origin and purpose of the malware in the system
Automatic scrolling for Chat app in 1 line of code + React hook
Tags: javascript, react, webdev, programming
Published: 2021-11-25 13:10:18

---
canonical_url: https://dpnkr.in/blog/scroll-chat-react
description: Whenever you get a new message the chat feed automatically scrolls to the bottom. This guide explains how you can do it in just 1 line of code.
---

While using WhatsApp, twitch, or any social media application your chat feed automatically scrolls to the bottom when a new message is sent/received. While building an application with a chat feature this is definitely an important feature you should ship.

If you don't understand what I am actually talking about try out this little demo I made. Type a message and press enter, as you send a new message it goes out of view and you have to scroll to view it.

> If you want to try this interactive demo live head over to my [original blog post](https://dpnkr.in/blog/scroll-chat-react).

![Chat before](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4rmyzcxzbbw7922zc731.gif)

It's actually pretty simple to fix this, firstly we should know the container element which is wrapping all the chats. Then select the element, get the height using [`scrollHeight`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight) then set the element's vertical scroll height using [`scrollTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop).

That's it.

```js
const el = document.getElementById('chat-feed');
// id of the chat container ---------- ^^^
if (el) {
  el.scrollTop = el.scrollHeight;
}
```

Here's the new demo with this thing implemented. Now it scrolls to the bottom when a new message comes in.

![Chat After](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/52wsl5cfdi57p654gop7.gif)

Now coming to the react implementation, we will use `useRef` & `useEffect` to get access to the element and handle the side effect.

This would take `dep` as an argument which will be the dependency for the `useEffect` and returns a `ref` which we will pass to the chat container element.

```tsx
import React from 'react'

function useChatScroll<T>(dep: T): React.MutableRefObject<HTMLDivElement> {
  const ref = React.useRef<HTMLDivElement>();
  React.useEffect(() => {
    if (ref.current) {
      ref.current.scrollTop = ref.current.scrollHeight;
    }
  }, [dep]);
  return ref;
}
```

Usage of the above hook:

```jsx
const Chat = () => {
  const [messages , setMessages] = React.useState([])
  const ref = useChatScroll(messages)
  return(
    <div ref={ref} >
      {/* Chat feed here */}
    </div>
  )
}
```
CSS
Published: 2021-11-25 12:59:10

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

CSS is designed to enable the separation of presentation and content, including layout, colors, and fonts. This separation can improve content accessibility; provide more flexibility and control in the specification of presentation characteristics; enable multiple web pages to share formatting by specifying the relevant CSS in a separate .css file, which reduces complexity and repetition in the structural content; and enable the .css file to be cached to improve the page load speed between the pages that share the file and its formatting.

Separation of formatting and content also makes it feasible to present the same markup page in different styles for different rendering methods, such as on-screen, in print, by voice (via speech-based browser or screen reader), and on Braille-based tactile devices. CSS also has rules for alternate formatting if the content is accessed on a mobile device.

The name cascading comes from the specified priority scheme to determine which style rule applies if more than one rule matches a particular element. This cascading priority scheme is predictable.
La guía de compras que ofrece Fredileis para orientar durante las compras del Black Friday y la Navidad

Published: 2021-11-25 12:57:33

A pocos días para que llegue el Black Friday y las Navidades, los consumidores ya empiezan a dedicar mucho tiempo a desplazarse para comprar los regalos que tienen pensados para este periodo del año. La elección de las compras de regalos, en muchos casos, resulta algo pesada por las innumerables ofertas que lanzan los grandes almacenes, tiendas, etc.

Elegir la mejor opción de compra visitando los establecimientos y mirando todas las características y diferentes precios puede resultar incómodo, así como llevar a cabo esa tarea sin cometer ningún error en la compra, ya sea porque hay mucha gente, porque el dependiente está muy solicitado, etc.

Para facilitar ese esfuerzo, Fredileis presenta su guía de compras, donde el usuario podrá realizar su previa comparativa del producto elegido, de manera funcional y desahogada, para hacer la compra de la mejor relación calidad-precio y no hacer compras por impulso donde siempre existe un alto porcentaje de error.

En la web, Fredileis efectúa periódicamente diferentes análisis de productos, escogiendo y publicando resultados, junto con unas recomendaciones de compra de los expertos de Fredileis. En el portal, sus visitantes tienen información detallada sobre la variedad de productos por categorías, como hogar, cocina, deporte o incluso cuidado personal. Podrán obtener comparativas de robots aspirador y de robots de cocina y si son aficionados al deporte, también de zapatillas para correr.

Las guías de compra dotan a los usuarios de todo detalle del producto y de unas tablas muy intuitivas donde recalcan las principales características que tiene cada artículo, junto con el análisis de los modelos más notables y detallando sus pros y contras para resolver dudas antes de realizar la compra.

“Este Black Friday, el artículo estrella de nuestra web es el robot aspirador y un pulsómetro sobre todo para que los deportistas puedan verificar su frecuencia cardíaca a tiempo real y que incorpora GPS. Nuestra comparativa siempre es realizada por un experto colaborador que nos asesora en cada artículo verificado para hacer más fácil la decisión de compra”, comentan desde Fredileis.

Junto a los robots aspirador, en Fredileis vaticinan que también en estas Navidades se regalará una relevante cantidad de sillas gaming. Por ello, ofrecen su completa guía de compra donde se podrán analizar las distintas sillas gaming para jugar y trabajar, ya que después de la pandemia y el teletrabajo toca renovar este artículo. Es posible obtener más información en la página web de fredileis.es.

https://lavozdelima.com
Los servicios de diseño web profesional que ofrece Webservi

Published: 2021-11-25 12:56:12

Para cualquier empresa, las páginas web se han convertido en un activo importante, ya que gran parte de las tracciones de compras de algún bien o servicio se realizan a través de la web. Por este motivo, el diseño web debe ser pensado y elaborado bajo la estricta supervisión de un profesional.

Webservi es una empresa que se especializa en el diseño y desarrollo de páginas web a nivel profesional, pensadas y elaboradas según las necesidades reales de cada empresa, ofreciendo soluciones digitales creativas y llamativas que aporten valor y rentabilidad a la marca.

Relevancia del diseño web dentro de los negocios digitales
Hoy en día, un negocio que no disponga de una página web tiene pocas probabilidades de triunfar y, como consecuencia de esto, el diseño web se ha posicionado como uno de los elementos más importantes dentro de cualquier estrategia de marketing digital.

Un usuario, al ingresar en la web de cualquier empresa, en lo primero que se fijará es en la forma con la que se ha diagramado gráficamente. Las páginas web armónicas, organizadas, con elementos gráficos alusivos a la institucionalidad y la identidad de la marca siempre son recibidas con buen agrado por parte de los usuarios. Una página incoherente, visualmente pesada y compleja de entender está destinada al fracaso.

El diseño web debe recaer en la experiencia y conocimiento de profesionales que puedan entender e interpretar la visión del cliente. Un buen diseño web debe ser alusivo a los principios de la marca, mostrar una propuesta de valor clara y ser fácil de usar por el usuario, ofreciéndole la confianza que este necesita.

Beneficios de contratar a un profesional en el diseño web
Un diseñador web es la persona ideal para entender y enfocar la página web hacia las necesidades de la empresa, garantizando que el usuario tenga la mejor experiencia y consuma el contenido de tal manera que realice la acción que se espera.

Una persona que decida crear su negocio online no está en la obligación de tener conocimientos técnicos y perder el tiempo creando algo que no funcionará, por no contar con las herramientas adecuadas. Un diseñador web desarrollará una página web que cumpla con las expectativas de los clientes, transformando las ideas en un diseño ameno y seguro que genere conversión.

El diseñador web es el aliado que toda empresa necesita para dar el salto al mercado digital y no solo para crear la web, sino también para ayudar a posicionarla y mantenerla, incrementando la rentabilidad de la empresa.

https://lavozdelima.com
Day 48 of 100 Days of Code & Scrum: Just Chilling With Sass-y Styling
Tags: 100daysofcode, beginners, javascript, programming
Published: 2021-11-25 12:53:26

Greetings, everyone!

Today was a really easy day in terms of work. All I had to deal with was SCSS styling for my entire homepage. It's still a work in progress, and I still have three sections that need to be patched up.

I'm fairly pleased with what I've done as well, but it is far from the ideal output for me. There is so much more that this could improve upon, but if I truly want to deploy my first MVP by the end of the week, then I can't be too picky.

Anyway, let's move on to my daily report!

## Yesterday

I squashed this bug:

`Access to XMLHttpRequest at API_GATEWAY_ENDPOINT from origin http://localhost:3000 has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource `

Also, I started working again on the other parts of the website besides the contact form.

## Today

Here are the things I learned and worked on today:

### Company Website

- I fixed the styling for a lot of the sections of the website.
- added images in their appropriate locations.
- wrote text content for the Services section of the homepage.
- fixed the images on the footer.
- add some hover effects for links and buttons.

### Scrum

- I learned about Scrumban, which is a method for moving from Scrum as a starting point towards Kanban.
- I did some practice flashcards for Scrum.
- reviewed some of the things I've learned before.

Thank you for reading! Have a good day.

![Rammina Thank You Banner](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x9ayfxxxaz2g2hfcqbsk.png)

### Resources/Recommended Readings

- [Scrum to Scrumban in 6 Steps + FREE Cheat Sheet](https://www.youtube.com/watch?v=fgT4AaKcBUA)
- [Scrum Master learning pathway | Scrum.org](https://www.scrum.org/pathway/scrum-master)
- [The 2020 Scrum Guide](https://scrumguides.org/scrum-guide.html)
- [Mikhail Lapshin's Scrum Quizzes](https://mlapshin.com/index.php/scrum-quizzes/)

### DISCLAIMER

**This is not a guide**, it is just me sharing my experiences and learnings. This post only expresses my thoughts and opinions (based on my limited knowledge) and is in no way a substitute for actual references. If I ever make a mistake or if you disagree, I would appreciate corrections in the comments!

<hr />

### Other Media

Feel free to reach out to me in other media!

<span><a target="_blank" href="https://www.rammina.com/"><img src="https://res.cloudinary.com/rammina/image/upload/v1638444046/rammina-button-128_x9ginu.png" alt="Rammina Logo" width="128" height="50"/></a></span>

<span><a target="_blank" href="https://twitter.com/RamminaR"><img src="https://res.cloudinary.com/rammina/image/upload/v1636792959/twitter-logo_laoyfu_pdbagm.png" alt="Twitter logo" width="128" height="50"/></a></span>

<span><a target="_blank" href="https://github.com/Rammina"><img src="https://res.cloudinary.com/rammina/image/upload/v1636795051/GitHub-Emblem2_epcp8r.png" alt="Github logo" width="128" height="50"/></a></span>