teleren/devto huggingface dataset:
Story time with Treblle : Fun with flags
Tags: twilio, api, ios, tooling
Published: 2021-08-05 12:47:54

*Welcome to a series of short stories about how [Treblle](https://treblle.com) helped solved real problems for real developers. Hope you like them 🙌🏻*


One of our customers had an iOS app where you would enter a phone number and it would make an API request. The API endpoint would then send a confirmation code via SMS. You couldn’t even start using the app without the code. The API devs used Twilio to send the message and they tested it many many times by manually making requests to it. It was all working. 

On the app side the UI had a country dropdown with flags followed by the user entered phone number. It looked cool. You would select your country and then enter a phone number. The iOS team used a pod to build the UI and then sent the value to the API endpoint. 

**Once the app was somewhat ready they sent it to a bunch of external testers.** Nobody could get it to work. No SMS was comming in from the API. Of course it got reported to the API team and they again tried manually testing via Postman. Everything was working for them - again. Frustration and friction between the iOS devs and API devs built up. iOS team was saying that they are doing everything by the book, the API team was saying it’s working for them when try try it… They had a stalemate on their hands. **Together, they spent days communicating back and forth.** A few testers tried to enter different numbers, used different app versions…All they found out is that Twillio rejected the phone number - no idea why. 

**After a few days they added Treblle and as soon as they typed in the phone number in the app everybody understood what went wrong.** The pod that the iOS team used. for showing a list of countries, had been appending the selected flag emoji in front of the number. That was being sent to the API and logically it wasn’t working!

**Lessons learned:**
- developers will always tend to test in perfect conditions - that is just how we are wired 🤷🏻‍♂️
- it’s really hard to debug something that no one can actually see 🧐
- it’s hard to find issues when third party code is causing it 🍝

✅ [Treblle](https://treblle.com) helped them solve a multi day issue that was blocking the release in literary a few seconds 
✅ [Treblle](https://treblle.com) brought them together as a team and reduced friction

Stay tuned for more concrete examples of how [Treblle](https://treblle.com) can help you and your team make you daily dev life easier. Also if you used [Treblle](https://treblle.com) and it helped you comment here we would love to hear from you.
VRAT (Vitejs + Reactjs + Apollo + Tailwind CSS)
Published: 2021-08-05 12:36:10

**Background**

Hey! I want to share my stack I use, in it I collected:

*Vitejs*
*Reactjs*
*Apollo client*
*Tailwind CSS*
*Typescript*
*Routes*
*Light/Dark mode*

I plan to update this stack in the future, I am waiting for ideas in the comments.🙂

Repo: https://github.com/Rezvitsky/vrat
Choose your next VS Code theme
Tags: javascript, vscode, webdev, beginners
Published: 2021-08-05 12:31:02

Color themes let you modify the colors in Visual Studio Code's user interface to suit your preferences and work environment.

To install the new theme, press `CTRL+SHIFT+X`. Sidebar with extensions tab selected will open. You can type "theme" or specified theme name in the text input, select the one you like and install it. The theme will be applied automatically once installed.

To change installed themes, press `CTRL+K` and then `CTRL+T`. Popup window with your installed themes will be shown. If you iterate through results with `Arrow up` and `Arrow down`, you'll see themes apply automatically. If you're happy with what you are seeing press enter and theme will be applied.

**Top 5 VS Code themes:**
1. SynthWave '84
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cigmjk5zwobfdnwcjemb.png)

2. Material theme
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zy1x5jb9qy0bje2g3e0d.png)

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

4. One monokai
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1pk76ivj2mutny1fun8t.png) 

5. Shades of purple 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/322xltrv1hpsm665fszd.png)

Let me know down in the comments below, which VS Code theme is your favourite?

Also, if you would like to improve your VS Code skills, please [follow this link](alenvarazdinac.gumroad.com/l/fXZsK). 

