teleren/devto huggingface dataset:
Clippr - Light weight url shortener
Tags: azuretrialhack, azure, javascript, typescript
Published: 2022-03-07 18:19:28

[Instructions]: # (To submit to the Microsoft Azure Trial Hackathon on DEV, please fill out all sections.)


### Overview of My Submission

Light weight url shortener built with Next.js , Azure Cosmos DB and tailwind


### Submission Category: 

[Note]: Wacky Wildcards


### Link to Code on GitHub

[Note]: # (Our markdown editor supports pretty embeds. Try this syntax: `{% github link_to_your_repo %}` to share a GitHub repository)
[Note]: # (Your repository must include a README)
[Note]: # (You must use and list a permissive license for your code: MIT, Apache-2)

{% github https://github.com/skarthikeyan96/url-shortener %}

### Additional Resources / Info

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

![Screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qyikh09egkrxjz81zehr.png)
Handling errors like a pro in python with sys.excepthook😎
Tags: beginners, programming, python, tutorial
Published: 2022-03-07 17:58:00

As developers, whenever we code we encounter many errors and tracebacks.

So, how to handle this like a pro with sys.excepthook?

Well this is what we are going to explore in this blog, so let's began!

![Let's Goo (GIF)](https://i.gifer.com/75CN.gif)

## The Need

Whenever an error occurs the program prints that error and stops right?

But what if you want to mail that error to a developer or automatically open an issue in a GitHub issues?

Now many of you will say that we can do that with try and except blocks.

Yes you can but it would be pretty messy to surround try and except in a python file, or files for bigger projects.

But with sys.excepthook hook you just have to define a function to handle any error that might pop out.

## What is sys.excepthook and what does it do?

You can use sys.excepthook to catch errors and do anything with them! 

Excepthook be like:

![Ladies and gentelmen we got him (GIF)](https://media.giphy.com/media/iOm1xOSfAtPzmPXJqH/giphy-downsized.gif)

## Basic Example

```python
import sys

def imposter_syndrome(type, value, traceback):
    print("I am a bad coder ☹️")
    print(f"{type} of error has occurred, the value: {value}, and you can see traceback: {traceback}")

sys.excepthook = imposter_syndrome
```

Try Running This Code:

{% replit https://replit.com/@vaarunSinha/Except-Hook-Tutorial %} 

This was a non-practical but easy to understand example, stay tuned for more real world examples!

![Coder (GIF)](https://media.giphy.com/media/RbDKaczqWovIugyJmW/giphy.gif)

**_Happy Coding!_**
Beginner's view : Web 2.0 and Web 3.0
Tags: web3, zuri, web2, blockgames
Published: 2022-03-07 17:42:23

---

The Web, also known as World Wide Web (www) was invented by Sir Tim Berners in 1989. 
He saw the difficulty of sharing information where he worked. 
He noticed different computers had to be accessed for different information. Sometimes you even had to learn a different program on each computer. 

After his success in writing the first web page, Tim recognized that its potential would only be achieved if anyone, anywhere could use it without paying a fee or having to ask for permission.

![the web](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2nelmwx1cwq9b4wfhk67.jpeg)

The first stage of the web is being described as web 1.0. This is characterized by a few content creators with most users who are consumers of content. 
Personal web pages were common, consisting mainly of static pages - mostly read-only. 

At the moment web 2.0 which is an enhanced version of web 1  is characterized by interaction and collaboration. It focuses on user-generated content, usability, and interoperability for end-users. 

Web 3.0 refers to the advancement of web utilization and interaction which includes altering the Web into a database. 

![Image showing web 1, web 2 and web 3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eoox5idbqmkm4v1rpqzb.jpeg)

In web 2.0,  you could post something from your Twitter account but the authority at Twitter feels that information isn't needed in its' space, and boom! that data is kicked off. This shows the community at Twitter are the owners of that space and decide what goes on there. 

Web 3.0 provides a platform where data and information on a space are controlled by no one or any organization. 
It is decentralized that is no permission is needed from any centralized authority to post whatever. Such freedom! I don't know if it's an advantage. 

This also means that computer applications will be written for everyone to view which will encourage maximum participation and improvements.

In web 2.0, you trust the community at twitter with your information, just like you trust the bank with your transaction processing. Users interacts with trusted intermediary. 

Web 3.0 is trustless meaning the network itself allows participants to interact publicly or privately without a trusted third party.  It is permissionless meaning that anyone can participate without authorization from a governing body.

As a result, Web 3.0 applications will run on blockchains or decentralized peer-to-peer networks. [Blockgames](https://blockgames.gg/) in collaboration with [Zuri Team](https://zuri.team/) has prepared a program where beginners will learn to solve problems using blockchain technology.   [Nestcoin](https://nestcoin.com/) operate and invest in simple products that make crypto accessible to everyone.
BackEnd Explore
Published: 2022-03-07 17:14:19

JWT: JWT Stands for JSON WEB TOKEN. It is an open standard used to share information between two parties securely. One of them are a client and one of a server. In most cases, it’s an encoded JSON containing a set of claims and a signature. It’s usually used in the context of other authentication mechanisms like OAuth, OpenID to share user-related information. It’s also a popular way to authenticate/authorize users in micro service architecture. JWT can be encrypted, but it is typically encoded & signed. The purpose of Signed JWT is not to hide the data but to ensure the authenticity of the data. And that is why it’s highly recommended to use HTTPS with Signed JWTs.

Mongoose: Mongoose is an Object Data Modeling (ODM) library for MongoDB and Node.js. It manages relationships between data, provides schema validation, and is used to translate between objects in code and the representation of those objects in MongoDB. Mongoose provides an incredible amount of functionality around creating and working with schemas. Mongoose currently contains eight SchemaTypes that a property is saved as when it is persisted to MongoDB.
ExpressJs: Express.js is a web application framework for Node.js. It provides various features that make web application development fast and easy which otherwise takes more time using only Node.js. It is a fast, unopinionated minimalist web framework. It is a Node.js  based platform and its middleware module are called connect which in turn uses http module. So, any middleware which is based on connect will also work with Express.js.
CRUD Operation: CRUD stands for create, read, update and delete. It is also user-interface conventions that allow viewing, searching and modifying information through computer-based forms and reports. In essence, entities are read, created, updated and deleted. Those same entities can be modified by taking the data from a service and changing the setting properties before sending the data back to the service for an update. Plus, CRUD is data-oriented and the standardized use of HTTP action verbs.
Day:38 Training At ryaz :               Authentication and Authorization
Tags: webdev, node, javascript, beginners
Published: 2022-03-07 17:05:11

- Date:7/03/2022
- Day:Monday

Today, I started at about 10:40 am as, I was done with about Mongoose part and today I started with Authentication and Authorization  and first of all the instructor started with introduction that what Is meaning of Authorisation and Authentication.Authentication is the process of determining if the user is who he claims to be. It involves validating their email or password. and Authorization is the process of determining if the user has permission to perform a given operation.And the instructor guided that to use hash passwords bcrypt is used.and further instructed about use of bcrypt.After this he guided to make user model and discussed the process of registering user and further discussed the use  of load ash as Lodash is a JavaScript library that helps programmers write more concise and maintainable JavaScript after this he instructed about testing the Authentication and how to generate authentication tokens
and use Jason web tokens. so, this way my day ended up by learning more new things.
Looping through letters and dates in PHP with the for loop
Tags: php
Published: 2022-03-07 16:58:41

<small>Inspired by: https://bit.ly/2ZmgKGT and https://bit.ly/3u7oSZO</small>

Did you know that you can loop through letters in a `for` loop? It’s simple as the example below shows:

```php
<?php
    for($char = 'A'; $char != 'AA'; $char++){
        echo $char.' ';
    }
?>
```

The result:
```
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
```

After Z it’s starting from AA to AZ to ZZ and then from AAA to AAZ to AZZ to BAA and so on.
It can’t go before A. That means the following code just prints out a bunch of A's:

```php
<?php
    for($char = 'A'; $char != 'AA'; $char--){
        echo $char.' ';
    }
?>
```

You can also loop through dates:
```php
<?php
    $start = strtotime("2021-01-01");
    $end = strtotime("2021-02-01");
    $count = strtotime("+2 day", $date);
    for($date = $satrt; $date < $end; $date = $count) {
        echo date("Y-m-d", $date)."<br />";
    }
?>
```
This example prints out every second date between the January 1st and February 1st.
Hello World 📰
Tags: azuretrialhack
Published: 2022-03-07 16:46:29


### Overview of my Submission

Hello World is a web app that fetches headlines from all over the world through the NewsCatcher News API and performs sentiment analysis on it using Azure Text Analytics. The backend is a FastAPI which I have deployed using Azure App Services while the frontend fetches the sentiment-analyzed news from the API and uses the react-globe package to render a React + ThreeJS globe visualization of the world news!

The thought process behind Hello World ( the most innovative name right? 😂 ) started in my head when I learned about the whole concept of "data streaming". And then I thought of how cool it would be to visualize real-time news. But what would the visualization convey? That was when I learned about sentiment analysis and thought why not build something that analyses the sentiment of headlines from all over the world and display it in a super cool and interactive way for anyone to get a sense of what is happening on the other side of the world. And that is exactly what my project Hello World is! 

This is my first-ever hackathon submission though I feel like I have been a developer for ages! 🥳

It was definitely an amazing experience to test out my skills in Python and React and realize how much I still don't know. I also just realized that I spent more than 20 hours on this single project! ( PS. I used Wakatime for this )

The data is supposed to be updated every 24 hours but I cannot seem to figure out how to make it work. To anyone reading this, I would be more than happy if you could help me out! Do let me know in the comments below 😊

---

### Submission Category

Wacky Wildcards

---

### Link to Code on GitHub

{% github https://github.com/sam9111/HelloWorld-FastAPI %}


### Demo

[Here is a demo video for my project!](https://www.loom.com/share/a3c47f066e0243709896b6ed80ae5450)
#66 Days of Data
Tags: python, datascience, 100daysofcode, ankitgupta
Published: 2022-03-07 16:32:48

## **Learning Python**  👨‍💻

D 23 of #66daysofdata 📈

Today learnt Pycharm - Featues, Importanting tools & Useful Plugins✌️

I'll be glad to connect & learn with similar goal centric people on 
👇👇👇

**Github** @ [MrAnkitGupta](https://github.com/mrankitgupta)

**Twitter** @ [Mr_AnkitGupta01](https://twitter.com/Mr_AnkitGupta01)
Appendix: Reliability (Failure Management) - AWS Well-Architected Framework Study Guide
Published: 2022-03-07 16:26:58

[Return to Well-Architected Framework Guide](https://dev.to/aidutcher/aws-well-architected-framework-study-guide-introduction-fjg)

[Appendix: Reliability](https://docs.aws.amazon.com/wellarchitected/latest/framework/a-reliability.html)

**How do you back up data?**

- Identify and back up all data that needs to be backed up, or reproduce the data from sources
- Secure and encrypt backups
- Perform data backup automatically
- Perform periodic recovery of the data to verify backup integrity and processes

**How do you use fault isolation to protect your workload?**

- Deploy the workload to multiple locations
- Automate recovery for components constrained to a single location
- Use bulkhead architectures to limit scope of impact

**How do you design your workload to withstand component failures?**

- Monitor all components of the workload to detect failures
- Fail over to healthy resources
- Automate healing on all layers:
- Use static stability to prevent bimodal behavior
- Send notifications when events impact availability

**How do you test reliability?**

- Use playbooks to investigate failures
- Perform post-incident analysis
- Test functional requirements
- Test scaling and performance requirements
- Test resiliency using chaos engineering
- Conduct game days regularly

**How do you plan for disaster recovery (DR)?**

- Define recovery objectives for downtime and data loss
- Use defined recovery strategies to meet the recovery objectives
- Test disaster recovery implementation to validate the implementation
- Manage configuration drift at the DR site or region
- Automate recovery

[Return to Well-Architected Framework Guide](https://dev.to/aidutcher/aws-well-architected-framework-study-guide-introduction-fjg)
Fix: tzdata hangs during Docker image build
Tags: docker, devops, tutorial, linux
Published: 2022-03-07 16:24:39

During the installation of a few packages, Ubuntu usually installs the tzdata package. It’s usually included in some PHP or Python packages dependencies. The issue with it is that it hangs and waits for user input to continue the installation. It’s ok until we are using Docker and trying to build images (it’s hanging or even throwing errors in newer versions of Ubuntu). We will try to reproduce the situation and try to fix it.

To reproduce the hanging situation, we can use this Docker image:

```
FROM ubuntu:20.04
RUN apt update
RUN apt install -y tzdata
```
Here is the logs that we see in terminal:
```
Step 1/3 : FROM ubuntu:20.04
 ---> 1e4467b07108
Step 2/3 : RUN apt update
 ---> Using cache
 ---> 174ce3e1bb84
Step 3/3 : RUN apt install -y tzdata
...
Configuring tzdata
------------------

Please select the geographic area in which you live. Subsequent configuration
questions will narrow this down by presenting a list of cities, representing
the time zones in which they are located.

  1. Africa      4. Australia  7. Atlantic  10. Pacific  13. Etc
  2. America     5. Arctic     8. Europe    11. SystemV
  3. Antarctica  6. Asia       9. Indian    12. US
Geographic area: 
```

And here it hangs waiting for us enter data, and even after you’ll enter a region — the process will not resume.

To fix this situation we need to add lines 3 and 4 to our Dockerfile. We will create a variable called `$TZ` which will hold our timezone, and the create a `/etc/timezone` file:
```
FROM ubuntu:20.04

ENV TZ=Asia/Dubai
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone

RUN apt update
RUN apt install -y tzdata
```
And after building image we will see this output:
```
Step 1/5 : FROM ubuntu:20.04
 ---> 1e4467b07108
Step 2/5 : ENV TZ=Asia/Dubai
 ---> Using cache
 ---> 7f4c85bd0d3e
Step 3/5 : RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
 ---> Using cache
 ---> f6f784dfbad5
Step 4/5 : RUN apt update
 ---> Using cache
 ---> 5b1b5617eaa5
Step 5/5 : RUN apt install -y tzdata
 ---> Running in e71a917a9b6b
Current default time zone: 'Asia/Dubai'
Local time is now:      Tue Aug  4 12:14:55 +04 2020.
Universal Time is now:  Tue Aug  4 08:14:55 UTC 2020.
Run 'dpkg-reconfigure tzdata' if you wish to change it.

Removing intermediate container e71a917a9b6b
 ---> 3d29f4e8f7eb
Successfully built 3d29f4e8f7eb
Successfully tagged tzdata:latest
```
So it’s used the timezone that we provide and nothing hangs.

Here is the list of Timezones that you can pick one for you:
[List of tz database time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)


## Like to learn?
Follow me on [twitter](https://twitter.com/grigorkh) where I post all about the latest and greatest AI, DevOps, VR/AR, Technology, and Science! Connect with me on [LinkedIn](https://www.linkedin.com/in/grigorkh) too!
Check out my List Of JavaScript Data Visualisation Libraries!
Tags: javascript, webdev, analytics, 100daysofcode
Published: 2022-03-07 16:23:31

I have recently tried many JavaScript libraries for data analysis and visualization and used them in different combinations and on different stacks. Of course, not all of the existing ones, but enough to write a whole list. 

So I decided to do it - to write the [Complete List Of JavaScript Data Visualization Components](https://github.com/YuliiaNikitina/Complete-list-of-JavaScript-data-visualisation-components/?r=dt5) and share it on **GitHub**. 

So that my colleagues would not spend hours looking for the right and suitable component for them. I can't call it _"complete"_ yet, but if you have experience with a component I didn't mention, but you could recommend it, I'd be happy to get a pool request from you with new items on the list. 

I hope this list will be useful to many of you and make life easier. What do you think? Write your suggestions and ideas in the comments - I will be happy to read them and improve my list. 

Let me know what you think!
Search submenu tabs with flatMap and Vuetify
Tags: vue, vuetify, javascript, webdev
Published: 2022-03-07 16:21:29

On these days on work i had to add a search in a menu that has v-tabs on it, and when i finished, there was two approaches on how to do this. Of course that the changes in the system was more complex than in this example, but i hope that this can help someone.

## Before we dive into
The first approach was more simple (at least for me), that uses only _map_ and _filter_.The second approach was made by a work colleague that uses a _v-autocomplete_ and _flatMap_(that i had never heard before).

## Structure
So we have here a menu that have a sub menu, so you can imagine him like this:
![menu-structure](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u06pice8e6j9hna8pf86.png)

Yes, a computed property that is an _Array_ of a _Object_ that has two props:

- **name**: Title of the menu (String)

- **sub**: Content of the sub-menu (Array of strings)
  
And this will be the data for the _v-tabs_ that have a _v-menu_ on each tab. I will focus here only in the _JS_ code, but you can check the _HTML_ in this link of [CodePen](https://codepen.io/BrunoPanassi/pen/OJOLBmd)

## 1º Approach
So the first approach will be a _map_ on the computed _tabs_ itself, that returns only the _sub_ names that includes the letters of the variable search(used by a _v-text-field_), and then returns only the tabs that have the _subs_:
![first-approach](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vzpnm5ueeozzay8gnyl6.png)
The reason i thought this is the simplest way its for the familiar methods (filter and map) but this approach its not the clever or cleaner one.

## 2º Approach
This approach uses the flatMap, that _maps_ a nested array to a single array (simplifying the explanation), wich in this case it's the better option because we need only the values of the _sub_ property. And then filter only the values that matchs with the _search_ variable.
![second_approach](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nofqtssf01kmxej7q9a5.png)
In this example this computed property it's been used in a _v-auto-complete_ component.

## Conclusion
So for me the 2º approach was the cleaner one, both for code and screen design, and you can combine the search of the menu with a _$emit_ method to show the screen of the selected menu.

Thanks for reading, i hope that this was useful for you!
Appendix: Reliability (Change Management) - AWS Well-Architected Framework Study Guide
Published: 2022-03-07 16:15:01

[Return to Well-Architected Framework Guide](https://dev.to/aidutcher/aws-well-architected-framework-study-guide-introduction-fjg)

[Appendix: Reliability](https://docs.aws.amazon.com/wellarchitected/latest/framework/a-reliability.html)

**How do you monitor workload resources?**

- Monitor all components for the workload (Generation)
- Define and calculate metrics (Aggregation)
- Send notifications (Real-time processing and alarming)
- Automate responses (Real-time processing and alarming)
- Storage and Analytics
- Conduct reviews regularly
- Monitor end-to-end tracing of requests through your system

**How do you design your workload to adapt to changes in demand?**
- Use automation when obtaining or scaling resources
- Obtain resources upon detection of impairment to a workload
- Obtain resources upon detection that more resources are needed for a workload
- Load test your workload

**How do you implement change?**

- Use runbooks for standard activities such as deployment
- Integrate functional testing as part of your deployment
- Integrate resiliency testing as part of your deployment
- Deploy using immutable infrastructure
- Deploy changes with automation

[Return to Well-Architected Framework Guide](https://dev.to/aidutcher/aws-well-architected-framework-study-guide-introduction-fjg)
Streaming March 7, 2022
Tags: streaming, apachenifi, apachepulsar, python
Published: 2022-03-07 16:14:18

https://www.linkedin.com/pulse/march-7-2022-tim-spann/?trackingId=z6Gm4tXmQGCAiwKJuspXzw%3D%3D


A lot going on this upcoming week including a cool meetup.
No alt text provided for this image
Few Low-Code/No-Code Tools [List]
Tags: codenewbie, html, blockchain, news
Published: 2022-03-07 16:12:53

1. Notion
2. Retool
3. Shopify
4. Webflow
5. Airtable
6. Salesforce
7. Wix
8. Zapier
9. Wordpress
10. Squarespace
11. Retool

Feel free to add more & follow @keshav44483499
Useful Developer Tools out there 🧡
Tags: javascript, programming, python, productivity
Published: 2022-03-07 16:10:10

1. Github Pages
2. GitHub Codespaces
3. Netlify
4. Autocode
5. Snyk
6. Vercel
7. Sonatype
8. Glitch
9. CircleCI
10. Github Actions
11. Repl.it

Feel free to follow @keshav44483499 or add more...