teleren/devto huggingface dataset:
Some cool tricks in Java
Tags: java, codenewbie, tutorial, computerscience
Published: 2021-07-07 19:35:35

Java☝:: A most beautiful and powerful programming language👌.

as much as you'll deep dive into Java you'll learn something new.

Here are some Amazing and cool trick's - 

1-  

Do you know what will be the output of the below statement? 👇

System.out.println(0123); 
o/p = 83   but why?

Click on Below - 👇👇👇

https://www.javaoneworld.com/2020/05/why-output-of-012-is-10-and-0123-is-83.html

2- Java String

Concatenation - concat() Vs the + Operator 

concat() --

if want to concat str1 with str2 where str1 is null.

    str1 = null;
    str2 = "javaoneworld";

    str1.concat(str2);

    you'll get NullPointerException👎👎.

+ Operator --

if want to concat str1 with str2 where str1 is null.

    str1 = null;
    str2 = "javaoneworld";

    str1+str2;

    you'll not get NullPointerException instead you'll get some  output😅😀.

    o/p - nulljavaoneworld

Follow the below beautiful url for some more cool tricks.

    How to execute commented code? and more.

https://www.javaoneworld.com/2021/07/java-amazing-interesting-and-cool-tricks.html


Thanks a bunch for being here.
#stayhealthy
#takeCare
#stayCode
#programming
#coder
#code
#happycoding
Be a Part of the Next Technological Shift: Edge Computing!
Tags: api, iot, mobile
Published: 2021-07-07 19:35:07

---
title: Be a Part of the Next Technological Shift: Edge Computing!
published: true
description: Computing power is shifting to the edge.
tags: #api #iot #mobile
cover_image: https://alefedge.com/wp-content/uploads/2021/04/Edgenet_Infographic-1-1.jpg
---

## What is Edge Computing?
Consider where the computing power has been located throughout the years. 

In the 1950s, computers were housed in government, educational, and commercial laboratories. All computing work was done in these centralized locations. The next step was connecting to these mainframe computers through a terminal. These terminals had little computing power themselves, but allowed people to access the mainframe. Eventually personal computers came along, bringing computing power into individual homes. 

Computers were then connected to one another in private networks. Businesses had their own servers on location and shared drives where documents were stored and could only be write-accessed by a single computer at a time. These servers and shared drives were managed onsite. 

The internet was built by connecting these smaller networks together. Cloud computing came next. Instead of having a server in your closet, servers, storage, and more are enabled through the internet. In the cloud, you don't own your server and maintain it yourself, you rent a server from a cloud provider and control it  

Edge computing can be thought of as the cloud coming to your doorstep or a localized cloud. Maybe it is like having the cloud in your closet. 

Edge locations are highly distributed. When you use an edge location nearby, you get the benefit of high bandwidth and extremely low latency. The compute power is located at the edge location, so even slim IoT devices can do amazing things if they are connected to an edge location.


## What Can I Expect from Edge Computing?
Anything that can benefit from high computing power and real time decisions is either made possible by edge computing or made _better_ through edge computing. This technology has the potential to impact a variety of industries including advertising, healthcare, education, travel, entertainment, construction and more. 

AR (augmented reality) games? Edge Computing. 
Smart cities? Edge Computing. 
Telemedicine? Edge Computing. 

## How Can I Be Part of the Next Technological Shift?
Sound interesting? 

