teleren/devto huggingface dataset:
Recursive XML parsing using ElementTree module in Python
Tags: python, xml, parsing, elementtree
Published: 2021-07-13 21:06:19

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8byvb39blrj4pvg8v4cb.jpg)
Working with files in python is not a difficult task.

Suppose you have the task of converting an xml file coming to you into a python dictionary. And then do some manipulation with it at your discretion.

How do you handle this task with as little code as possible? We are lazy, right?
By using recursion, of course.
Let's see how to do it without using any external libraries. Python has a nice [ElementTree XML API] ( https://docs.python.org/3/library/xml.etree.elementtree.html )

 
```python
import xml.etree.ElementTree as ET


def xml_to_dict_recursive(root):
    """
    Recursively walk through the root and turn it into a dict.
    :param root: <class 'xml.etree.ElementTree.Element'>
    :return: dict
    """
    for children in root.iter():
        if len(children) == 0:
            return {root.tag: root.text.strip()}
        else:
            return {root.tag: list(map(xml_to_dict_recursive, children))}


def convert_xml_file_to_dict(file):
    """Process the kml file and return the dictionary."""
    tree = ET.parse(file)
    root = tree.getroot()
    return xml_to_dict_recursive(root)


with open('note.xml') as file:
    xml_dict = convert_xml_file_to_dict(file)
```

Easier than leaving office on Friday! 
Python is a wonderful language for working with data.
Setting up Ottoman
Tags: node, javascript, database, couchbase
Published: 2021-07-13 21:01:27

Requirements: NodeJS/NPM, Docker, VS Code

1. Setup the database:

    docker pull couchbase:7.0.0-beta
    docker run -d --name cb7 -p 8091-8096:8091-8096 -p 11210-11211:11210-11211 couchbase:7.0.0-beta

2. Visit the locally running web admin at: localhost:8091
3. Setup New Cluster with name & password
4. Configure Disk, Memory, Services with at least: data, query, index services checked.
5. Add a bucket named `travel`


With the database now up and running, let's clone a NodeJS project with some sample files we can use to learn Ottoman:

    git clone https://github.com/httpJunkie/intro-to-ottoman-v2.git && cd intro-to-ottoman-v2 && npm install && code .

This will clone the NodeJS project, change directories into the project, install dependencies, and now VS Code will now be open.

With this in place we should be able to run the individual files one at at time:

    node createAirline.js

This should add documents to your travel bucket. Next we can run:

    node findAirline.js
    node findWithQueryBuilder.js

Now let's update that file:

    node updateAirline.js

You will notice a change in the document's callsign

This should give you a basic understanding of how to create an Ottoman project and get started!
Bracket notation Vs dot notation in JavaScript objects
Tags: javascript, webdev, beginners
Published: 2021-07-13 20:38:09

Hello Devs, in this article, I will walk you through the differences between using dot notation and bracket notation in JavaScript objects.

Consider the following object.

```

let animalsList = {
  cow:{
    legs: 4,
    sound: "moo",
  },
  cat:{
    legs: 4,
    sound: "meow",
  },
};

```

We can use both dot and bracket notation to access the properties. Make sure that you enclose the key within quotes, when you use bracket notation.

```

console.log(animalsList.cat); //{ legs: 4, sound: 'meow' }
console.log(animalsList["cat"]); //{ legs: 4, sound: 'meow' }

```

As you can see, dot notation has better readability, it is an advantage of using dot notation.

"*So, if we can use both dot notation and bracket notation to access object properties, and dot notation has better readability, why do we even have bracket notation?*", you might ask.

Let's say we have a function, and the key which we have to access is passed to the function as an argument.

```

function myFun(animal){
  console.log(animalsList.animal);
}

myFun("cow"); 

```

The above code will print `undefined`. 

When we use dot notation, JavaScript searches for the key with the exact name we used after the dot( animal, in our case). Since the animalsList doesn't have a property called "animal", undefined is printed.

Let's try bracket notation instead of dot notation.

```

function myFun(animal){
  console.log(animalsList[animal]);
}

myFun("cow");

```

The above code will work fine and print `{ legs: 4, sound: 'moo' }`, as "animal" will be replaced with the respective argument which was passed during function call.

