teleren/devto huggingface dataset:
DIV Points at Other DIV
Tags: javascript, math
Published: 2021-08-11 21:28:33

{% codepen https://codepen.io/ZevanRosser/pen/vYmbaRj default-tab=js,result %}

Moving your mouse around the page, you’ll notice the red div always points at the black div.

I remember learning this from <a href="https://thefwa.com/cases/nooflat">nooflat.nu</a> by Jamie Macdonald back in 2001-2. I spun up my custom made experimental browser to take a look… also downloaded the source…

{% youtube weh1iyUW1Sw %}

Excuse the music I was too lazy to open iMovie and add something decent… Here is the key part of the source where I learned about atan2 for the first time 😀

```javascript
//SOURCE FOR EDUCATIONAL PURPOSES, ETC.
fscommand("allowscale","false")
 
 
// FUNCTION TO CALCULATE ANGLE FROM ONE OBJECT TO ANOTHER
function calcangle (me,targetclip) {
 
	// FIRST COMPUTE THE DISTANCES FROM THE MOVIECLIP THE FUNCTION
	// IS CALLED FROM  TO THE TARGET CLIP:
	var deltax = me._x-targetclip._x;
	var deltay = me._y-targetclip._y;
 
	// NEXT USE THESE DISTANCES TO CALCULATE THE ANGLE BETWEEN THEM:
	angle = Math.atan2(deltay, deltax);
 
	// FINALLY CONVERT THE ANGLE FROM RADIANS TO DEGREES AND THEN RETURN THE RESULT:
	angle /= (Math.pi/180);
	return angle;
}
```

Brings back great memories…

_See more stuff like this over @ [Snippet Zone](https://snippet.zone/)_
Python enumerate(): Simplify Looping With Counters
Tags: python
Published: 2021-08-11 21:27:39

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

Table of Contents
    • Iterating With for Loops in Python
    • Using Python’s enumerate()
    • Practicing With Python enumerate()
        ◦ Natural Count of Iterable Items
        ◦ Conditional Statements to Skip Items
    • Understanding Python enumerate()
    • Unpacking Arguments With enumerate()
    • Conclusion

A for loop in Python is often written as a loop over an iterable object. To access objects in the iterable, you don't require a counting variable. However, there are situations when you'll want a variable that changes with each loop iteration. You can use Python's enumerate() to get a counter and the value from an iterable at the same time, rather than generating and incrementing a variable yourself!

You'll learn how to:
    • Use enumerate() to get a counter in a loop
    • Apply enumerate() to display item counts
    • Use enumerate() with conditional statements
    • Implement your own equivalent function to enumerate()
    • Unpack values returned by enumerate()

__Python Iteration Using for Loops__
In Python, a for loop uses collection-based iteration.  This means that on each iteration, Python assigns the next item from an iterable to the loop variable, as in this example:

```python

values = ["a", "b", "c"]

for value in values:
  print(value)

```

OutPut
```python
a
b
c
```
August 2021 Releases – Horizon 28.0.2, Meridians 2021.1.3, 2020.1.11, 2019.1.22, 2018.1.31
Tags: ooh, cve, eol, horizon
Published: 2021-08-11 21:15:03

---
title: August 2021 Releases – Horizon 28.0.2, Meridians 2021.1.3, 2020.1.11, 2019.1.22, 2018.1.31
published: true
date: 2021-08-11 20:59:47 UTC
tags: OOH,CVE,EOL,Horizon
canonical_url: https://www.opennms.com/en/blog/2021-08-11-august-releases-horizon-28-0-2-meridians-2021-1-3-2020-1-11-2019-1-22-2018-1-31/?utm_source=rss&utm_medium=rss&utm_campaign=august-releases-horizon-28-0-2-meridians-2021-1-3-2020-1-11-2019-1-22-2018-1-31
---

In August, we released updates to all OpenNMS Meridian versions under active support, as well as an update to Horizon 28. This is the final Meridian 2018 release, as it has reached end-of-life.

### Horizon 28.0.2

Release 28.0.2 contains a bunch of bug fixes and enhancements, as well as some fixes for XSS issues and a Jetty CVE.

The codename for Horizon 28.0.2 is [Soundwave](https://wikipedia.org/wiki/Soundwave_%5C(Transformers%5C)).

For a high-level overview of what has changed in Horizon 28, see [What’s New in OpenNMS Horizon 28](https://docs.opennms.com/horizon/28.0.2/releasenotes/whatsnew.html).

### A Note About Meridian 2018 and End of Life

This release marks 3 years of Meridian 2018, initially launched in September of 2018, so it is officially at its end of life as a supported release.  
If you haven't already upgraded, consider this our strong encouragement to do so. :D

Additionally, here is the EOL schedule for the newer Meridian releases:

- Meridian 2019 will expire in October of 2022
- Meridian 2020 will expire in September of 2023
- Meridian 2021 will expire in April of 2024

### Meridian Point Releases

All Meridian releases this month contained security updates, so it is recommended that you upgrade.

Additionally, 2020.1.11 adds a fix for a potential OOM on the Minion if off-heap storage is enabled for forwarding.

On top of that, 2021.1.3 adds documentation fixes, and a performance enhancement to the node cache used when processing flows.

For a list of changes, see the release notes:

- [2018.1.31](https://meridian.opennms.com/releasenotes/2018/latest/#releasenotes-changelog-Meridian-2018.1.31) ([_Typhoon_](https://wikipedia.org/wiki/Typhoon))
- [2019.1.22](https://meridian.opennms.com/releasenotes/2019/latest/#releasenotes-changelog-Meridian-2019.1.22) ([_Ugarit_](https://wikipedia.org/wiki/HD_218566))
- [2020.1.11](https://meridian.opennms.com/releasenotes/2020/latest/#releasenotes-changelog-Meridian-2020.1.11) ([_Ayre_](https://wikipedia.org/wiki/Ayre_%5C(landform%5C)))
- [2021.1.3](https://docs.opennms.com/meridian/2021.1.3/releasenotes/changelog.html#releasenotes-changelog-Meridian-2021.1.3) ([_MESSENGER_](https://wikipedia.org/wiki/MESSENGER))
As principais diferenças entre os paradigmas de programação
Published: 2021-08-11 20:55:15

 > *"O computador ideal deve funcionar como um organismo vivo, isso é, cada célula se relaciona com outras a fim de alcançar um objetivo, mas cada uma funciona de forma autônoma. As células poderiam também reagrupar-se para resolver um outro problema ou desempenhar outras funções."* - Alan Kay, **fundador do conceito de orientação à objetos**.

Existem na computação diversas metodologias e modelos para se desenvolver um software de maneira eficaz. Ao longo do tempo essas formas de desenvolvimento foram naturalmente sendo introduzidas, exemplo: Programação de baixo nível, Programação linear, Programação estruturada, Programação Modular e a Programação Orientada à Objetos. 

A seguir algumas das principais diferenças entre elas:

| Paradigmas | Descrição   |
| ------- | -------- |
| Programação de baixo nível  | *Conhecida de maneira geral como linguagem de máquina, seu uso foi inicialmente atrelado por parte de engenheiros e tendo como principal característica um formato não natural de desenvolvimento para os desenvolvedores.*  |
| Programação linear  | *De certa forma uma evolução em relação ao modelo anterior, apresentando um modelo de desenvolvimento mais natural e inteligível. Porém, esse paradigma apresenta ausência dos principais recursos utilizados atualmente como desvios e rotinas. E, de certa forma, sua estrutura aparenta ser semelhante à uma lista de compras tendo como característica um escrita de código de cima para baixo sem uso de recursos de desvios.*     |
| Programação estruturada  | *Com o advento da programação estruturada tivemos o acesso aos principais recursos hoje utilizados, foi com ela o surgimento das noções de desvios, rotinas e entre outros recursos de código. Contudo, com a complexidade cada vez maior dos sistemas houve-se a necessidade de modularizar esses trechos de código afim de deixá-los mais legíveis em virtude que na programação estruturada os dados globais eram todos dispostos sem modularidade. Ou seja, sem organização de trechos de códigos.*   |
| Programação Modular  | *Na programação modular tivemos a resolução do problema anterior acrescentando modularidade ao paradigma de programação, fazendo com que o programa do desenvolvedor tornar-se mais manutenível e organizado. Vale lembrar que esse modelo de programação foi rapidamente deixado de lado com o eventual surgimento da programação orientada à objetos.*  |
| Programação Orientada à Objetos   | *Um dos principais paradigmas de programação da atualidade. A programação orientada à objetos surgiu em decorrência da tentativa de aproximação do mundo real com o universo do desenvolvimento, trazendo conceitos importantes da biologia e matemática para formular um modelo de programação mais fácil de entender e organizado; Além de possuir vantagens como a confiabilidade, ser oportuno, manutenível, extensível, reutilizável e natural.*    |
👨‍🔧Deploy your React app on GitHub. [fixing routes problems]🔥
Tags: react, github, deploy, firstpost
Published: 2021-08-11 20:42:57

##Before we start.

I will be direct, there are a lot of information of how to deploy a react app on github using the gh-pages dependency, so i am going to give quickly instruccions of that. i will explain better the part that allows you to not have problems with routes.

##Intro

I needed do this post because of when i had this problem i didn't find any solution, every post were about deploying an app in the begining but no one fixed my problem with Routes. 
In react you can use(you should have to) react-router-dom. It's a dependency that allows you configure a router to have in your development. I found myself creating a react app with more than five routes when i decided to deploy this on github and this was the result:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fclllmibspfdx9apsob6.png)
Nothing happened, the web was in white for a long time. 

##what do you have to do?



- install gh -pages in the folder where is the repository.
- make sure you got node .js , npm and react-router-dom in the last versions.
- After having your repositorie commited you have to go the node dependencys in the top and write ```"homepage": "https//*yourname*.github.io/*deployname*"```
- in the same archive go to the "script" and at the beginning write ```pre-build:"npm run build" and build:"gh-pages -d build"```

At this point just left one more command to deploy your app but that doesn`t fix the route problem.

## the route problem

When you deploy your app on github you got to put your homepage with the deploy name, and this generate the white page that doesn`t load. So you have to make sure that your home route to the same name of your app. 
Tip: like your app is not finding the route '/' it will show you a 404 error page, so it is a good note to configure your 404 error page. In react-router-dom you can do it quickly whit this route'*'.

##let`s finish this

After do all , go to the folder repository and write 
``` npm run deploy```
and that`s all. you have to wait some minutes to this works.

### if this doesn`t work 

it could happen this does not work you, because in one of my deploys i had to add an extra pass that at these days i dont` know why i had to did it. 
After you write npx bla bla and create your react app it comes with default folders and files, one of them are App.
For some reason i had to put the routes on this file (App.jsx) and after that it worked. 

#### i hope this could help someone, if you have some question don`t doubt to make it.
Why I don't care if you disable JavaScript
Tags: javascript, a11y, browser, webdev
Published: 2021-08-11 20:28:48

This is highly subjective and argumentative. If you think different, please comment!

I love to develop highly interactive and complex apps - that run in the browser. I also think the browser is still the most important tool for accessing them. At least for now. And the next few years. Even on mobile.

If there would be no JavaScript, none of my apps would work. I think this is okay. I haven't lost anyone yet, just because it's a hard requirement to run the apps. I also don't see a valid use-case to disable JavaScript in the browser.

I am also a single person and I don't have the money to pay you any computation effort to render a page (SSR). Your browser can do that and it costs you nothing, compared to me. So I push this task to you in such small pieces that it feels all lightning fast (dynamic imports). Lighthouse is my witness. It also wouldn't work this way if JavaScript is disabled.

Search engines can't find my app's deeper content. That's okay, it's only for members anyway. They still find my `index.html` and that's fine enough for indexing.

I don't see any reason to work towards removing JavaScript from my apps soon.
What is FastAPI ? Why it's so demanding.
Tags: python, career, computerscience, django
Published: 2021-08-11 20:09:11

Hello guys, In this Article I'll tell you something about the python new web API framework - FastAPi Framework.

# What is FastAPI ?

![logo-teal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0x0p2bkh6q2mquth89vk.png)
 
FastAPI is a new python web framework, FastAPI is modern and very fast, high-performance. FastAPI is used for building web applications and API's with Python and FastAPI was released in 2018 and FastAPI mainly used for making the data science applications as well as ecommerce. FastAPI enables the developers to use REST API interface and use many functions to implement them into applications, developers uses FastAPI to create login/Signup, authenticate and create accounts etc.

# Why it's so demanding.
FastAPI has a great future guys, companies uses this because it's very fast and highly securable and it has many feature like security and authentication, Dependency Injection, Unlimited plugins and etc, many big giants tech companies already using this framework for their data science applications and web applications, there are many companies like Microsoft and Netflix, Uber etc. Even my company use this framework, It's only 3 years old framework and it's already in trend, maybe this framework create thousands of jobs in future.

#### FastAPI documentation 

https://fastapi.tiangolo.com/
 
#### Youtube Channels and Playlists for fastAPI 

1) Bitfumes 
https://www.youtube.com/watch?v=7t2alSnE2-I

2) IsaiahT Tech
Complete Playlist 
https://www.youtube.com/watch?v=tKL6wEqbyNs&list=PLShTCj6cbon9gK9AbDSxZbas1F6b6C_Mx

3) Very Academy
https://www.youtube.com/watch?v=NH4VZaP3_9s&t=242s

```
for more visit:- https://webdevcodes.com/python/what-is-fastapi-why-its-so-demanding/
```

Find me on Linkedin
```
https://www.linkedin.com/in/shivamrohillaa/
```


Thank You
Shivam Rohilla | Python Developer
An interesting JS question
Tags: javascript, question
Published: 2021-08-11 19:54:43

You are refactoring a function `renderView` which takes an item as parameter. In `renderView` there is a `setState` function which will trigger a render process.

```js
let renderView = (item) => {
    // some logic play with item
    setState()
}
```

Currently, function `renderView` was called too many times in a business action, thus `setState` was triggered again and again. You want to reduce the trigger counts to improve the performance. You are trying to make function `renderView` takes an array of items, so you can call `setState` only once after deal with all the objects.

After some attempts, you found that the `renderView` was appeared every where in the code base, it's error-prone to change the parameter of `renderView` and every logic called it, you shouldn't touch those legacy code and of course you will never want to do it. 

You decide to hack `renderView` to make it trigger only once while called several times in a row. But how?
CSS Charts/Graphs
Tags: beginners, webdev, css, codepen
Published: 2021-08-11 19:25:09

I have recently learnt how to add graphs and charts to websites. It helps to keep your data representation organized, presentable and easy to comprehend. One of the easiest method of doing so is through **Google Charts**.


_To get started_-
1. Visit https://developers.google.com/chart.
2. Navigate to guide section and then select chart gallery. You will be presented with different kinds of maps to choose from.
3. Choose the map of your choice and head into it's code description.
4. Copy the script section to the head section of your HTML. Also copy the div in the body section of the code description to specify the dimensions.
5. That's it, you have now added a graph to your HTML file. You can customize it by changing the parameters and the content of the graph to suit your needs. 
Example-
 
{% codepen https://codepen.io/Anjali404/pen/rNmPvVw %}

You can also modify it to 3D, rotating, donut and can add various other properties. 
Hope it helps!

![pic](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cibm8cso68fbsgkplcpe.gif)
Google's Machine Learning Crash Course - Introduction to ML
Tags: machinelearning, python, programming
Published: 2021-08-11 18:55:08

Here is the summary of Video 1: Introduction to ML

At the end of the article, you will be able to:

    Recognize the practical benefits of mastering machine learning
    Understand the philosophy behind machine learning

Machine learning is a valuable tool that help software engineers make sense of their data. First, it gives you a tool to reduce the time you spend programming. Second, it will allow you to customize your products, making them better for specific groups of people. And third, machine learning lets you solve problems that you, as a programmer, have no idea how to do by hand.

As a human being, I have the ability to recognize my friends' faces and understand their speech, but I do all of this subconsciously so if you asked me to write down a program to do it, I'd be completely baffled. But these are tasks that machine learning algorithms do very well; I don't need to tell the algorithm what to do, I only need to show the algorithm lots of examples, and from that the task can be solved. In a nutshell, Machine learning changes the way you think about a problem.
Python Bootcamp Experience!!!
Tags: python, flask, database, datascienceandmachinelearning
Published: 2021-08-11 18:38:43

###Introduction
A **month** back, I was accepted into Lux Academy and Data Science East Africa Python Boot Camp. It was heart felt and I indeed didn't take the opportunity for granted. From the time the boot camp started, a lot of learning has been taking place first of all being exposed to different tech stacks and getting used to them starting from the python programming language, different projects, assignments that we were given, last but not least the Flask framework for backend web development together with integration with the database.


###What we last learnt
We will have a discussion about the Flask framework for backend web development with the python programming language.
Flask is a micro web framework written in Python. 
#####What is Web Framework?
Web Application Framework or simply Web Framework represents a collection of libraries and modules that enables a web application developer to write applications without having to bother about low-level details such as protocols, thread management etc.

It is classified as a microframework because it does not require particular tools or libraries. It doesn't have a database abstraction layer, form validation, or any other components where pre-existing third-party libraries provide common functions. However, Flask supports extensions that can add application features as if they were implemented in Flask itself.

We'll take a basic example of how it is used;
```
from flask import Flask
app = Flask(__name__)

@app.route("/")
def hello() -> str:
    return "Hello World"


if __name__ == "__main__":
    app.run(debug=False)
```
You can check out my flask-application on git-hub [github](https://github.com/rukundob451/flask-application)

###Being grateful
It is with this that I would like to surely thank and appreciate Lux Academy and Data Science East Africa for the commitment for the lectures that have indeed enabled us understand these concepts and they will indeed not be put to waste with the wide range of fields I have gotten to about where they are applicable.
Web development using Python.
Tags: webdev, beginners, python, codenewbie
Published: 2021-08-11 18:27:49

## Contents
* [Definition](#chapter-1)
* [Introduction](#intro)
* [Summary](#summary)

###Definition <a name="chapter-1"></a>
You can develop for the web using **Django**, **fast-api** && **flask**
Flask is a Python web-framework, it is a third party library used for web development.
Flask focuses on step-by-step web development.
It is light weight micro-web framework based on two libraries **werkzeug WSGI toolkit** && **Jinja2 templates**
### Setting up Flask
Before installation of flask, make sure you are in your virtual environment.
```python
pip install virualenv
#activating:Linux
env/bin/activate
#windows
cd env\Scripts\activate
```
When you are in your virtual env run:
```python
pip install flask
# or
pip3 install flask
```

###Introduction <a name='intro'></a>
All things set👍! now we create a hello world app.✨
```python
# import Flask class
from flask import Flask
#instantiate flask app obj
app = Flask(__name__)

# decorator function(routing)
@app.route('/')
def index():
    return 'Hello world!'


if __name__ == '__main__':
    app.run(debug=True)
```
Go ahead and type this in a text editor save as __app.py__
The condition checks if the code is a flask app .
```python
if __name__ == '__main__':
    app.run()
```

###Running a flask app.
type the following commands in terminal
```python
#first we set the flask_app variable 
# Linux
export FLASK_APP=app.run
#window
set FLASK_APP=app.run
# run it
flask run
```
Yaaay! 🎉 our hello world is live and running on: `http://127.0.0.1:5000`

### Creating a route
A route is a URL to a location in the browser.
Routes are created with the **route()** decorator, they handle requests for the flask app.
```python
@app.route('/')
def index():
    return 'Hello world!'
```
This opens the home page in our app.
####Rendering HTML from flask
To render html flask uses Jinja2 templating engine.
```python 
from flask import Flask, render_template

@app.route('/about')
def about():
    return render_template('about.html')
```
###Variable rules in Flask.
Variables create a dynamic URL route for a flask app, a variable section is marked with angle brackets `<variable_name>`.
The function receives the variable as a keyword argument, Optionally you can specify a converter for a variable `<converter:variable_name>`
```python
@app.route('/age/<int:num>')
def age(num):
    return f'<p>This Blog is {num} old.</p>'
```

### Summary <a name='summary'></a>
In this article we have gone through web development with Flask a python web-framework.
- Installation
- Hello world application.
- Dynamic URLS.

In the next article, I'll write on connecting Flask to a database.

Thank you for reading, I'd really love your feedback or guidance.
Be cool, Keep coding!