If you want to be among the first to build edge applications, please consider joining [AlefEdge's ambassador team](https://bit.ly/3dSUBYa). You will have early access to our upcoming APIs, support from the DevRel team, promotion of your projects, and an honorarium in the form of gift certificates and other prizes. 

Want to try our first public API? Check out our [tutorial](https://bit.ly/3ho58gs).
SideIt - My new side project
Tags: showdev, design, tailwindcss, react
Published: 2021-07-07 19:21:00

Edit: Featured on Product Hunt: https://www.producthunt.com/posts/sideit


Have you ever needed to merge two or more pictures but you were not able to open Photoshop, Canva, etc?

Why do you need to open huge apps just to make a simple task like merge pictures?

So, here is [SideIt](http://sideit.app). A very very simple tool to help you merge two or more pictures without pain.

Using this tool, you'll be able to create before-after pictures comparison, memes (why not?), photo collages, etc. For free. Give it a try.

Preview Video: https://youtu.be/OxT12Q3CvPI

New features coming soon:

* Image formats
* Background color
* Margin
* Dark Mode
Welcome Thread - v132
Tags: welcome
Published: 2021-07-07 19:05:33

---
title: Welcome Thread - v132
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
canonical_url: 
---

![surprise greeting](https://media.giphy.com/media/yP21r7z8MmTL8CHUCw/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
LaTeX & Maths: Equation Environment and Labeling Equations
Tags: codenewbie, latex
Published: 2021-07-07 15:05:42

Hello, how are you? :) 

In this post we talk about Why the equation environment is important, how you can label your equations and how you can *call* these equations. Let's start!!!

In [this](https://dev.to/latexteada/latex-maths-equations-and-environments-56fh) post I gave you a brief introduction to the `equation` environment, at the end of that post we compare the equation environment with the displayed formulas, but what is the difference between these environments

## Equation Environment

In the equation environment you can **Label** your equations and refer to these later. Do you remember that [here](https://dev.to/latexteada/latex-cross-referencing-2jga) I talked about the Cross-Referencing mode.

## Labeling Equations

The convention to label an equation is 

- `E: ` equation

```LaTeX
\label{E: my Formula}
```
So, if you want to label your equation, the `label` must be inside the `equation` environment 

```LaTeX
\begin{equation}
    \label{E: first}
    2x+3=y
\end{equation}
``` 

## Referencing equations

In [this](https://dev.to/latexteada/latex-cross-referencing-how-to-call-elements-1346) post I talked about how to reference elements which were labeled. Let's remember a little and introduce a new way to do this 

Let's assume we labeled our element as `\label{E: first}` you can use `\ref{}` but for equations is more useful `\eqref{}` 

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

Produces

![Screenshot from 2021-07-05 12-05-44](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wyy45fmy39596z2njfwc.png)

Did you notice? `\eqref` adds a pair of parentheses

Ok ok, but what if we want to give to our equation a *name* instead of a number? Can I do that? The answer is **YES** but that is topic for the next post

Thank you :) Do not forget to follow me on Twitter `@latexteada`
Professional Bio
Tags: introduction, summary, firstpost, newbee
Published: 2021-07-07 18:56:21

Saima Naim, a budding entrepreneur, is currently pursuing her Master's in Computer Engineering from Jamia Millia Islamia, Delhi. She has completed her B.Tech in Computer Science Engineering with distinction. She is ranked at the top of her faculty hence has been a Teaching Assistant for courses like Deep learning, NLP, Data mining, OOPS, for the university’s B-Tech labs also. She has done internships in web app & iOS development during her bachelor's & has a year-long experience being an Application Developer. She likes Python, C++, & talking about code. She is most interested in the intersection of code, art, & social justice.
Due to her computational thinking, She realized she was more interested in data. She became passionate about machine learning, especially MLOps, & making machines smarter. Her curiosity led her to create AI solutions viz Autonomous Security Surveillance, American Sign Language Translation, Traffic Sign Recognition, Real-Time Social Distance, & mask detector.
Although She tries to be technology agnostic, has a pragmatic approach, & chooses the best tool for the job. Thus She does not have strict favourites when it comes to programming languages or platforms. That is also why she tends to acquire skills as she needs them: depending on the project phase & requirements.  ̄\(ツ)/ ̄
Her current thesis is on self-driving cars for Real-time accident detection & classification. She wishes for a future in creating real-world Deep Learning solutions further gaining enough exposure to the industry to contribute to her life-long dream of becoming a part of the R&D division of a Reputed organisation. Coding is part of her free time as well. She often gets goofy ideas of little apps or services that ease her other hobbies or everyday life. She grabs every opportunity, such as internships, fellowships, webinars, or even simple group discussions on technology to expand her connections with different people from around the globe. Henceforth Interning with 2 companies as a data science, Computer vision & IoT engineer.
When Saima is not working, you can find her watching Nat Geo, Suspense thrillers, competing on CodeWars, taking runs around the city, or participating in coding community events. In her leisure time, she likes to read fiction & scientific research & loves spending her time with her family. She would also like to travel the world & try new things as she is an adventurer at heart. She is a good orator & can boost the team's morale. Saima has good leadership qualities & confidence in what she is doing; therefore, she is fun to work with, & there's a lot to learn from her. Saima aspires for better representation of women in STEM so that young girls have better role models to look up to, & no field remains out of their reach.
LeetCode 11. Container With Most Water
Published: 2021-07-07 18:54:36

This problem I used brute force first, but after submission it exceed the time limit. The time complexity is O(n^2).

Then I changed to two pointers' way. The left pointer from the index 0 and the right pointer from the last index. Then calculate the area. The area is (right -  left) * the shorter height of the two indices. So the pointer is seeking a bigger value of height to produce a bigger area. If left one is shorter, then move rightward; if the right one is shorter, then move leftward. `res` picks the bigger value each loop and return the result in the end. The time complexity is O(n).
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p66d20gny6saa0m15fxl.png)
Add interactive maps to your website without an API
Tags: webdev
Published: 2021-07-07 18:38:53

You may have wanted to add maps to your website for data analysis, at some point. I definitely did, when I developed a Coronavirus tracker last year. Trying to add maps, especially interactive ones, was difficult! It required loading the geometry of the map manually, and if you wanted to make it possible to hover over a state (for example, in the US), it was a nightmare.

Use a new type of map: *svg maps*.

If they're in the right use case, SVG maps can be much more effective for representing data specific to several countries at once, like Coronavirus case counts, and much easier to integrate with.

![World Map of Coronavirus Case Counts](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nejhrq97ox95zwp7k631.png)

### Some Benefits

You can make these maps interactive! Because SVGs are integrated with the DOM, you can add event listeners to individual states with one line of code: `document.getElementById('united-states')`, or `document.getElementById('south-korea')`. This also allows you to style the regions of the map, and shade them based on the data you want to visualize.

These maps are used live on [https://ncov2019.live/map](ncov2019.live).

They don't require any API keys or custom scripting.

They are minimalistic.

These maps are available from several places, and I found mine on [simplemaps.com](simplemaps.com).

You can combine this with the [https://www.npmjs.com/package/svg-pan-zoom](svg-pan-zoom) library to let users scroll through the map.
Constraints in SQL
Tags: sql, database
Published: 2021-07-07 18:37:10

Constraints in SQL are used to specify rules for data. You can't insert a row if any of these rules are broken. It's a good way to prevent user from inserting wrong data.
Here's CREATE TABLE statement with most common constraints in it:
```
CREATE TABLE user(
    id INT PRIMARY KEY,
    email VARCHAR(255) UNIQUE NOT NULL,
    status_id INT NOT NULL DEFAULT 1,
    age INT NOT NULL,
    CHECK (age >= 18)
    FOREIGN KEY (status_id) REFERENCES status(id)
)
```

##NOT NULL
With this constraint you can ensure that every row in this column has value, and cannot be NULL.

##UNIQUE
Specify that every value in this column has different value.

##PRIMARY KEY
Is a combination of NOT NULL and UNIQUE, often use to identify a specific row in table. There can be only one PRIMARY KEY in each table.

##FOREIGN KEY
Prevents from destroying links between two tables when deleting or modifying data.

##CHECK
Ensures that value of this field meets certain condition. In our example we check if the user has minimum 18 years old

##DEFAULT
It's simply default value for field, if no value is specified.
What is DevOps?
Tags: devops
Published: 2021-07-07 18:23:46

Docker is a set of platform as a service (PaaS) products that use OS-level virtualization to deliver software in packages called containers.Containers are isolated from one another and bundle their own software, libraries and configuration files; they can communicate with each other through well-defined channels.Because all of the containers share the services of a single operating system kernel, they use fewer resources than virtual machines.
CSS inline, block, inline-block
Tags: beginners, webdev, css, tutorial
Published: 2021-07-07 17:38:32


<p><span class='first-letter'>L</span>et's understand the difference between Inline, Block, Inline-Block.</p>

1️⃣ inline 

2️⃣ block

3️⃣ inline-block

```html
<p>
    Lets checkout how inline, block and inline-block works. You can or can't
    set the <span>width</span> or <span>height</span> for few display
    properties.
</p>
```

## 1️⃣ inline

Inline elements takes there own width and height, <b>you can not apply the width and height</b>, and if you try to apply then it won't have any effect.

### These are the inline HTML elements 👇

- span
- a
- img
- u
- small
- strong
- b
- ... many more

```css
.inline {
    padding: 5px;
    border: 5px dashed #ff527b;
    width: 200px; /* ❌ It will not work */
}
```

<img src="https://i.imgur.com/YmAHdzr.png" alt="css display inline" />

## 2️⃣ block

A block-level element always starts on a new line. A block-level element always takes up the full width available.

A block level element has a top and a bottom margin, whereas an inline element does not.

### These are the `block` HTML elements 👇

- h1
- p
- div
- header
- main
- table
- section

```css
.block {
    display: block;
    padding: 5px;
    border: 5px dashed #ff527b;
}
```      

<img src="https://i.imgur.com/32PemXp.png" alt="css display block" width={80} />

## 3️⃣ inline-block

inline-block It’s formatted just like the inline element, where it doesn’t start on a new line. 

It’s essentially the same thing as inline, except that you can set height and width values.

```css
.inline-block {
    display: inline-block;
    padding: 5px;
    border: 5px dashed #ff527b;
    width: 200px;  /* ✅ It will work  */
}
```

<img src="https://i.imgur.com/PXcd2Ei.png" alt="css display inline-block" />

## Reference 🧐

- <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements">MDN Docs of Inline</a>
- <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements">MDN Docs of Block</a>

<a href="https://www.buymeacoffee.com/suprabhasupi" target="_blank"><img src="https://i.imgur.com/4t25pJE.png" alt="Buy Me A Coffee" /></a>

<table>
  <tbody>
    <tr>
      <td>
        🌟 <a href="https://twitter.com/suprabhasupi"> Twitter</a>
      </td>
      <td>
        👩🏻‍💻 <a href="https://www.suprabha.me/"> suprabha.me</a>
      </td>
<td>
        🌟 <a href="https://www.instagram.com/suprabhasupi/"> Instagram</a>
      </td>
    </tr>
  </tbody>
</table>
What to do about sub-pixel media-queries?
Tags: css, discuss
Published: 2021-07-07 17:35:21

I came across an interesting conundrum today[^0]. I had zoomed into a webpage that uses both `max-width` and `min-width` media queries. I noticed that, while resizing the browser window, there was a brief moment where the layout was totally messed-up.

Turns out I seem to be the last web developer using Firefox[^1]. And Firefox treats media queries much more literally than WebKit/Blink-based browsers.

When zoomed in, the viewport can assume sub-pixel sizes. Say my window is 401px wide and zoom is set to 200%, the visual viewport width will be 200.5px wide.

Assume the following CSS[^5]:

```css
#max200, #min201 {
	display: none;
}

@media screen and (max-width: 200px) {
	#max200 {
		display: block;
	}
}

@media screen and (min-width: 201px) {
	#min201 {
		display: block;
	}
}
```

While Safari and Chromium will round up the actual value of the visual viewport to 201 when matching against media queries, Firefox will happily try to match 200.5 pixels against the given queries and neither of them will match, which will result in Firefox displaying neither the `#max200` nor the `#min201` element[^2].

One could argue this is a bug in Firefox but it seems like the behaviour is simply [under-specified](https://stackoverflow.com/a/34652275/11940).

Now, how can this be solved? A simple workaround would be to use `@media screen and (max-width: 200.999px)` for the first query but this will result in an overlap where both elements are shown on all browsers. It seems when parsing the media query, all browsers agree an rounding, treating `max-width: 200.999px` the same as `max-width: 201px`[^4].

What do you think would be the right course of action here and who’d need to take it? Should Firefox follow suit and take control over sub-pixel values away from devs? Should media-queries be extended with a `min-width-exclusive` and `max-width-exclusive` construct?

Should web developers just live with this and hope no-one zooms and resizes their windows? Or should we restrict ourselves to only either use `min-width` or `max-width` queries but never mix them?

Discuss!

[^0]: As with most interesting conundrums, it plays out mostly in the fringes; this one more literally than others.
[^1]: And, as it increasingly seems to me, one of the few who doesn’t just care about getting things to work but getting them to work on grounds of principle as opposed to accident.
[^5]: Try it on [my test page](https://static.ra-phi.ch/demo/fractional-media-query.html).
[^2]: Interestingly, on 5x zoom level, Chrome also briefly hides both elements. I attribute this to rounding errors. Safari doesn’t but it also zooms to max 3x so maybe the rounding problems don’t manifest.
[^4]: Also, it would be ugly even if it worked, as it relies on the fact that browsers don’t have infinite zoom capability (and users don’t have infinite desires for zooming in).
Biggest data integration challenges not addressed today? Why?
Tags: datascience, database, machinelearning, ai
Published: 2021-07-07 17:31:00

### Brief Plug: 
This post is related to what my company is building at General Commission, where we are leveraging AI to autonomously structure disparate data inputs, regardless of source, type, or format. We are looking for feedback from the user community on what's most important to you. 

### Intro
Data availability is exponentially increasing and expected to continue that trajectory over next 5-10 years. This will continue to exacerbate data engineering challenges around discovery, curation, integration, and synthesis. 

### Today's Engineering Tools
The market has produced several data integration and engineering solutions to assist in structuring and integrating disparate data sources (see: Fivetran, PreCog, dbt, Mozart Data, Palantir, y42, etc.).

IMO, these are somewhat limited in scope and generally based on a library pre-built connectors (or extremely expensive w/ large ramp-up in Palantir’s case).

What other technical challenges remain in using these solutions? What sets them apart? Why?

From what we've heard, users want a common but configurable schema output they can query and one that’s generated from many disparate data sources… They want to be able to ingest data from structured and unstructured sources which might include web-based or local files… APIs, databases, flat files, websites, etc. But are spending too much time trying to normalize.

### What's Ahead
I believe AI and Machine Learning can be used to address some of these limitations in existing SaaS solutions so they are not as open-ended in what data sources can be used as inputs for integration. 

What are the biggest points to consider from a technical / engineering perspective?
Hello DEV community!
Tags: firstpost, machinelearning, developer
Published: 2021-07-07 17:03:41

Hi dev community, this is Vishnu a guy who is like you interested in writing blogs and learning from others. I am a machine learning engineer by profession and I am really interesed and open to learn other technologies also. Here, I will be writing short articles which will help both you and me learn. So let's learn and grow together
Launching soon, debut Poetry collection by my son
Tags: books, writing
Published: 2021-07-07 16:42:41

Over the past two decades, I think I have done my tiny bit to help some of my friends and colleagues to shine bright as super engineer, a creative blogger or an amazing speaker. 

While my elder son, Sharvesh is celebrating his 14th Birthday, I am thrilled to call him as budding poet, indeed an author of his debut book **Treasured Droplets**.

What else could be the best birthday gift to my beloved son, than publishing his own writing, a collection of 45 unique poems totalling 3000+ words.

**Treasured Droplets** is a poetry collection giving positive outlook for ordinary things around with a deeper appreciation and gratitude. Readers of all age and all walks of life would definitely enjoy reading.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y06107nay8q3lg3n15et.jpeg)
learn about The OpenSource End-to-End DevOps tool - Devtron, Heroku for Kubernetes. Livestream on 8th July 3:00 PM UTC
Tags: kubernetes, devops, news, beginners
Published: 2021-07-07 16:36:40

I am Excited to share with everyone that I will be joining Saiyam Pathak, Director of Civocloud and a YouTuber, on a Livestream on 8th july to talk about our OpenSource End-to-End Devops tool, Devtron. 
There are cool giveaways as well for those who attend the event 😄

{% youtube FB5BI3Ef7uw %}

[Devtron](https://github.com/devtron-labs/devtron) is an application-first way of looking at Kubernetes, meaning deep integrations with existing open-source, commercial software and add capabilities on top of them to enable a clean self serve UI for developers and DevOps. 
We support various OpenSource systems like argocd, Argo workflow, Clair, hibernator, grafana, Prometheus, envoy, and many others. In short, it automates and helps in maintaining a balance between Security, Cost and stability of your app.

If any of this interests you, you will definitely have a great time. Come hang out with us on the [stream](https://www.youtube.com/watch?v=FB5BI3Ef7uw) to have a chat with me.
	
This is our OpenSource DevOps tool link, if you'd like to explore more
{% github devtron-labs/devtron %}