[Follow me on instagram](https://www.instagram.com/alenvarazdinac/).
Python list and a NumPy Array
Tags: python, numpy, array, list
Published: 2021-08-05 11:43:20

I will try to explain why NumPy is more powerful and efficient compare with Python List.

First we will see basic definition of the list vs Array programming terminology

Lets see basic data structures arrays and lists

Arrays: are used to store homogeneous data (same data type) of fixed size storing in sequential order in memory
Lists are used to store data of growing in size and storing this data in available place anywhere(not sequential) in the memory.

Almost same logic applies to Python List and NumPy Array. You can see in the below picture, how list and array stores data in memory.

Python list and NumPy array

Python List:

Able to store different data types in the same list
Storing each item in random location in the memory
Good for the scenario where list can grow dynamically
Inbuilt data type.
It has more inbuilt functions
Appending will take less time in O(1) time
NumPy Array:

Can store only one data type in an array at any time
Storing each item is sequential which makes array more effective in processing.
Good for the scenario where the items are fixed size and same data time
Need to install external library NumPy
No extra functions, so it will not more memory store.
Appending elements will take more time in O(N) time
Happy Learning!!!
Try New Things
Tags: growth, learning, motivation, career
Published: 2021-08-10 07:48:43

---
title: Try New Things
published: true
date: 2021-08-05 11:23:00 UTC
tags: growth,learning,motivation,career
canonical_url: https://x-team.com/blog/try-new-things/
---
Babies are unquenchably curious. They stick their feet in their mouths, wobble around sharp corners faster than they should, and take a bite out of the charcoal you were using for your barbecue to almost instant regret and tears. Their daily experiments may seem silly to us, but they're not. In a strange way, everything a baby does is highly rational.

The _explore/exploit tradeoff_ explains why. Every time we make a decision, we either try out something new or stick with what we know. We either _explore_ to gather new information or _exploit_ to use the information we already have. A few examples:

- Do we order from a new restaurant (explore) or from our favorite one (exploit)?
- Do we learn a new language (explore) or stick with JavaScript (exploit)?
- Do we meet new people (explore) or visit our friends (exploit)?

Scientists across many different fields, from [psychology](https://psycnet.apa.org/record/2014-44776-001) to [economics](https://ieeexplore.ieee.org/abstract/document/7373510) to [computer science](https://ieeexplore.ieee.org/abstract/document/5360225), have heavily studied the explore/exploit tradeoff. In most real-life scenarios, it's an intractable problem, which means that there's no optimal solution that tells you when you should explore and when you should exploit.

However, one variable is a good indicator of which option someone will choose: time. For everyday decisions, we optimize the explore/exploit tradeoff across our entire lifespan. The younger we are, the more likely we'll still want to explore. The older we are, the more we'll want to exploit.

That's why babies stick their feet in their mouths and why the elderly stick to what they know. They're at different points in their lives. But there's just a little more to it than that.

The explore/exploit tradeoff is intractable in real-life scenarios because there's no clear cut-off point. There's no point in time when someone will suddenly move from all explore to all exploit. It's a gradual transition.

At least, it's supposed to be. But many of us stop exploring too soon. We're in our thirties, forties, fifties, and we assume we have all the information we need to stop exploring. We stop trying new things, we stop [looking for adventure](https://x-team.com/blog/season-two-review/), we stop learning, and ultimately we stand still and our lives grow grey and dull and we don't understand why.

But if we err on the side of exploring regardless of our age, we roll ourselves back on the young <> old axis of the tradeoff. If we stay [childlike in our curiosity](https://x-team.com/blog/cultivate-curiosity/), in a way, we grow younger. So we must fight against our urge to exploit. The world is rich, weird, and mind-bogglingly interesting, but only if we keep trying new things.
Do you know clip-path? 👈
Tags: css, html, webdev, frontend
Published: 2021-08-05 11:36:32

Hi,

The `clip-path` property allows you to make complex shapes in CSS by clipping an element to a basic shape (circle, ellipse, polygon, or inset), or to an SVG source.

CSS Animations and transitions are possible with two or more `clip-path` shapes with the same number of points.

The best link to learn it is https://bennettfeely.com/clippy/ IMO. For fun, I maded a material design spinner loader using `clip-path` here https://codepen.io/leo-bnu/pen/wvdmbVP.

Thanks for your time guys! 🖖
Introducing the Building SaaS on AWS show
Tags: aws, saas, kubernetes, serverless
Published: 2021-08-05 11:22:52

---
title: Introducing the Building SaaS on AWS show
published: true
description: Join us every other Wednesday at 3 PM CEST / 9 AM EDT for an hour-long Building SaaS on AWS session where you can quiz AWS SaaS Specialists and AWS customer guest speakers on all things SaaS
tags: aws,saas,kubernetes,serverless
cover_image: https://cdn.grosch.se/dev-to/building-saas-on-aws/building-saas-on-aws-promo-1000x420.png
---
{% youtube Jf6ge4e4vS4 %}
I'm excited to introduce you to Building SaaS on AWS, our new Twitch show premiering August 11 with me as host. I'll be joined by technical experts to dive deep on technical content around building SaaS on AWS.

### Tell me more!
Join us every other Wednesday at 3 PM CEST / 9 AM EDT for an hour-long session where you can quiz AWS SaaS Specialists and AWS customer guest speakers on all things SaaS - deep technical questions, specific use-cases, AWS and AWS Partner services, AWS customer examples, or what it's like to be a SaaS Specialist at AWS!

### Great! What can I learn from the sessions?
* Learn to build next generation SaaS on AWS 
* Get tips on most suitable AWS technologies for a use-case
* Get all your technical and business questions answered

### First episode August 11
On the premiere episode I'll be joined by Ranjith Raman, Senior Partner Solutions Architect on the AWS SaaS Factory team, to do a deep-dive on architecting a multi-tenant SaaS solution based on Amazon EKS.

Join us live on [twitch.tv/aws](twitch.tv/aws) on August 11, 3 PM CEST / 9 AM EDT and bring your questions!

### Agenda

View the upcoming agenda and find links to previous episodes [here](https://buildingsaasonaws.splashthat.com/).

If you have any questions about the show or AWS in general, please reach out on [Twitter](https://twitter.com/GunnarGrosch) or [LinkedIn](https://www.linkedin.com/in/gunnargrosch/). Go build!
Hoisting in JavaScript
Tags: javascript, hoisting, beginners, webdev
Published: 2021-08-05 11:21:54

## Let's see an example first: 


```
var x ;
x = 50;
console.log(x);

// Output: 50
```
Another Example :


```
x = 50;
console.log(x);
var x ;

// Output: 50
```

Why in both the case output is 50. For this, you will have to understand ***Hoisting***.


## What do you understand by ***Hoisting*** in JavaScript?

> According to MDN : 
JavaScript Hoisting refers to the process whereby the compiler allocates memory for variable and function declarations prior to the execution of the code.

Don't worry I will explain in simple terms 
> Simple terms: 
Hoisting means **MOVING** the **DECLARATION** part of the variables at the top of the code.

Now you might be wondering 😒 . Am I  mad or what for I have written 2 caps words that too between the sentence? But these two words hold great importance. 

## Let's understand about some catch of this property (Hoisting). 
- Hoisting is behind a scene process done by the JS engine. It is not like you will see your variables going all the way to the top of the code.

-  It is only about ** declaring** the variables, not about initializing them.

```
 let x ; // Declaration
 var y ; // Declaration

let x = 6 ; // Initialization
var y = 5 ; // Initialization
``` 

- Initialization of the variable will only take place once that code of line is executed.

- Using "let" before it is declared will give you a *reference error*.


```
car = "Volvo" ;
console.log(car);
let car;

// Output:  Reference error.
``` 

- Using "const"  before it is declared will give you a *syntax error.*

```
car = "Volvo" ;
console.log(car);
const car;

// Output:  Syntax error.

```

- Only ***var*** variables will be initialized that too with "undefined" value and ***let*** and ***const*** will not be initialized at all until that line of code is executed.

- Hoisting doesn't take place in *Arrow function* and *class*.

### Quiz

```
var x = 10;
y = 10 ;
console.log (x+y);
var y ;

// Output : ? 
```

```
var x = 10;
console.log(x + y);
var y = 10;

// Output: ?

```

```
x = 10;
y=10;
console.log(x + y);
const x;
let y;

// Output: ?

```

NOTE: You might be getting a little overwhelmed but don't be as a developer you should have an understanding about **hoisting**. A simple way to tackle this issue is just declaring the variable at the top and you are good to go.

That's all for this blog. We will meet in the next blog until then ***Keep Learning, Keep Growing***.

Do Answer these questions in the comment section.

You can connect with me 👇

 [Twitter](https://twitter.com/Vanshsh2701)
 [LinkedIn](https://www.linkedin.com/in/vanshsharma27/)  

- Image Credit :  [Kissanwat ](https://blog.bitsrc.io/what-is-javascript-hoisting-f0678208eb08) 
- Reference:  
[W3school](http://w3schools.com/js/js_hoisting.asp)  
[MDN](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting)
Short Note about Functional Programming in JavaScript
Tags: javascript, functional, programming, webdev
Published: 2021-08-05 10:55:45

Functional programming is programming paradigms where we take care of multiple things like:

1. Each operation decomposes into multiple functions. For example, a Function should perform one task.
2. Function should be pure and will always take input and give an output.
3. Side effects operation should be encapsulated into another function that is only responsible to handle/perform side effects and should be not mixed with regular operations.
4. Immutability, where the function should not change the global data or passed references of arrays and objects (non-primitive values). Instead, make a copy of that data and use it. Like map, filter, and forEach higher-order function.
5. Function composition, where one function output becomes the output of another function.
Yugasa Software Labs | Hire best Android App Developers in Gurgaon
Published: 2021-08-05 10:35:10

Yugasa is a leading android app development company where android app developers build engaging and scalable custom android apps for start-ups and enterprises.
For More Details ☎ Contact with us

📧 contact@yugasa.com
📞 +91-8800522257, +91-8800171133
🌐 https://yugasa.com/
How to Rename Multi index columns in Pandas Dataframe
Tags: python, pandas, datascience
Published: 2021-08-05 10:33:04

Pandas dataframe is a powerful two dimensional data structure which allows you to store data in rows and columns format. 

It also supports multi index for columns and rows. 

In this tutorials, you'll learn how to create multi-index pandas data-frame and how to rename the columns of the multi index data-frame. 

If you would like to rename columns of a single index dataframe read, [How to Rename columns of Pandas Dataframe?](https://www.stackvidhya.com/rename-columns-in-pandas/) 

## Creating Multi-Index Dataframe

To create a multi index dataframe, you need to follow two steps. 

First, create a normal dataframe using `pd.DataFrame()` method. 

Second, set the columns for the dataframe using `pd.MultiIndex.from_tuples()`. This allows you to set mutli index for the columns of the dataframe. 

**Snippet**

```
import pandas as pd

df = pd.DataFrame([[1,2,3], [4,5,6], [7,8,9]])

df.columns = pd.MultiIndex.from_tuples((("a", "b"), ("a", "c"), ("a", "d")))

df
```

You'll see the below output. 

**Output**

```
    a
    b	c  d
0	1	2	3
1	4	5	6
2	7	8	9
```

The multilevel column index dataframe is created. a is the first level column index and b, c, d are the second level column indexes. 

Next, let's see how to rename these  mutli-level columns. 

## Renaming the Multiindex Columns

To rename the multi index columns of the pandas dataframe, you need to use the [set_levels()](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.MultiIndex.set_levels.html) method. 

Use the below snippet to rename the multi level columns. 

**Snippet**

```
df.columns.set_levels(['b1','c1','d1'],level=1,inplace=True)

df
```
where, 

- `['b1','c1','d1']` - New column names of the index
- `level=1` - Level of the columns to be renamed
- `inplace=True` - To perform the rename operation in the same dataframe rather than creating the new dataframe

Now the second level index of the columns will be renamed to b1, c1, d1 as shown below.

**Output**

```
    a
    b1	c1  d1
0	1	2	3
1	4	5	6
2	7	8	9
``` 

This is how you can rename the columns of the multi index dataframe. 

## Conclusion

In this short tutorial, you've learnt how to rename the columns of the multi-index pandas data-frame using the `set_levels()` method.
My 7 steps to build a chatbot efficiently
Tags: chatbot, flow
Published: 2021-08-05 10:05:22

# Step 1. Identify the problem

What is the pain point you want to solve? For instance, you want to build a chatbot to help your team organize the sales meetings.

# Step 2. Define the scope

What is the main functionality? Your chatbot should be able to schedule meetings. The bot will connect the sales representatives and the manager. When the meeting time is scheduled, the bot will send a reminder to all involved parties.

# Step 3. Identify the endpoints

What is the content you want to share? What is the format? You need to think about the information that will be shared. For instance, the bot will have to send the meeting invite via email, to create a calendar event, and to send reminders.

# Step 4. Design the conversation flow

What are the possible paths of the conversation? For example, to schedule a meeting, the manager can ask to invite another sales representative.

# Step 5. Code the chatbot

Write the conversational script and use tools to code chatbot:

Some examples of tools:

a) IBM Watson Bot Builder

b) Wit.ai

c) Dialogflow

d) Botfuel

# Step 6. Test the chatbot

Test and refine the chatbot.

# Step 7. Deploy the chatbot
Week 7 and 8 of Coding Period in GSoC
Tags: gsoc, opensource, brlcad, oauth
Published: 2021-08-05 09:16:32

TL;DR let's talk about the week 7 and 8 of the Coding period in GSoC. I added the feature of custom background on models and the oAuth with MediaWiki is in progress. In this blog, I'll talk about two weeks together because on week 8 I was not well and I could not work in that week.

The first enhancement I started in week 7 was adding custom background to the viewer where the user sees the model. This feature was requested a long time ago [here](https://github.com/BRL-CAD/OGV-meteor/issues/67). I used `input type="color"` for the color palette and fetched the color in the js file with the meteor events. This task was kind of related to three.js so I looked into the three.js docs about updating the canvas. I got stuck in one issue after updating the color it required the user to trigger zoom or interact with the model viewer in order to update the color of the viewer. After searched about updating the canvas after a change I found `animate()` and `render()` can update the canvas. Though I was a bit conscious about using `render()` because when the object is going to be larger it is gonna re-render the canvas. Anyways, this was the correct fix to update the canvas after updating color.

Then I moved to MediaWiki integration in the project. The [requested feature](https://github.com/BRL-CAD/OGV-meteor/issues/59) was to add oAuth of MediaWiki to the OGV. The idea was to give users the ability to log in with the MediaWiki account of the users linked to the MediaWiki application they have registered. I found the MediaWiki OAuth documentation a bit confusing. Nevertheless, I followed the docs and tried implementing OAuth in the application. To reduce the complexity of the task and understand how things are working; I set up a new Meteor project and tried implementing the oAuth in the new project. This approach helped me to keep the complexity of the project away from the task and focus on the task. This feature is still in progress and I hope I'll complete this one by the end of this week.

I started the improvement of Documentation of the project side by side. In my one of the previous task, I moved the config of the email server to `settings.json` in this [PR](https://github.com/BRL-CAD/OGV-meteor/pull/106). After this change, it was required to set up SMTP configuration before users can use the application. This instruction was missing in the README file. I added the instructions in the [PR](https://github.com/BRL-CAD/OGV-meteor/pull/115). This PR also targets resolving the issues [#92](https://github.com/BRL-CAD/OGV-meteor/issues/92) and [#87](https://github.com/BRL-CAD/OGV-meteor/issues/87).

That's all for weeks 7 and 8. In the next week, I'll complete the oAuth and Documentation task. Then I'll move the [auto height adjustment task](https://github.com/BRL-CAD/OGV-meteor/issues/66).