teleren/devto huggingface dataset:
Add Live Chat in your website using Chatwoot in just 5 mins.
Tags: webdev, beginners, tutorial, opensource
Published: 2022-03-30 06:10:59

## You will need
  - A website for embedding Chatwoot
  - Valid email ID for creating an account on Chatwoot

## Step By Step Instruction

**Step 1: Create an account for free**
Go to the official [website](https://www.chatwoot.com/) and create an account.
In order to create an account, click “Create a free account” and then register yourself by filling out your basic details.
- Full Name
- Email ID 
- Account Name
- Password
- Confirm password

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

**Step 2: Go to setting and then Inbox**

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

After clicking “inbox” then clicking on “Add inbox”, you will see this kind of interface 

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

Now, click on “Website” and enter some details about a website where you want to add live chat.
Like :
- Website Name
- Website Domain
- Widget Color
- Welcome heading etc..

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

See this is a Snapshot of the landing page where we are going to add a live chat system. (Landing page credit : Traversy Media)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vvjvfyieawgq5smg8gwy.png)
 
 
**Step 3: Add agents to create inbox**
You can select yourself as an agent and get it all in your inboxes.
After that, you are just fewer steps to your destination!

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

Copy the code and paste it into your website code!

## Result
Note: This website is statically built with plain HTML, CSS, and a bit of JavaScript, if you want to try similarly then you can just add your copied code into the body tag in the .html file!
Here is the [link](https://landing-page-j4gd49cbr-suchitragiri.vercel.app/) if you want to see:)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5kniamdrtm4lr9bnlm9h.png)


## *Thanks for reading, if any suggestions feel free to comment below!*

If you want to support😀
[![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cawwn08bx5rh2s9bax2x.png)](https://www.buymeacoffee.com/suchitra)
Get the Best Web Scraping and API Services - Zenscrape
Tags: javascript, webdev, apilayer, api
Published: 2022-03-30 05:54:08

Are you searching for the best web scraping and API Services? Zenscarpe is one of the best platforms providing the top-notch google web scraping API services. With them, without getting blocked you can get access to data on a large scale. The best thing about their [web scraping API](https://zenscrape.com/) is that it handles all the scrapping issues well. Regardless of the requests submitted their API Provides you the brilliant performance. For showing geotargeted material, Zenscrape lets you specify your proxy location. Visit https://zenscrape.com/ and avail the best google web scraping API services now. 


![Uploading image](...)
Beginner Guide to Blazor Web Development
Tags: blazor, aspnetcore, beginners, codenewbie
Published: 2022-03-30 05:52:02

---
title: Beginner Guide to Blazor Web Development
published: true
description: 
tags: blazor, aspnetcore, beginners, codenewbie
//cover_image: https://direct_url_to_image.jpg
---
If you are new to Blazor web development and looking for a resources to get started then this blog post is for you. Here you will find a series of blog post on Blazor how one can get started developing specially for beginners.
* [Getting Started with Blazor Web Development](https://dev.to/sabahshariq/getting-started-with-blazor-web-development-4c7k)
* [Blazor and WebAssembly](https://dev.to/sabahshariq/blazor-and-webassembly-3ol3)
* [Blazor Server App and Blazor WebAssembly App](https://dev.to/sabahshariq/blazor-server-app-and-blazor-webassembly-app-2jhf)
* [Blazor Project Structure and Layout](https://dev.to/sabahshariq/blazor-project-structure-and-layout-123l)
* [New to Blazor, Points to Keep In Mind](https://dev.to/sabahshariq/new-to-blazor-points-to-keep-in-mind-h82)
Dart Data Types - Cheat Sheet
Published: 2022-03-30 05:41:57


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

  **//String**
  String className = "Sujith";
  print(className);
  
  **//int**
  int b = 32;
  print(b);
  
  **//double - for floating point numbers.**
  double avgmark = 35.6;
  print(avgmark);
  
  **//num - Supports both double and int**
  num mygf = 4.3; 
  print(mygf);
  
  **//bool**
  bool activeClass = true;
  print(activeClass);
  
  **var - supports all type of data**
  var teacherName = true; 
  print(teacherName);
  
  **dynamic  - supports all type of data**
  dynamic mytchr = true;  
  print(mytchr);
  
  **Difference between var and dynamic data type in dart.
    dynamic: can change TYPE of the variable, & can change 
    VALUE of the variable later in code. var: can't change 
    TYPE of the variable, but can change the VALUE of the 
    variable later in code.**
  
  **//List**
  List<String> studentName = ["Abhiram", "Aneesh", 
  "Vibin","Sujith"];
  print(studentName);
  
  List<int> testList = [0, 1, 2];
  print(testList);
  
  List<dynamic> dynamicList = ["Sujith", 56, 78.3];
  print(dynamicList);
  
  **//Map - key value pairs**
  Map<String, dynamic> mapVariable = {
    "name" : "Sujith",
    "age" : 27,
    "Marks" : 89.3,
    "Pass" : true,
    "class" : "Flutter"
  };
  print(mapVariable);
How to use responsive images to speed up your apps — with android glide example
Tags: android, androiddev, glide, kotlin
Published: 2022-03-30 04:55:45

Loading images efficiently is very important, on every platform, be it [android](https://blog.canopas.com/android-gitlab-ci-setup-c3618b8ef0db), iOS or the Web. It makes apps/websites faster and also saves users' internet bandwidth.

Loading image in views need to be efficient, faster and smooth.

Here's the guide to load image faster and smoother with android glide example.

This article answer these 4 questions -

1. What is responsive image loading?
2. Why is it important?
3. Various approaches to providing responsive images
4. How to implement it with the android Glide library

You can read full article here [https://blog.canopas.com/how-to-use-responsive-images-to-speed-up-your-apps-with-android-glide-example-ece3924b84fd](https://blog.canopas.com/how-to-use-responsive-images-to-speed-up-your-apps-with-android-glide-example-ece3924b84fd)
10 Cool Tech Portfolios
Tags: webdev, css, beginners, portfolio
Published: 2022-03-30 04:30:19

There are many reasons that one should create their own tech Portfolios if they are a developer. The number one reason being - **Proof of Work**. So here in this post I'm going to list **_10 Cool Tech Portfolios_** that I filtered out of many portfolios that are **different, unique and awesome** in their own way.
These portfolios can be an inspiration for your tech portfolio. So let's jump in.

> **Note:** _The screenshots are just for reference. They don't depict the actual hardwork and creativity of the portfolios demonstrated through - **animations, loaders, fonts, transitions.** Also these portfolios are not ranked!
> Do check out these portfolios and comment down your best picks. Also, if you have a tech portfolio put that also down in the comment section._

1. **[Ayush Singh](https://www.ayushsingh.net/)**
![Ayush Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qznbmxym48k6zxrtq2v5.png)

2. **[Mayur Patel] (https://mayurbavisiya.github.io/)**
![Mayur Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jmlyukik3571pgteodo2.png)
 
3. **[Terance] (https://terance.vercel.app/)**
![Terance Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yfxfdgo17por9nq10ljz.png)
 

4. **[Sumit Dey] (https://sumit-job.vercel.app/)**
![Sumit Portfolio] (https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8xrg1o6b6qdxvft6qd3g.png)

 
5. **[Medhavi Basera] (https://medhavimb.me/)**
 ![Medhavimb Portfolio] (https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dp02kso0qow64er2gvp9.png)
6. **[Saurabh Gupta ](https://saurabhgupta.netlify.app/)**
![Saurabh Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8rb7napl6efq8ztkknbx.png)
 

7. **[Gopal Oswal] (https://oswalgopal.github.io/)**
![Gopal Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fdsc1vsok1cgge8o6sb7.png)
 
8. **[Himanshu Shekhar] (https://hshekhar.com/)**
![Himanshu Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fyp90zttj4576kvr1kc5.png)
 
9. **[Arnab Chatterjee](https://arn4b.tech/)**
![Arnab Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wlzyvpn1k2t0rugdn83q.png)
 
10. **[Adhithya |that_coffeee_guy](https://thatcoffeeeguy.com/)**
![Adhitya Portfolio](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k7jb9ldyr038af7ok2uf.png)
 
_I'm also looking more inspirations for creating my tech portfolio. So if you've a tech portfolio do not hesitate to comment that down. As always thank you for spending your time reading my posts._

> Have an inspirational day :)
How I setup a sqlite cache in python
Tags: python
Published: 2022-03-30 03:55:50

---
canonical_url: https://waylonwalker.com/til/python-diskcache/
cover_image: https://images.waylonwalker.com/til/python-diskcache.png
published: true
series: til
tags:
- python
title: How I setup a sqlite cache in python
---

When I need to cache some data between runs or share a cache accross multiple processes my go to library in python is `diskcache`.  It's built on sqlite with just enough cacheing niceties that make it very worth it.

## install diskcache

Install diskcache into your virtual environement of choice using pip from your command line.

```bash
python -m pip install diskcache
```

## setup the cache

There are a couple of different types of cache, `Cache`, `FanoutCache`, and `DjangoCache`, you can read more about those in the [docs](https://grantjenks.com/docs/diskcache)

```python
from diskcache import Cache cache = FanoutCache('.mycache', statistics=True)
```



## Adding to the cache

Adding to the cache only needs a key and value.

``` python
cache.add('me', 'waylonwalker' )
```

## Set the expire time

Optionally you can set the seconds before it expires.  The cache invalidation tools like this is what really makes diskcache shine over using raw sqlite or any sort of static file.

``` python
cache.add('me', 'waylonwalker', expire=60)
```

## tagging

Diskcache supports tagging entries added to the cache.

``` python
# add an item to the cache with a tag
cache.add('me', 'waylonwalker', expire=60, tag='people')
```

This seems to let you do a few new things like getting items from the cache by both key and tag, or evict all tags from the cache.

``` python
# evict all items tagged as 'people' from the cache
cache.evict(tag='people')
```

## Reading from the cache

You can read from the cache by using the `.get` method and giving it the key you want to retrieve.

```python
who = cache.get('me')
# who == 'waylonwalker'
```

## Cache Misses

Cache misses will return a `None` just like any dictionary `.get` miss.

```
missed = cache.get('missing')
# missed == None
```

## ⭐

Give Grant some love and give [grantjenks/python-diskcache](https://github.com/grantjenks/python-diskcache) a
⭐.
Why you should contribute to Open Source Projects?
Tags: opensource, webdev, productivity, career
Published: 2022-03-30 03:23:38



Open Source Software (OSS) can be defined as any software that has been released for the purposes of giving other people the rights to study, use, change, contribute to, and distribute the software. There are often licenses and documentation accompanying the source code that detail specific rights and information regarding the open-source project.

1. Increase your knowledge and skills with a particular technology -

- When you contribute to open source you have to read a lot of code, go through the documentation and learn new technologies.

- All the knowledge gained through discussions with project members and by contributing actively to the code base represents an often underestimated competitive advantage for you and your company.


2. Contributing to open source project helps your reputation and can leverage your career

- These days companies want their employees to have hands-on experience with new technologies if you are contributing to open source you don't have to prove your skills it will all be visible in your GitHub profile.

- Active open source contributions emphasize your expertise and knowledge, more than certificates alone will ever do. This is beneficial for advancing your career, be it at your current or an interesting, future employer.

3. Contributing to open source projects you are using in your projects lets you better deal with potential risks and plan for the future

- When you are adding a new feature or fixing any bug you have to keep all things in mind what impact it will have in the future how it will change the functionality and a lot more questions.

- Open source projects usually have a much more transparent roadmap, simply for the sake of collaborating with the contributors, who need to know, where the project is heading for.

4. Contributing to open source projects is fun and gives you personal satisfaction

- Once you are comfortable with the codebase it is more of a fun activity to code daily and fixes new bugs. You enjoy the process more than the results.

- While in your own projects you may be in the position to act quickly when it comes to design or architectural decisions, there may be a lot more discussions in open source projects.
Deno Extension
Tags: vscode
Published: 2022-03-30 03:02:40

If you're not familiar with [Deno](https://deno.land/), it's a runtime for JavaScript and TypeScript started by the creator of Node.js.

{%embed https://github.com/denoland/deno %}

Tonight I discovered there is a [VS Code extension for Deno](https://marketplace.visualstudio.com/items?itemName=denoland.vscode-deno) that adds support for the Deno [language server](https://code.visualstudio.com/api/language-extensions/language-server-extension-guide).

{% embed https://twitter.com/kitsonk/status/1508997455723233281 %}

You can read more about [getting VS Code setup for Deno in the official docs](https://deno.land/manual/vscode_deno).
How to create a bootable USB Device on MacOS
Tags: tutorial, devjournal, linux
Published: 2022-03-30 02:52:32

## Introduction

Hello! Recently I had to create a bootable Arch Linux usb drive to fix an issue with my machine running Arch. However the only other PC I had access to was a Mac, so I'll show how to create a bootable external USB drive using only the command line. 

Hopefully it helps and I'm sure it will help me when I brick my Arch installation again. 😅

---

## Converting the ISO file to UDRW Format

First we need to convert the format of the ISO file to UDRW format so that the image can be written to the external USB device. This can be done via the following command:
Change the source_file to the name of the ISO image.

```bash
hdiutil convert -format UDRW -o output_file.img source_file.iso
```

---

## Formatting the external USB device

Next we need to format the external USB device, but first we need to get the device name.

```bash
diskutil list
```

This will list all the connected devices, make a note of the external device. (in my case /dev/disk4)

Next we need to format the device, this can be done via the following command:
Make sure to replace dev/disk4, you don't want to accidentely format an unrelated disk.

```bash
diskUtil partitionDisk /dev/disk4 1 "Free Space" "unused" "100%"
```

The above command creates 1 partition using 100% of the available space. 

---

## Copying the Image file to USB

Finally we can copy the UDRW format image to the USB device, this can be done via the following command: (This command needs root permission)

```bash
sudo dd if=output_file.img.dmg of=/dev/disk4 bs=1m
```

This command has no progress but it should finish after a while. 

Finally to be safe we eject the usb device.

```bash
diskutil eject /dev/disk4
```

Done! The USB device should now be bootable! 😃

---

Like me work? I post about a variety of topics, if you would like to see more please like and follow me.
Also I love coffee. 

[![“Buy Me A Coffee”](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/ethand9999)
High Note
Published: 2022-03-30 02:25:41

---
title: High Note
published: true
description:
tags: 
---
Always start and end the day on a high note. It sometimes feels impossible to get over the hump of projects that take forever but the slow incremental progress and chaining together high notes will most likely get the project over the hump.

A high note doesn't have to be some Herculean all nighter. A high note to end the day, for me, would be to clear my desk, send a good evening message to my team on Slack and have four of my most pressing items written down for the next morning. Where I would, in a perfect world, pick off the first item and start the day on a high note.

This is imperfect and might not always be the key to finishing that nagging *thing* but sometimes, ending on a high note, no matter the muck you've encountered throughout the day will beget a high note the next morning.
NODEJS EXPRESS
Tags: javascript, webdev, programming
Published: 2022-03-30 02:25:16

DOING INTERNSHIP INVENTORYSHOP
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/05sf7f3rps2juqgcigoj.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rumodce88ka2t5qr21i0.png)
What is Integration Testing?
Tags: qa, integrationtesting, softwaretesting, softwaredevelopment
Published: 2022-03-30 01:01:11

---
title: What is Integration Testing?
published: true
date: 2022-03-30 00:57:19 UTC
tags: #qa #integrationtesting #softwaretesting #softwaredevelopment
canonical_url: https://blog.seancoughlin.me/what-is-integration-testing
---

## Background

[Integration testing](https://en.wikipedia.org/wiki/Integration_testing), also known as integration and testing, is the next step up from [unit testing](https://dev.to/scc33/what-is-a-unit-test-3n9j).

In unit testing, individual chunks of software are verified. Whereas, integration testing checks multiple components for correctness.

The goal of integration testing is to confirm software works in a group.

Integration testing makes common use of [stubs and drives](https://www.geeksforgeeks.org/difference-between-stubs-and-drivers/).

- A stub is a _fake called program_, it allows for the testing of the program calling the stub. 
- A driver is a _fake caller program_, it allows for the testing of the program called by the driver.

## Approaches to Integration Testing

There are [four main approaches to integration testing](https://www.geeksforgeeks.org/software-engineering-integration-testing/).

- Big-bang: all the software modules are created and combined at once.
- [Bottom-up](https://en.wikipedia.org/wiki/Top-down_and_bottom-up_design#Programming): low-level components are tested by using drivers before high-level components.
- [Top-down](https://en.wikipedia.org/wiki/Top-down_and_bottom-up_design#Programming): first high-level modules are tested by using stubs before low-level components.
- Mix-integration (aka sandwich testing): a combination of the bottom-up and top-down approaches.

## Advantage

- Integration testing is an important way of verifying that larger chunks of code and services work together as intended. 

## Disadvantage

- Integration testing often requires a significant amount of extra code in the form of stubs and drivers to be written.

## Further Reading

Integration tests are just one kind of testing. [My series on software testing and its methods](https://blog.seancoughlin.me/series/software-testing) covers many other testing variations.
Under Developed Means Over Exploited
Tags: war, nato, truth
Published: 2022-03-30 00:52:45


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fr0otfalelbmdc3w7frv.jpg)


The term “developed” to describe Europe and North American countries undermine the human advancement in Asia, Middle East and African countries. Due to repeat colonization and wars, those countries did not have the opportunity to protect the development or advance civilization. To use the word “developing” without accompanying exploitation is an act of discrimination. 

The picture illustrate the difference between democracy before and after United States dropped diplomacy from the sky. Iraq, Libya, Yemen and Syria were pushed back 100 years of human advancement due to US democracy installation. People of North America and Europe would never have allowed such cruelty to poorest parts of the world had they knew. #war #truth #nato
CSS - Efeito de Rotação e Zoom com mouse hover
Tags: css, frontend, rotate, hover
Published: 2022-03-30 00:19:17

---
title: CSS - Efeito de Rotação e Zoom com mouse hover 
published: true
description: aprenda criar um efeito de zoom e rodação quando passa o mouse por cima de uma imagem
tags: css,frontend,rotate,hover
//cover_image: https://direct_url_to_image.jpg
---

{%embed https://youtu.be/HicLdpkEnOk %}
Precisamos utilizar While-Loops no Elixir?
Tags: elixir
Published: 2022-03-30 00:08:37

## Precisamos utilizar While-Loops no Elixir?

Se você já trabalhou com linguagens imperativas e decidiu mergulhar de cabeça nesta linguagem maravilhosa que é Elixir, você provavelmente já deve ter se perguntado como funcionam loops. Mas, será que realmente precisamos deles?

Elixir é uma linguagem funcional, o estado é imutável. Ela não possui estruturas básicas para loop como `for` ou `while` de linguagens imperativas convencionais. Veremos algumas alternativas muito interessantes para trabalhar.

## Utilizando comprehensions

Utilizando comprehensions podemos criar códigos mais concisos para criar iterações.

```elixir
iex> for n <- 1..10, do: n * 2
[2, 4, 6, 8, 10, 12, 14, 16, 18, 20]
```

Podemos observar a primeira parte dessa estrutura, o que chamamos de generators: `n <- 1..10`. Em seguida nós multiplicamos a variável `n` por 2, e temos este resultado: `[2, 4, 6...]`.


Também conseguimos aplicar essa estrutura de `for` com listas aplicando generators.
```elixir
iex> lista = [1, 2, 3, 4, 5]
iex> for n <- lista, do: rem(n)
[false, true, false, true, false]
```

Note que aplicamos a lista que definimos no generator para iterá-la, e em seguida verificamos se cada item dessa lista é par.

## Iterando listas

Com a função `each/2` conseguimos iterar uma coleção de valores sem criar uma lista.

```elixir
iex> lista = [1, 2, 3, 4, 5]
iex> Enum.each(lista, fn(n) -> IO.puts rem(n, 2) == 0 end)
false
true
false
true
false
:ok
```

Seguindo o mesmo exemplo utilizado no último tópico, verificamos se cada item da lista é par. Porém, o retorno dessa função é apenas um átomo `:ok`.


Já com a função `map/2` conseguimos produzir uma nova lista.

```elixir
iex> lista = [1, 2, 3, 4, 5]
iex> Enum.map(lista, fn(n) -> rem(n, 2) == 0 end)
[false, true, false, true, false]
```

Aplicando a mesma lógica, nós temos um resultado semelhante ao primeiro de exemplo utilizando comprehension.

## Utilizando macros

Com o uso da metaprogramação do Elixir nós conseguimos estender e criar algo semelhante ao While-Loop de linguagens imperativas. Porém, é totalmente **desnecessário**.

## Conclusão
A resposta para o tema central é: **não**. Temos maneiras mais inteligentes e eficazes para trabalhar com listas e mapas.