To summarize, use bracket notation when you want to access property using variable, otherwise stick with dot notation.

I hope this article helped you. Want to connect with me? my DM is open on dev.to, you can connect with me on [twitter](https://twitter.com/SaranChakravar3).

Happy coding!
Shopping cart integration in React JS.
Published: 2021-07-13 20:30:33

Easy cart has got some updates.

Recently, I have been trying to work on a react js package for managing/integrating shopping carts. 

It’s maybe not a great idea of something that should be a package,  but it’s possibly a great step. 

You could check it out and tell me what you think.

https://www.npmjs.com/package/react-easy-cart
AI-Assisted Software Development Just Got Bigger – Welcome, Copilot!
Tags: ai, github, vscode, programming
Published: 2021-07-13 19:47:11

By by Dror Weiss, CEO of Tabnine

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n2ctnrkxyythd1jw2v8w.jpeg)
Artificial Intelligence is rapidly changing nearly all aspects of life and business, and software development is no exception. We started Tabnine with a single goal in mind, to put the power of AI in the hands of developers and teams. Our top priority since day one has been to help developers become better with intelligent tools that fit seamlessly into their workflow. The rapid adoption of Tabnine and the consistently enthusiastic feedback from developers has already made it clear that we’re onto something huge.

The announcement of GitHub Copilot marks a milestone for AI-Assisted Software Development in general and for Tabnine in particular. As pioneers in the AI-Assisted Software Development space, we’re excited to see giants like Microsoft, OpenAI, and GitHub recognize this incredible opportunity.

At Tabnine, we believe in putting the developer at the center, using AI as smart tooling that augments and assists developers, making them better. We will continue to prioritize making developers successful above anything else. In particular, we’ll invest in key factors that we believe make Tabnine so appealing to developers using all IDEs and programming languages:

- Accuracy and usability: We’re making Tabnine’s AI even stronger and our UX more streamlined. Our priority is to assist and accelerate development while keeping developers in full control, avoiding the heavy mental load of evaluating large code blocks with insufficient context. We optimize the user experience by favoring bite-size suggestions making sure that developers can make snap judgments about the relevance of the suggestions with minimal effort.

- Personalization – learning from you & your team: Uniquely, Tabnine learns the specific code patterns used by you and your team (locally and privately) and tailors code suggestions to your project. We will amplify our value for teams, helping them take team productivity and code consistency to the next level.

- Privacy & compliance: Recognizing that many professional developers cannot send code to query a cloud prediction service, Tabnine offers an unparalleled option for running the AI model locally on a developer’s machine (without sending code to the cloud). Moreover, we guarantee that Tabnine doesn’t learn from developer interactions to train the global model, keeping everything that Tabnine learns from you at your control and available only to authorized team members.

I am certain that AI will play an incredibly important role in modern software development. At Tabnine we’re proud to be a part of bringing this future to life and leveraging the amazing technology efficiently and responsibly for the benefit of developers and teams.
Binary Clock JS
Tags: javascript, node, canvas, binaryclock
Published: 2021-07-13 19:31:29

I have developed a library for generating binary clock on a `canvas` tag as well as on a `terminal` window

checkout and let me know your ideas

