teleren/devto huggingface dataset:
Day 24 - 29 and RIP of 100DaysOfCode
Published: 2021-05-10 15:53:29

I started my first 100 days of code journey on *12 April 2021* and for the first 25 days, I did pretty well actually.

<img src="https://c.tenor.com/ztAdLRcoomAAAAAM/far-too-long-richard-williams.gif" alt="so long ago"/>

React was the hero for the first two weeks followed by react-router and flux but then a couple of days back, I broke my streak and since then I've been feeling pretty bad about it.

I don't wanna trick myself so I accepted my failure and I started a new 100 days of code challenge today.

But since I have faced a couple of setbacks, now I am familiar with what may happen and how can I improve.

<img src="https://c.tenor.com/fC4zIRrfBXoAAAAM/yes-yeah.gif" alt="this is power"/>

Here is one more thing that I thought, rather than posting articles daily, which is actually great but sometimes it's overwhelming. I can share my journey with everyone after a couple of days or whenever I'll feel like I have something worth sharing.
And I made a [Twitter account](https://twitter.com/atulit64249523) to share my journey. If anyone like to keep me in check pls do.

🌟Bonus: Follow this. Believe me, you will definitely thank me later. 
* [Study Group](https://discord.gg/hw3yETgZ)
* [Python Server](https://discord.gg/cNynTub8)


These are the best places to get help because the community is pretty strong.

In the study group, you have rooms where you actually have to keep your desk cam on if you don't wanna get kicked out. It gives a class-like experience, just without a teachers. 

There is a bot that keeps a check on all the present members and they have to post their hourly goals as well, if they don't wanna get kicked out. 

They seem like worth sharing cause they have been pretty helpful for me.

Thanks for being here.
Hope I may finish this one. I will. 

Have a wonderful day.😀

Check out the cool cover image right [here](http://www.vibesnscribes.com/2019/09/22/the-100-days-of-code-journey/).
It's an excellent laptop wallpaper for sure.
Implementing role-based access control (RBAC) in Flask
Tags: flask, python, programming, rbac
Published: 2021-05-10 15:38:58

Many frameworks and libraries provide plug-ins for common authorization patterns like roles, but either don't provide enough of a model to be helpful or are so rigid that you need to migrate away from them down the line.

We just released a library that provides a configuration-based approach to adding role-based access control (RBAC) to your application. The new Oso Roles library, with support for Python + Flask, speeds up the time it takes to build fine-grained permissions using roles and related patterns. The library includes:

- Role configuration
- Data management
- Enforcement
- End-user configuration
- Last-mile customizations

The library is in early access. Here are relevant links:

Documentation showing how to use the library to add roles to a Flask app with GitClub, our best practice example app: http://docs.osohq.com/python/guides/new-roles.html

GitClub source code: https://github.com/osohq/gitclub-sqlalchemy-flask-react
Head-up Display
Tags: software, growth, devops
Published: 2021-05-10 15:38:11

High penetration of head-up displays in aerospace & defense industry and fall in price of HUD technology are key factors driving growth of the market

Head-up displays are also transforming the retail sector, especially in small stores where there is limited space to showcase all the products. For example, car dealership does not have to showcase latest car models in store, but customers can view them virtually, configure them according to their requirement, and get an idea of their purchase.

Key players in the market include Nippon Seiki Co., Ltd., Denso Corporation, BAE Systems, Bosch, Pioneer Corporation, Garmin Ltd., Continental AG, Yazaki, Visteon Corporation, and Panasonic Corporation.

To get leading market solutions, visit the link below: https://www.emergenresearch.com/industry-report/head-up-display-market
JAVA EXCEPTIONS
Published: 2021-05-10 15:34:03

If a Java program encounters an error , normally it will stop and generate an error message . The technical term of this is called an Exception . It is normal that a programmer make coding errors . Exceptions disrupts the normal flow of a program .

TYPES OF EXCEPTIONS:
1 . Checked exception
2 . Unchecked exception
3 . Error

EXCEPTION HANDLING
It is the process of handling runtime exceptions such as ArrayIndexOutOfBound , IOException , ArithmeticException etc .

EXCEPTION KEYWORDS
1 . try-catch block :
syntax: try{
}catch(Exception_name ref){}

2 . try-finally block :
syntax : try{
}finally{}

3 . throw :
syntax : throw exception;

4 . throws :
syntax : return_type method() throws Exception_name

EXAMPLE PROGRAM :
class Main{
public static void main(Strin args[]){
try{
int a =5/0;}
catch(ArithmeticException e){
System.out,println("ArithmeticException--" + e.getMessage());}
finally{
System.out.println("This is Finally block");}
}}

OUTPUT : ArithmeticException -- /by zero
This is Finally block

EXPLANATION :In the above program , a number is divided by '0' , so it gives ArithemticException(divide by zero) , which is caught by catch block the followed by finally block
Guía para solucionar problemas de DataTables con Ajax y PHP
Tags: datatables, ajax, php
Published: 2021-09-16 12:12:06

---
title: Guía para solucionar problemas de DataTables con Ajax y PHP
published: true
date: 2021-05-10 15:17:00 UTC
tags: DataTables, Ajax, PHP
canonical_url: https://academy.leewayweb.com/guia-para-solucionar-problemas-de-datatables-con-ajax-y-php/
---

Usá DataTables te dijeron. «Es el mejor plugin que vas a encontrar para mostrar datos en forma resumida» «Es súper fácil de usar» Si… claro. Armar la tabla no es muy complicado, es cierto, pero cuando le empezabas a encontrar el gustito… las cosas se complicaron. ¿Y ahora? ¿¿Qué pasa que no se cargan los […]

La entrada [Guía para solucionar problemas de DataTables con Ajax y PHP](https://academy.leewayweb.com/guia-para-solucionar-problemas-de-datatables-con-ajax-y-php/) se publicó primero en [Leeway Academy](https://academy.leewayweb.com).
How to Create an AR Travel Experience in 15 Minutes or Less [Tutorial]
Tags: tutorial, unity3d, showdev, augmentedreality
Published: 2021-05-10 15:14:53

Looking to create your own AR travel experience where you can learn about landmarks and virtually explore exotic locations? This AR traveling demo created with Unity, AR Foundation, and echoAR is a great place to start. The full demo can also be found on echoAR’s [GitHub](https://github.com/echoARxyz/Unity-ARFoundation-echoAR-demo-Travel).

![1.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1620659354972/ZX1MGx-VJ.png)

# Register

If you don’t have an echoAR API key yet, make sure to register for FREE at [echoAR](https://console.echoar.xyz/#/auth/register).

# Setup

* Create a new Unity project.
* Clone the [Unity-ARFoundation-echoAR](https://github.com/echoARxyz/Unity-ARFoundation-echoAR) sample code.
* Clone this repository for prefabs,scenes and custom scripts.
* Follow the instructions on our [documentation page](https://docs.echoar.xyz/unity/adding-ar-capabilities) to [set your API key](https://docs.echoar.xyz/unity/adding-ar-capabilities#3-set-you-api-key).
* Set your echoAR API key in the echoAR prefab
* Add the models from the models folder to the echoAR console
* For each model, add the corresponding metadata from the metadata folder on the echoAR console
*  Overwrite the existing echoAR/CustomBehaviour.cs script with the new *CustomBehaviour.cs* file.

# Run

* [Build and run the AR application](https://docs.echoar.xyz/unity/adding-ar-capabilities#4-build-and-run-the-ar-application).

# Learn more

Refer to our [documentation](https://docs.echoar.xyz/unity/) to learn more about how to use Unity, AR Foundation, and echoAR.

# Support

Feel free to reach out at support@echoAR.xyz or join our [support channel on Slack](https://join.slack.com/t/echoar/shared_invite/enQtNTg4NjI5NjM3OTc1LWU1M2M2MTNlNTM3NGY1YTUxYmY3ZDNjNTc3YjA5M2QyNGZiOTgzMjVmZWZmZmFjNGJjYTcxZjhhNzk3YjNhNjE).

# Screenshots

![1.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1620659559013/ZgrGmvpQd.png)

*(1 — Left ) You will see a blue indicator that shows the surface your camera is pointing at. Tap anywhere on the screen to place the buildings. (2 — Center) You will see the buildings after tapping the screen. The indicator will be gone, and you can view description by tapping any object. (3 — Right) The description then will be shown above the building. Tap again to hide.
echoAR (http://www.echoAR.xyz; Techstars ’19) is a cloud platform for augmented reality (AR) and virtual reality (VR) that provides tools and server-side infrastructure to help developers & companies quickly build and deploy AR/VR apps and experiences.*

*****

> echoAR (http://www.echoAR.xyz; Techstars ’19) is a cloud platform for augmented reality (AR) and virtual reality (VR) that provides tools and server-side infrastructure to help developers & companies quickly build and deploy AR/VR apps and experiences.


![5.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1620659596886/g43fH4OrqC.png)
Frontend interview - Questions I was asked
Tags: interview, javascript, frontend, questions
Published: 2021-05-10 15:13:32

These are the questions I was asked In a frontend interview for a ReactJS position.  

If you ask me to clone Netflix UI I will do It in shortest possible time, but if you ask me evaluate and string expression without `eval()`. I might not able to do this. 

Hope you guys will find these questions useful. 

`BTW I failed miserably 👶👶` because I was desperate to get the job and It leads to nervousness which killed my performance. 
### **I will say** 
 
>Be eager but never be desperate.
 


```javascript
let result = [{x: 1}, {x: 2}, {x: 3}];
```
reduce this array and result should be 6; You are suggested to use arr.reduce() function. 

****************************************************
```javascript
Input:
people = [
  { name: 'Alice', age: 21, gender: "female" },
  { name: 'Max', age: 20, gender: "male" },
  { name: 'Jane', age: 20, gender: "female" }
  { name: 'Jon', age: 21, gender: "male" },
  { name: 'Alex', age: 20, gender: "male" }
]

output: 
{
 male: [
  { name: 'Max', age: 20, },
  { name: 'Jon', age: 21, },
  { name: 'Alex', age: 20, }
],
female: [
 { name: 'Alice', age: 21 },
{ name: 'Jane', age: 20 }
]
}
```
********************************************************
```javascript
Input: 
let value = "5+8=x";

Output should be 13 (type should be number);
```
********************************************************

comment section is yours fellows. 🙏🙏🙏

Thanks.
About the EsoList
Tags: esolang, esoteric
Published: 2021-05-10 14:25:06

I am opening an article to celebrate esoteric languages. It is called the [EsoList](https://dev.to/javacode7/the-esolist-3dk3). It is going to contain esoteric languages for you to comment on and discuss. You can submit an esolang (provided it is on github and has a dev.to article) to the list by simply commenting on the [EsoList Submission article](https://dev.to/javacode7/esolist-submission-40jm) with the name of your esolang, its dev article and its github page as well as a short description (you may also include any other information).
Should I make a Git tutorial
Tags: git, codenewbie, github, help
Published: 2021-05-10 14:24:26

_Should I make a Git tutorial? All the other tutorials seem really abstract with no real example projects._

Or, more accurately, _I just recently read through the Pro Git book and now I feel like I have superpowers and I thought I could build a tutorial but I am a bit low on motivation so motivate me_

:sweat_smile:
Feminines Ommi Theme für Thrive Theme Builder
Tags: wordpress, thrivethemebuilder, thrivethemes, wordpressthemes
Published: 2021-05-11 12:36:21

---
title: Feminines Ommi Theme für Thrive Theme Builder
published: true
date: 2021-05-10 14:18:08 UTC
tags: Wordpress,thrivethemebuilder,ThriveThemes,WordPressThemes
canonical_url: https://j0e.org/ommi-theme/
---

![Ommi Theme für den Thrive Theme Builder](https://j0e.org/wp-content/uploads/2021/05/ommi-theme.png)

Das Ommi Theme ist das zweite Design-Template für den Thrive Theme Builder!

Das Theme ist vollständig responsive und kann auf allen Geräten, vom Smartphone bis zum Desktop-Computer, angezeigt werden. Ommi enthält den Thrive Content Builder, mit dem du ohne Programmierkenntnisse tolle Seiten auf deiner Website erstellen kannst.
Das Ommi Theme kann kostenlos auf der Thrive Themes Website heruntergeladen werden, wenn du ein Mitglied bist.

[Feminines Ommi Theme für Thrive Theme Builder](https://j0e.org/ommi-theme/)
Copying Array Items Using slice()
Tags: javascript, devops, tutorial, beginners
Published: 2021-05-10 14:10:58

* The next method we will cover is `slice()`. Rather than modifying an array, `slice()` copies or extracts a given number of elements to a new array, leaving the array it is called upon untouched. `slice()` takes only 2 parameters — the first is the index at which to begin extraction, and the second is the index at which to stop extraction (extraction will occur up to, but not including the element at this index). 
* Ex:
```
function forecast(arr) {
 let todaysWeather = arr.slice(2, 4)
 return todaysWeather;
}

console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms'])); will display ['warm', 'sunny']
```
* We defined a function, `forecast`, that takes an array as an argument. I modified the function using `slice()` to extract information from the argument array and return a new array that contains the string elements warm and sunny. 
* In effect, we have created a new array by extracting elements from an existing array.
* Another Ex:
```
let weatherConditions = ['rain', 'snow', 'sleet', 'hail', 'clear'];

let todaysWeather = weatherConditions.slice(1, 3);
```
* `todaysWeather` would have the value `['snow', 'sleet']`, while `weatherConditions` would still have `['rain', 'snow', 'sleet', 'hail', 'clear']`.
Generate QR Code In Javascript
Tags: javascript, webdev, node, design
Published: 2021-05-10 14:05:24

Hello everyone 👋, this is going to be a very short article where I will show how can we generate a QR Code for any content in JavaScript.

Obviously, I am not going to implement everything from scratch and why should one do that when we have a plethora of useful libraries in JavaScript.

I came across this awesome lightweight library or you can say a simple script [qrcodejs](https://github.com/davidshimjs/qrcodejs). It is very easy to use and is reliable too.

### Implementation

- Download this zip file: [qrcodejs](https://github.com/davidshimjs/qrcodejs/zipball/master)

- Extract it.

- Now you can use the `qrcode.js` and `qrcode.min.js` file in your project.

### Code

Include the `qrcode.js` file in your HTML file.

```HTML
...
<script src="./qrcode.js" defer></script>
...
```

Give an `id` to the `div` where you want to show the generated QR Code. Here I have used `"qrcode"` as my `id`.

```HTML
...
<div id="qrcode"></div>
...
```

Now we will create an object from the `QRCode` function. Need to pass the `id` of the output `div` which is `"qrcode"` in this case.

```javascript
var QR_CODE = new QRCode("qrcode", {
  width: 220,
  height: 220,
  colorDark: "#000000",
  colorLight: "#ffffff",
  correctLevel: QRCode.CorrectLevel.H,
});
```

> `correctLevel`: `L` for low, `M` for medium, `H` for high.

Generate QRCode by calling the `makeCode` method of the QRCode object, which expects the `data` as its argument.

```javascript
QR_CODE.makeCode("https://buymeacoffee.com/bibekkakati");
```
> It will automatically insert the generated QRCode in the `div` whose `id` has been provided while creating the QRCode object.

### Example✨

Check out the GitHub [Repo](https://github.com/bibekkakati/qr-gen).

Try it out here: [Live](https://bibekkakati.github.io/qr-gen/).

![Demo Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ajtycj7dkf5g364isx0i.jpeg)

*Screenshot is taken from Google Lens while scanning.*

---

> Originally published on [blog.bibekkakati.me](https://blog.bibekkakati.me/generate-qr-code-in-javascript)

---


Thank you for reading 🙏

If you enjoyed this article or found it helpful, give it a thumbs-up 👍

Feel free to connect 👋

[Twitter](https://twitter.com/kakatibibek) | [Instagram](https://instagram.com/bibekkakati) | [LinkedIn](https://linkedin.com/in/bibekkakati)


---

If you like my work and want to support it, you can do it here. I will really appreciate it.

<a href="https://www.buymeacoffee.com/bibekkakati">
<img src="https://img.buymeacoffee.com/button-api/?text=Buy me a coffee&emoji=&slug=bibekkakati&button_colour=FFDD00&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=ffffff">
</a>
Why Every Programmer Should Learn How To Scrape The Web
Published: 2021-05-10 13:54:28

1. It gives you an understanding of the evolution of the web

As a web crawler, the web is a scary place. It is like landing a spaceship on an asteroid. It is because the original web browsers like Internet Explorer were very lenient on poorly written HTML, so many of the pattern matching techniques keep failing. You learn to appreciate technologies like Beautiful Soup to help tame rouge HTML.

2. It helps you understand web servers.

Web servers use several ‘tells’ to detect that you are not human. It is a bit like a game of Cat and Mouse.

3. It might teach you a new language

If you want pure power, sooner or later, you will realize the power of Scrapy, especially when combined with Scrapyd. A long, long time ago, I had to learn Python to get all the advantages Scrapy gives me, which is easily offset by the disadvantages of having to learn something new.

4. It tests your ability to think out of the box

Each website is different, has AJAX-based content; pagination comes in all shapes and sizes. You have to ‘crack’ each website separately many times as there is no one size fits all.

5. It challenges you to work at scale

What works when you are in the development mode very often crash lands when you run it at scale. To use concurrency, scale spiders, handle large amounts of data, maximize the throughput of a server or several servers, use rotating proxies to overcome IP blocks like Proxies API. Coding is only the first step.

6. It allows you to tame the chaos

It is what most of your code does. You are trying to get data out of something that wasn’t built for your bots. Most of the time, it is not easy to domesticate them.

7. It teaches you to work with frameworks

Scrapy on Scrpayd along with file pipelines if you have to download images. CSS/XPath Selectors to make scraping more predictable. Rate limiting, session handling, and concurrency — You will learn all this by trial and error.

8. It teaches you the importance of creating checks and balances

Once you have deployed the code, a single rogue javascript might bring down your project. The website changes the HTML, and the code may no longer work. Your machine has no network, but if there is no check for this, you will end up with several thousand empty documents. You will learn to anticipate, put in checks and alerts to immediately know, and debug if there is something wrong in your workflow.

The author is the founder of Proxies API, a proxy rotation api service.
I made a Spotify web clone with React, Typescript and SCSS
Tags: react, typescript, redux, spotify
Published: 2021-05-10 14:02:54

Hello friend !
I made a spotify clone to test my skills.

Here is the app i made : [Spoty-like](https://spoty-like.netlify.app/)
And here is the source on github : [spotify-like-web](https://github.com/Bastiendmt/spotify-like-web)

## The goal
I made this project as close as I could to the real Spotify. My goal was to make my app indistinguishable from the real version. I've had to copy some css but it allowed me to understand how to do certain tricks and how complex the real app was.

The project features two pages : 
- Browsing featured playlists
- Browsing songs within a specific playlist

## The tech side 
### Typescript
On the tech side, I started it with JSX but mid-way through the project, I figured that it was a great occasion to train my typescript knowledge so I switched over and it was quite nice !
I wish I started with TS since it brings auto-completion and it would have saved me some time. I would most likely use it again.

### SCSS
Before that I've never worked with a css preprocessor but at some point, I didn't felt like learning anything on the design part. I was copying most rules and it was kinda tedious to get things right. So I switched to SCSS which made my code a lot cleaner (cleaner HTML and more organized CSS).
I didn't used every feature of SCSS but nesting rules was really cool to do. 


### API
When starting this project I had access to a spotify API that fetched data without any authorization. I've had to setup a local proxy in order to use the API locally and allow CORS for my project.
With that setup, I wouldn't though of deploying my app because it required a proxy. It wasn't very elegant and kinda sad that no one would see my project.
That's when I digged towards spotify for devs and I found that I could fetch the data I needed by creating a project.
Each request requires a authentication token so I created a system that stores a token using cookies. If the token is expired or unset, the app fetches one automatically and uses it for the request.

### Player
As the the player used for sound, I did not user the one offered by [spotify](https://developer.spotify.com/documentation/web-playback-sdk/). Instead I used a library call [react-sound](https://github.com/leoasis/react-sound) which is fairly easy to use and works great. Since no login system is implemented, only a preview can be played.
The library allowed me to play / pause songs, adjust volume and time, basics functionalities.

### Redux
I used Redux to manage the store and have it set globally since most components are using the same data. I combined stores with one that contains data and one that contains the playing song and its state.


## Conclusion
I've had a great time building this app and I am proud that the app is as close as the real one and that it's simple to use and works great.
If you have any suggestion on how the app could be improved I would love to hear your recommendations !
Add Items with splice()
Published: 2021-05-10 14:01:36

* Remember in the last challenge we mentioned that `splice()` can take up to three parameters? Well, you can use the third parameter, comprised of one or more element(s), to add to the array. This can be incredibly useful for quickly switching out an element, or a set of elements, for another.
```
function numbers(arr) {
  arr.splice(3, 1, 13, 14);
  return arr;
}

console.log(numbers([10, 11, 12, 12, 15])); will display 
[ 10, 11, 12, 13, 14, 15 ]
```
* The second entry of `12` is removed, and we add 13 and 14 at the same index. 
* Here, we begin with an array of numbers. Then, we pass the following to `splice()`: The index at which to begin deleting elements (3), the number of elements to be deleted (1), and the remaining arguments (13, 14) will be inserted starting at that same index. Note: There can be any number of elements (separated by commas) of which can get inserted following the number of elements to be deleted.