teleren/devto huggingface dataset:
JetBrains Code With Me - Collaborative Coding in IntelliJ
Tags: todayilearned, productivity, technology
Published: 2020-10-01 10:45:00

Has anyone else completely missed [JetBrain's early access announcement](https://blog.jetbrains.com/blog/2020/09/28/code-with-me-eap/) for the [Code With Me](https://plugins.jetbrains.com/plugin/14896-code-with-me) plugin that happened 3 days ago!?

It is finally happening, collaborative coding in IntelliJ! And it's not even restricted to IntelliJ Ultimate (for now).

All you need is an IntelliJ 2020.2.x build and an internet connection. Just install the plugin and share a collaboration link.
The other side then has to quickly install a dedicated IntelliJ Client and you're good to go.

From what I've seen during a quick test run it looks pretty stable and promising. And I'm not sure if I'm interpreting the connection UI correctly...but it seemed that the connection was peer-to-peer, with JetBrain's servers only used for lobby management. That would be a huge plus if true!
Community Hangout and Update - 2020-10-03
Tags: phalcon, phalcon4, phalcon5, hangout
Published: 2020-10-02 13:36:10

---
title: Community Hangout and Update - 2020-10-03
published: true
date: 2020-10-02 13:19:17 UTC
tags: phalcon,phalcon4,phalcon5,hangout
canonical_url: 
---

Join us this Sunday 6th September at 10:00 EST (14:00 UTC) for a community hangout and update.

<!--more-->
### New Blood

- [Jérémy](https://github.com/jenovateurs)
- [Balázs](https://github.com/zsilbi)

### v4

- 4.1.x update

### v5

- phalcon/phalcon
- Additional repos 
  - Incubator
  - Devtools
  - Migrations

[https://youtu.be/FMNklV2a4hQ](https://youtu.be/FMNklV2a4hQ)

Looking forward to seeing everyone there!

* * *

Chat - Q&A

- [Discord Chat](https://phalcon.io/discord)
- [Forum](https://phalcon.link/forum)

Support

- [OpenCollective - Support Us](https://phalcon.io/fund)
- [Store - Merchandise](https://phalcon.io/store)

Social Media

- [Telegram](https://phalcon.io/telegram)
- [Gab](https://phalcon.io/gab)
- [MeWe](https://phalcon.io/mewe)
- [Parler](https://phalcon.io/parler)
- [Reddit](https://phalcon.io/reddit)
- [Facebook](https://phalcon.io/fb)
- [Twitter](https://phalcon.io/t)

Videos

- [BitChute](https://phalcon.io/bitchute)
- [Brighteon](https://phalcon.io/brighteon)
- [LBRY](https://phalcon.io/lbry)
- [YouTube](https://phalcon.io/youtube)

<3 Phalcon Team
Introduction to Assembly
Tags: assembler
Published: 2020-10-12 17:01:04

Hello!

Lets have a look at the Assembly language. Assembly is one level above binary, which runs on your hardware. The Assembler converts Assembly into binary. In the following 'Hello World' code we are working with the registers of a Raspberry Pi, which are contained in the CPU and can hold up to 32 bits.

This is the code:
```
.global _start
_start:

MOV R7, #4 //System call to output to screen
MOV R0, #1 //Set monitor as output stream
MOV R2, #12 //String Length
LDR R1, =message //Load register with address of string
SWI 0 //Software interrupt

end:
MOV R7, #1
SWI 0 //This combined with line above:Software interrupt,
      //saying to return to the terminal

.data //Signify that what follows is data
message:
.ascii "Hello World\n"
```
MOV R7, #4 means, that we put a 4 into the register 7 and it tells the System to output something on the screen. LDR means "load" and inside R7 there will be saved the starting adress of the String "message". SWI is the so called software interrupt function.

A software interrupt sends a signal to the Operating System. When it receives this interrupt signal it will check the values which are in the registers R0 and R7 and act accordingly, printing Hello World to the screen. After this it continues with the following lines in the code and returns to the terminal.

Did you work with Assembly yet and what did you program? Have a nice day. :)

Sources: https://www.youtube.com/watch?v=ViNnfoE56V8&feature=youtu.be
#1 Kèo Nào - Tổng hợp tin tức, lịch thi đấu, tỷ lệ kèo bóng đá
Published: 2020-10-13 08:40:41


KÈO NÀO ✅ Tổng hợp tin tức bóng đá ✅ Lịch thi đấu bóng đá ✅ Kết quả bóng đá ✅ Bảng xếp hạng bóng đá ✅ Trực tiếp bóng đá ✅ VIP 24/7

#keonao #keo_nao #bong_da_keo_nao #soi_keo

https://keonao.com/soi-keo/

https://keonao.com/nha-cai/

https://keonao.com/game-bai/
https://keonao.com/ban-ca-doi-thuong/
https://keonao.com/keo-nha-cai/
https://keonao.com/ty-le-keo/
https://keonao.com/lich-thi-dau-bong-da-hom-nay
https://keonao.com/ket-qua-bong-da-hom-nay
https://keonao.com/bang-xep-hang-bong-da
https://keonao.com/truc-tiep-bong-da/
https://keonao.com/soi-keo-asian-cup/
https://keonao.com/soi-keo-bundesliga/
https://keonao.com/soi-keo-cup-c2/
https://keonao.com/soi-keo-euro/
https://keonao.com/soi-keo-la-liga/
https://keonao.com/soi-keo-ligue-1/
https://keonao.com/soi-keo-ngoai-hang-anh/
https://keonao.com/soi-keo-serie-a/
https://keonao.com/soi-keo-world-cup/
https://keonao.com/soi-keo-dtqg/
Yup Schema Commonly Used Examples
Tags: javascript, schema, yup, regex
Published: 2020-10-15 09:21:20

Here are two commonly used schema validations using Yup:

1. Phone number validation with Regex
2. How to compare two fields in Yup

```Javascript
import * as yup from "yup";

const phoneRegex = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
const schema = yup.object().shape({
  phone: yup.string().matches(phoneRegex, "Invalid phone."),
  password: yup.string().required("Password is required"),
  confirmPassword: yup
    .string()
    .oneOf([yup.ref("password")], "Mismatched passwords")
    .required("Please confirm your password")
});

export default schema;

```
How do I write a 150 page doc in Markdown using github as version control then output to a designed .pdf when I want to release?
Tags: documentation
Published: 2020-10-16 18:50:18

How do I write a 150 page book in Markdown using github as version control then output to a designed .pdf whenever I want to release?

I'm looking for a toolchain and workflow for version control and Continuous Integration / Continuous Deployment for a book of prose.

some tools I've looked at:

  - gitbook
  - docusaurus
  - sphinx
  - pandoc

I want to output to .mobi .epub and .pdf … and have the document be pretty and designed, with cover, in context illustrations, and tables. 

Can anyone point me in the right direction?

Thank you. :)
If there is an input, there should be a form
Tags: ux, a11y
Published: 2020-10-17 15:53:58

---
title: If there is an input, there should be a form
published: true
tags: UX, Accessibility
canonical_url: https://tomekdev.com/posts/input-and-form
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/pr7dl6fr9sjc1a98lizv.png
---

_This post was originally published on https://tomekdev.com/posts/input-and-form. Go there to read a bit more interactive and style richer version_ ✌️

----

I often see in Single Page apps a situation where someone uses just an `<input>` field. Sometimes in the accompaniment of `<label>` if you happen to work with a pro 🌟. It feels that when we gained control of inputs with two-way binding and we started handling `onclick` events on buttons with our fancy frameworks, we forgot the old way of doing things.

## The old way, and the right way

The headline of this section may suggest that the old way and the right way are two different things. Where in fact, it's the opposite. If you come back with your memory before the frameworks (or ajax) era you see that people were using a `<form>` element when dealing with inputs and buttons.

In the past we were extensively using `<form method="">` to process the input. **I encourage you to still use a form element**. It comes with benefits.

## Common mistake

I use the keyboard to navigate and interact with pages. That speeds up everything. So for me one of the biggest pitfalls of using `<input>` without a `<form>` is that the input is not auto-submittable, so to say.

When you hit `ENTER` in the field that is inside the form then the form is submitted. That's very convenient for solo-input interfaces like a modal below:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/yi4bd1qj4ecnp2eqq327.png)

You don't have to touch your mouse or touchpad and click `Save` button 🎉. That would be a waste of time!

## Solution

It's a common mistake to bind your action to a `<button>` where in fact all you have to do is wrap your`<input>` with a `<form>` and assign `submit` event to a form:

```html
<form id="my-form">
  <input name="example" type="text" />
  <button type="submit">Submit</button>
</form>
```

```javascript
const form = document.getElementById('my-form');

form.addEventListener('submit', function handleSubmit(event) {
  alert('Submit clicked');
  event.preventDefault();
});
```

Don't forget to prevent default behavior from firing and run your custom behavior. It could be running validation and actually sending the data.

One more thing that you should consider is always specifying button's type. It's `submit` by default in most browsers but Internet Explorer is different in this case and has `button` as a default type.
YouTube Video | Create PDF Viewer with ES6 JavaScript
Tags: javascript, webdev, showdev, youtube
Published: 2020-10-21 11:14:36

In this video we are going to create a PDF viewer using modern ES6 JavaScript.

{% youtube QBI3XsBfvm8 %}

Please do like it and [Subscribe](https://www.youtube.com/channel/UCRf7mazcufqZxd2pR3oQJuQ?sub_confirmation=1) to my channel for more videos.
Refactoring: Code Comments for API Reusability
Tags: typescript, javascript
Published: 2020-10-21 17:01:51

<sub> Image of a multiple choice English test, I loved english but didn't like learning what all the parts were called, so my scores were in need of help. My instructors would often comment on my tests. </sub>

If we are following [PolyMorphic Compositional](https://dev.to/jwp/polymorphic-composition-494k) techniques we are creating many functions in our solution. So many in fact; due to following the [Single Responsibility Principle](https://www.google.com/search?q=single+responsibility+principle), we simply have too much stuff to remember regarding what each function really does.

**The API**

We should treat each function as an API, this means that it must be discoverable, both by name and by what it does.  

Assume an Address component that must allow for changing a State from a Select HTML Element like this:

><sub> Note : We name all our functions with the prefix func. Its great for intellisense and for knowing where the code lives.</sub>


```typescript
onStateChange(state: NgModel) {
  if (state.viewModel) {
   // a reusable function in our API
   funcAddressResetProperties(this.address);
   
```

We can see that the function names go a long way in telling us what each does, but there's more.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/rebrss9a59sr4t5y0cpu.png)

Ahh, we didn't know that the ID wasn't reset.  But now we do. The time to learn this was a simple hover action, we didn't have to dig into the code.

**How did we get the comments above?**

```typescript
/**Resets all but the ID property, 
// this is a design whereby new address 
// information overwrites old. */
export function 
funcAddressResetProperties(address: Address) 
{
   ... 
}
```

When we have hundreds of functions this is the best way to go. It also contributes to the eventual on-line API documentation to be published later. People that are new to any API rely heavily on online documentation to get started.

JWP2020 Code Comments as an API
81: Resources, Not Roadmap
Published: 2020-10-25 08:32:39

I decided to choose one resource for each chapter that I want to gain knowledge. My work-fit is focusing on one mission each task, by creating a new idea, apply to the process, then give a result. For example, making a website is required to create an inner process. Why? to have the algorithm thinking, not getting distracted by my imagination, and make it real! I prefer to gain the depth of one part, which is front-end engineering. 

* It is a true visual art
* I like the point that front engineering is visible while coding, feel safe to view the process right away. 
* The harmony, and A huge Potential. JS is eating the world. 

---------------------------

###**Mathematics**
* Khan Academy (Theory)
* Brilliant (Practice) 

###**Algorithm problems solving** 
* CoderByte (Problem Sovling) 
* Eloquent Javascript (TextBook) 

###**Project**
* JavaScript 30
* Frontend Masters 


---------------------------

Lastly, I'd like to find the code review website or regular mentorship to check my growth, was afraid of getting influenced overly, so I tried self-taught programming, at the end of the lesson, the healthy review is necessary to code forever haha, anyone recommends me the fun and casual code reviewer? to be direct, I prefer to have a comment, not teaching, because of protecting my creativity. That's all for me. Happy Holloween, Happy Coding.
Poll "When Stating Windows Support, What do YOU Expect?"
Tags: windows, discuss
Published: 2020-10-26 00:59:43

---
title: Poll "When Stating Windows Support, What do YOU Expect?"
published: true
description: I ran a poll recently trying to get an idea of what people expect when I would tweet or write something like, "this thing, X, is supported on Windows". Because Windows these days means more than a few things. There are these subsystems, Windows Subsystem for Linux, or WSL that are also considered, more or less, to be "Windows".
tags: windows, discuss, 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/wdngr069cexxjcnsbpqy.png
---
I ran a poll recently trying to get an idea of what people expect when I would tweet or write something like, "this thing, X, is supported on Windows". Because Windows these days means more than a few things. There are these subsystems, Windows Subsystem for Linux, or WSL that are also considered, more or less, to be "Windows".

WSLs of whatever version, they're really Linux operating under or in some pretense with Windows. It's kind of confusing really, because also there is WSL1 and WSL2, which are in their core entirely different beasts. They handle all sorts of things in different ways.

Whatever the case, I've concluded and will continue to do work that will support the OS specifically.

[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/wdngr069cexxjcnsbpqy.png)](https://twitter.com/Adron/status/1320151961677643776)

Do you do development on Windows? What are your expectations? Even amidst this small poll I did, I'm always curious if you're thoughts on the matter differ, or if the general coder's thoughts on the matter are changing. Do comment here or tweet at me, we'll discuss!
Sinatra Sports App CRUD MVC
Published: 2020-10-26 02:07:43

I used corneal to generate the file structure for my first Sinatra app. This structure helped me prepare for the long route ahead. I started making sure my active record gem was set to version 5.2. It runs better with sqlite. I then went ahead and created a simple user table and bets table and migrated them using rake. I then made sure my models were in place (user and bet) and inheriting from active records base. My models also have relationships to each other. For example my bet class belongs to users and my users have many bets. I seeded fake data and made sure that my associations were working correctly using my custom rake console. Rake console has helped me a lot especially when I need to look up methods on my created objects. I then began to meticulously use my HTTP verbs I learned, and routed out my controllers and corresponding embedded ruby views. These views present the user with an interface. Running shotgun allows you to visit localhost:9393 where the development site lives. This app allows you to keep track of sports wagers placed on games. I'm proud of how far I've come. This simple app has a lot of potential and plan to continue working on it in the next framework Rails.
Top Custom Software Development Companies in New York
Tags: softwaredevelopment, topcompanies, newyork
Published: 2020-10-26 15:30:25

Theodo
https://www.theodo.com/

Pattern Match
https://pattern-match.com/

Zco
https://www.zco.com/

Damco Solutions
https://www.damcogroup.com/

Weil & Jones
https://www.weiljones.com/

Ciklum
https://www.ciklum.com/

Dom & Tom
https://domandtom.com/

HubSpire
https://www.hubspire.com/

Saffron Tech
https://www.saffrontech.net/

Onit Digital, Inc.
http://www.onitdigital.com/

Fingent
https://www.fingent.com/

iTechArt Group
https://www.itechart.com/

Konstant Infosolutions
https://www.konstantinfo.com/

Stride
https://www.stridenyc.com/

Mobikasa
https://www.mobikasa.com/

Saritasa
https://www.saritasa.com/

TechNeed
https://www.techneedsolutions.com/

Valtech
https://www.valtech.com/

WASKO Software
https://wasko.software/

KeenEthics
https://keenethics.com/

Perpetual
https://www.perpetualny.com/

Gramercy Tech
https://www.gramercytech.com/

Codibly
https://codibly.com/

Koombea
https://www.koombea.com/

Def Method
https://www.defmethod.com/

Tivix
https://www.tivix.com/

JetRockets
https://jetrockets.pro/

NexGen Systems Inc.
https://www.nexgensm.com/

DOOR3
https://www.door3.com/

Bitbean.com
https://www.bitbean.com/

DataArt
https://www.dataart.com/

SourcePad
https://www.saritasa.com/

Icreon
https://www.icreon.com/en

Leadingdots Solutions Pvt Ltd
https://www.leadingdots.com/

Incipient Corp.
https://incipientcorp.com/

Lightmatter
https://www.lightmatter.com/

Bit by Bit Computer Consultants
https://www.bitxbit.com/

People10 Technologies Inc.
https://people10.com/

Messapps
https://messapps.com/

HTD Health
https://htdhealth.com/

Do you want your company on the list of *Top Custom Software Development Companies in New York*? Let us know at blog@foretheta.com.
Cool CSS clock without Javascript
Tags: css, showdev, webdev, html
Published: 2020-10-27 10:48:27

Today I want to show you how can you create a pure CSS clock without any Javascript.

First, What Is CSS Animation?
CSS animation is a proposed module for Cascading Style Sheets that allows designers and developers to add animations by editing the CSS code of their websites.

Let's jump to the code:

```html
<div class="clock">
  <div class="twelve"></div>
  <div class="three"></div>
  <div class="six"></div>
  <div class="nine"></div>
  <div class="center"></div>
  <div class="hour"></div>
  <div class="minute"></div>
  <div class="second"></div>
</div>
```
And little bit of CSS:

```css
body {
	 background-color: #0a192f;
}
 .clock {
	 position: relative;
	 height: 200px;
	 width: 200px;
	 background: white;
	 box-sizing: border-box;
	 border-radius: 100%;
	 border: 20px solid #ffde64;
	 position: absolute;
	 top: 0;
	 left: 0;
	 right: 0;
	 bottom: 0;
	 margin: auto;
}
 .clock .twelve {
	 position: absolute;
	 width: 6px;
	 height: 8px;
	 background: #262626;
	 left: 0;
	 right: 0;
	 margin: 0 auto;
}
 .clock .three {
	 position: absolute;
	 width: 8px;
	 height: 3px;
	 background: #262626;
	 top: 0;
	 bottom: 0;
	 right: 0;
	 margin: auto 0;
}
 .clock .six {
	 position: absolute;
	 width: 6px;
	 height: 8px;
	 background: #262626;
	 left: 0;
	 right: 0;
	 bottom: 0;
	 margin: 0 auto;
}
 .clock .nine {
	 position: absolute;
	 width: 8px;
	 height: 3px;
	 background: #262626;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 margin: auto 0;
}
 .clock .center {
	 height: 6px;
	 width: 6px;
	 position: absolute;
	 left: 0;
	 right: 0;
	 top: 0;
	 bottom: 0;
	 margin: auto;
	 background: #262626;
	 border-radius: 100%;
}
 
 .clock .hour {
	 width: 3px;
	 height: 100%;
	 position: absolute;
	 left: 0;
	 right: 0;
	 margin: 0 auto;
	 animation: time 60s infinite linear;
}
 .clock .hour:before {
	 position: absolute;
	 content: "";
	 background: #262626;
	 height: 60px;
	 width: 3px;
	 top: 30px;
}
 .clock .minute {
	 width: 1px;
	 height: 100%;
	 position: absolute;
	 left: 0;
	 right: 0;
	 margin: 0 auto;
	 animation: time 30s infinite linear;
}
 .clock .minute:before {
	 position: absolute;
	 content: "";
	 background: #262626;
	 height: 40px;
	 width: 1px;
	 top: 50px;
}
 .clock .second {
	 width: 2px;
	 height: 100%;
	 position: absolute;
	 left: 0;
	 right: 0;
	 margin: 0 auto;
	 animation: time 15s infinite linear;
}
 .clock .second:before {
	 position: absolute;
	 content: "";
	 background: #fd1111;
	 height: 45px;
	 width: 2px;
	 top: 45px;
}
 @keyframes time {
	 to {
		 transform: rotate(360deg);
	}
}
```

This is our result:

![enter image description here](https://i.ibb.co/r3CfnK7/clock.gif)

Thank you all.
Hi, there. I'm having an issue that i really don't understand.  
Tags: react, sass, javascript, webdev
Published: 2020-10-28 21:47:20

Hi, there. I'm having an issue that i really don't understand. I have noticed that sometimes my components that i grouped into a parent component goes against it normal html positioning, the will be stacking on top or behind  each components nested together with them within same parent. Please i need help to understand this thing. Even if i get tired and decide to use css to position it, it will still not work. For example, if i group a navbar, Todoform and Todolist inside another component called Home, and i put Home component inside App.js.
HACKTOBERFEST 2020
Tags: hacktoberfest
Published: 2020-10-29 06:15:23

<!-- ✨This template is only meant to get your ideas going, so please feel free to write your own title, structure, and words! ✨ -->


### About Me
Hi! I am Manali Biswas. I am new to the DEV community as I joined it during Hacktoberfest this month. I am a Computer Engineering student at Delhi Technological University. This year, I heard a lot about Hacktoberfest, with all the messages floating on social media. After understanding that its a celebration for open source, I decided to dump my laziness and go make at least 4 PRs!
### Background

Before this, I had participated in GirlScript Summer of Code 2020. That was my first experience of participating in a large-scale open source coding. I learned a lot of things that time, like making a pull request and contributing to node.js web applications. I like to make web applications (MERN stack) and have started exploring ML now.

### Progress

To be honest, I started off Hacktoberfest as a pastime. But then, I realized that I can try out something new and create something that I will love to look back to. So, I have started working on a Productivity web app, in which I will be exploring some calendar APIs. So far, I have integrated Google Calendar API and made a webpage to enable the user to set up timers. My Hacktoberfest is complete for this year and I have ordered my swag too!

### Contributions

I have contributed to a DS-ALGO repo by adding stack and queue stl C++. In that, I have made a program using many of the stl functions provided for queue and stack. There were some things which I learned, e.g., emplace function. Apart from that, I made the timer and Google Calendar API integrations to my productivity app, and added some styling.


### Reflections
Overall, my Hacktoberfest 2020 was good, I learned some things and it was a good experience. I did not have much idea of Hacktoberfest before, and now that I do, I think it is a great initiative. It is highly encouraging to see such fests, because open source gives birth to a lot of new ideas. I would love to participate again, and contribute to open source!
All the resources you need for Frontend development
Tags: webdev, resources, beginners, tutorial
Published: 2020-11-01 16:21:16

I've read many articles about resources for Frontend development. But every time I needed a resource that I'd read about,  I had to go through the hustle of looking for the article again.

To solve this problem I decided to put all these resources in [one place](https://github.com/developer-resources). Somewhere I could just look if I needed a resource.

I also decided to include some resources for those that are learning new technologies.

In the list I included resources for HTML, CSS, JavaScript, React, Icons, Illustrations, fonts and many more.

I combined all these resources and put them in [this Repository](https://github.com/developer-resources/frontend-development).

I also made the repo open source so that others can include resources that I didn't. 

Feel free to check it out and contribute to it if you can. I hope it helps you out.