[Package Link](https://npmjs.com/package/binary-clock-js)
[Demo Link](https://anjnkmr.github.io/binary-clock-js/web/)

#### Screenshots
![Screenshot 1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/opg0aibsfbemqq38nrbf.png)
![Screenshot 2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yve8ff8eghmnbm7qkavy.png)
![Screenshot 3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nctjc3gd9sroa4eo0mwl.gif)
![Screenshot 4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mgpf6ji9s6bkhknjnowk.png)
How To Do Web Scraping Amazon With Scrapy

Published: 2021-07-13 19:15:09

Scrapy is one of the most accessible tools that you can use to scrape and also spider a website with effortless ease.

Today let's see how we can scrape Amazon to get reviews for let say the Apple Air pods.

Here is the URL we are going to scrape https://www.amazon.com/Apple-AirPods-Charging-Latest-Model/dp/B07PXGQC1Q?pf_rd_p=35490539-d10f-5014-aa29-827668c75392&pf_rd_r=6T723HNZTK1TCR53MSAG&pd_rd_wg=U5S97&ref_=pd_gw_ri&pd_rd_w=rFFcu&pd_rd_r=9ea5f81c-8328-4375-bf2c-874e4f045991#customerReviews

https://youtu.be/hy5D7XvJ5CY
How to do Web Scraping Yelp Using Scrapy

Published: 2021-07-13 19:14:20

Scrapy is one of the most accessible tools that you can use to scrape and also spider a website with effortless ease.

Today let's see how we can scrape Yelp to get restaurant phone numbers for let says the San Fransisco location.

Here is the URL we are going to scrape https://www.yelp.com/search?find_desc=Restaurants&find_loc=San Francisco, CA&ns=1

https://youtu.be/1DvFzMGQCX8
hello world
Published: 2021-07-13 19:10:47


Hi I'm Arfa and you can't imagine how I'm excited that finally, I write my first serious article in English.

These past days, I had lots of time to think about the future and this question of what I want to do in my career path. before I dive into the answer and share my plan with you, let me tell you a little about myself

I'm 24, and a couple of months later, I'll graduate from university. I studied computer engineering at university, and about two years ago, I 'v entered the industry as a frontend developer.

just a couple of months ago, i quit my job to focus on creating content 

now I'm here
What's your go to state management library these days?
Tags: discuss, react
Published: 2021-07-13 19:08:32

We use [Preact](https://preactjs.com/) at [Forem](https://forem.com), the software that powers dev.to, but we do not use a state management library, just good old component state.

The last state management library I used was Redux back in Fall of 2018. If you require a state management library for your project, I'm curious which one do you use? [Zustand](https://github.com/pmndrs/zustand), [Redux](https://redux.js.org/), [Recoil](https://recoiljs.org/) etc. or is it something more like [React Query](https://github.com/tannerlinsley/react-query) these days?

Also, what do you like/dislike about the state management library you use?

Go!

Photo by <a href="https://unsplash.com/@alfonsmc10?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Alfons Morales</a> on <a href="https://unsplash.com/s/photos/management-library?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
Post #3 : Not all is coding
Tags: weeklyretro, python, opensource, gsoc
Published: 2021-07-13 19:00:07

Hi again! This is my third blog post check out the previos. Also, it is the beginning of the 5th week of the GSoC, that is, the midpoint of my internship, the time passed so fast and it has been a great experience.

During the last week, I was mainly working on two things:

### Reorganize my second milestone.

Since in my initial proposal, I established my second milestone using the component raw::HTML of Sphinx and I would create HTML forms to explain in the course PyZombis how MVC works, however, the Brython module was implemented by one of my teammates and now I can implement the lessons of MVC using it. With this module, we can implement and expand lessons and the whole course in general. You can check the new issues that were created here in my project on GitHub.

### Code review of teammates' PR's

Not all is coding, in fact, I can sure that most of the time is the second thing that you do during a project, so in this sense make code reviews is a good practice since this maintains order at work, however, not only is code review valuable for this purpose, we use a git-flow from the beginning of the project and an important step is the process of code review each other.

These were my main activities and luckily I didn't have any struggle, however, I had to read the syntaxis and documentation of Brython, because I had to do it if I wanted to update my milestone correctly. This week I am going to work on my first set of issues in order to achieve my goals before finishing the third sprint. In addition, I am going to make the first review of my mentors, the required requirement by the GSoC. With nothing more to report, as Truman said...

<img src="https://media.giphy.com/media/uOFCju3KRFxwxScVfm/giphy.gif" alt="See you Truma" />
Optional Chaining Operator (?.) - JavaScript 
Tags: javascript
Published: 2021-07-13 18:53:17

Topics covered:
###### 1- Intro
###### 2- Optional Chaining with Functions
###### 3- Optional Chaining with Expressions
###### 4- Optional Chaining with Arrays
###### 5- With Nullish Operator


## 1- Intro
Optional chaining operator **?.** loves you to read the value of within objects / nested objects with safety.

**?.** is similar to **.** except if the property in a object does not exist while accessing, it will return **undefined** instead of error/ breaking the program. This means you can explore The object with the carefree mind whether the property exists or not, thus making your code more solid.

```javascript
const person = {
    name: 'John',
    dog: {
        name: 'toto'
    }
}

const catName = person.cat.name  // error
const catName = person.cat?.name  // error-free line (undefined)
```
###### Safety handling with & without Optional Chaining
 ```javascript
//without optional chaining 
const catName = person.cat ? person.cat.name : undefined 

//without optional chaining 
const catName = person.cat?.name 
```

Handling safety in deeper objects destroys the code readability

## 2- Optional Chaining with function call
Wooaahh! You can also call function with the peace of mind while digging in objects
```javascript
const person = {
    name: 'John',
    vehicle: {
        year: 2012,
        drive(){
            return "I am driving"
        }
    }
}

const catName = person.vehicle?.drive?.()
```
## 3- Optional Chaining with property accessors (bracket notation)
Optional chaining operator while accessing the object values using bracket

```javascript
const person = {
    name: 'John',
    dog: {
        name: 'toto'
    }
}

const catName = person.['dog']?.['name']
```

## 4- Optional Chaining with Arrays
You can use optional chaining with array too while accessing its elements
```javascript
let arrayItem = arr?.[42];
```

## 5- With Nullish Operator
You can set the default value instead of returning undefined
 ```javascript
const person = {
    name: 'John',
    dog: {
        name: 'toto'
    }
}

const catName = person.cat?.name  ?? 'Maani'
console.log(catName) //Maani 
```
🧩 What Is an API? How APIs Work (for Non-Developers)
Published: 2021-07-13 18:43:20

#### 💡 An #API is an intermediary piece of #code that allows pieces of #software to communicate with each other. APIs can speed the #development of software — here’s how.

### <br>
An application programming interface (API) is a piece of code that acts as an intermediary between two different pieces of software and enables them to communicate with each other. Or in other words, it’s a user interface for software instead of a person.

Software developers have used APIs to integrate software for decades (for example, developing an application for operating systems like Microsoft Windows requires an API). However, APIs are [quickly becoming the cornerstone of the software and hardware markets](https://www.ibm.com/downloads/cas/XG8RYO63) because of the ways they can speed up the development of cloud-based technologies and help businesses provide better customer experiences.

Here’s how APIs work in simple terms, as well as how businesses could stand to benefit from using them in the software development process.

![How APIs Work](https://images.ctfassets.net/23aumh6u8s0i/1hLQoWjegBsHbP6vt4gPkq/8218f9cda487106ab0aa43a42457a06e/value_of_api-first-separator)

## How APIs Work (in Plain English)

An API works similarly to how a waiter or waitress acts as an intermediary between the kitchen and customer in a restaurant. When a customer visits a restaurant and places an order, the waiter (our API) translates and relays the order from the customer to the kitchen (the services that the customer wants to access). Then, the kitchen prepares the meal, and the waiter delivers it to the customer as requested.

Similarly, when you visit the website of a SaaS product and log in via a social media account, an API relays your request to the social network of your choosing, verifies your identity, and then returns that verification to the backend services you’re trying to access.

![The Benefits of APIs](https://images.ctfassets.net/23aumh6u8s0i/2gvmGULx8hXYoEby3ICkHn/5f781a17d50a0b96499504473e06e97f/api_01.png)

This process is beneficial for both you and the web app you’re trying to access because it simplifies the process — you don’t need to navigate the inner workings of a restaurant kitchen to get a hot meal, and the kitchen staff doesn’t have to take your order while also trying to cook.

## The Benefits of APIs (and the API Economy)

[Read more...](https://auth0.com/blog/what-is-an-api-how-apis-work-for-non-developers/?utm_source=content_synd&utm_medium=sc&utm_campaign=api)
Fading an element using only Javascript
Tags: javascript, beginners, animation
Published: 2021-07-13 18:11:08

I saw a post on S/O looking for a pure Javascript solution to animation; then the body started talking about CSS. 🤷🏻‍♂️ I decided to write a pure Javascript solution anyway that serves as a miniature example of tweening values linearly using time.

*Example:* https://jsfiddle.net/nqfud4j0/

It's intentionally using _setInterval_ rather than _requestAnimationFrame_ to demonstrate the example's use of time + controlled framerate rather than a delta or 'fast as possible.' A good solution would abstract this logic into a tweening library that combines both RAF + intervals to manage latency between frames.

Here's the commented code:

```js
/**
 * Fade an HTMLElement to a specific value using style attributes
 * 
 * @param HTMLElement element
 * @param number toValue
 * @param number duration
 * @return void
 */
function fadeTo(element, toValue = 0, duration = 200) {
    // Store our element's current opacity 
    // (or default to 1 if null)
    const fromValue = parseFloat(element.style.opacity) || 1;

    // Mark the start time (in ms). We use this to calculate
    // a ratio over time that applied to our supplied duration 
    // argument
    const startTime = Date.now();

    // Determines time (ms) between each frame. Sometimes you 
    // may not want a full 60 fps for performance reasons or 
    // aesthetic 
    const framerate = 1000 / 60; // 60fps
    
    // Store reference to interval (number) so we can clear 
    // it later
    let interval = setInterval(() => {
        const currentTime = Date.now();

        // This creates a normalized number between now vs when we
        // started and how far into our desired duration it goes
        const timeDiff = (currentTime - startTime) / duration;

        // Interpolate our values using the ratio from above
        const value = fromValue - (fromValue - toValue) * timeDiff;
        
        // If our ratio is >= 1, then we're done.. 
        // so stop processing
        if (timeDiff >= 1) {
            clearInterval(interval);
            interval = 0;
        }
        
        // Apply visual. Style attributes are strings.
        element.style.opacity = value.toString();
    }, framerate);
}


// Element reference
const element = document.querySelector('div');

// Fade in and out on click
element.addEventListener('click', e => {
    // Animates our element from current opacity (1.0) to 0.25 for 1000ms
    fadeTo(element, 0.25, 1000);
    
    // Waits 1s, then animates our element's opacity to 1.0 for 500ms
    setTimeout(() => {
        fadeTo(element, 1.0, 500);
    }, 1000);
});
```
Sixth-week blog post for PSF, GSoC 2021
Tags: gsoc
Published: 2021-07-13 17:47:54

Welcome to my sixth blog post about my experience in Google Summer of Code (GSoC) 2021.  

## What am I working on

Last week I finished working with my second milestone. This is what I did. There is a lecture in the project called *Hackeando con Pyhton* that is supposed to teach how to access an API and retrieve information using pyhton. Before last week, this lecture had only one exercise because others were eliminated due to the APIs they used (They have changed a lot and they are no longer public). Now, this lecture has six new exercises. 

You might know these two python modules to do HTTP requests: `urllib` and `requests`. For the new exercises I used both, mainly because I encountered a problem with Runestone and I had to change the python interpreter to solve this.

This week I will be working on my third milestone. 

## What have I struggled with this week?

I had trouble with the `dumps` method from the `json` module. For an exercise I needed to display on screen the json data retrieved from an API. In order to print it with indentation I passed the `indent` argument. Like this:
```
print(json.dumps(datos, indent=4))
```
However, it wasn't working. 

## What solutions have I found?

So, I was using `requests` module before this. I had to change the python interpreter to `brython` for some exercises, because in Brython `json.dumps` with the `indent` arg works just fine, but Brython doesn't support the `requests` module yet. This is why I changed to `urllib`. In the Brython's console, the output finally dislplayed nicely with indentation.
Windows 11 in React Js 💻 🌈
Tags: react, javascript, webdev, windows11
Published: 2021-07-13 17:46:49

Hello devs,

So this is a windows 11 clone that I made in React in the span of 7 days. Would you like to check out? I bet you wont be able to tell the difference in full screen mode.

Website: [win11.blueedge.me](http://win11.blueedge.me)
Github: [blueedgetechno/windows11](https://github.com/blueedgetechno/windows11)

![All Apps](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pqwvwq6tcc94ju61aoj6.png)

![Widgets](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8a06rq28d4r87s5npjrq.png)

![Snapping tool](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wj7tsst2owlwi2cv0oqa.png)

And this is just the tip of the iceberg, visit: [win11.blueedge.me](http://win11.blueedge.me)