teleren/devto huggingface dataset:
Web Authencation API and Django
Tags: django, webauthn, authentication
Published: 2020-11-14 09:13:57

Web Authentication (Webauthn) API is a new way to authenticate users without use of passwords. The innovative part of this API that the authenticators are context-aware so this will eliminate phishing as the authenticator won't entertain the phishing site as it isn't registered on the authenticator.

# How Webauthn work?
There are 2 phases when dealing with Webauthn, registration phase and authentication phase.
## Registration Phase
In this phase, the client will handshake with the server on the credential to use in seven steps
1. The client (browser) requests registration.
2. The server will send a challenge (random numbers), user info and the server info (domain and name) to the client (browser)
3. The client will call createCredential in an external authenticator (e.g security key, fingerprint or face recognition) to create new credentials for the site.
4. The authenticator will check with the user by requesting fingerprint confirmation, PIN or press of a button.
5. Once the user acknowledges the new credential request, the authenticator replies to the browser with the public key and challenge encrypted by the private key.
6. The browser prepares the final data and sends it to the server
7. The server validates the response and save the data and finishes

## Authentication Phase
The authentication is close to login as
1. The browser requests authentication,
2. The server send a challenge
3. The browser calls getCredential in the authenticator, passing the user info, server info and challenge.
4. The authenticator validates the parameters checks the user using PIN, fingerprint or a button press.
5. If the user acknowledges the request successfully, the authenticator will sign the challenge with the private key and send it to the browser.
6. Browser will prepare the final data and sent it to the server.
7. Finally the server will check the received data against the stored keys and authenticate the user if successful.

To Understand more about about Webauthn, read the fantastic MDN article (https://developer.mozilla.org/en-US/docs/Web/API/Web_Authentication_API)


# django-mfa2
Django-mfa2 (https://github.com/mkalioby/django-mfa2/) is a django app that provides MFA using TOTP (Time based One Time Password), U2F (Universal 2nd Factor), FIDO2 U2F (Webauthn) and Trusted devices (special mode to allow access from devices that doesn't support security keys e.g iOS or common Android phones/tables that don't have NFC or Fingerprint sensors). The app is production ready and in fact is already used in multiple projects in my work and open source projects like AutoDeploy (https://github.com/mkalioby/autoDeploy)
So if you want to secure your Django App using this amazing technology that is supported by MS Edge, Firefox, and Chrome, please give it a try and contact the developer in case of an issue.
TDD: write better code in less time (a tech talk summary note)
Published: 2020-11-14 09:13:29

**Speaker: Evan Dorn**
**Link**: https://www.youtube.com/watch?v=HhwElTL-mdI

## Why do some programmers not write test?
Programmers are smart people. And smart people can make progress without process. Professionals in other fields first design, plan and prepare before they implement. So should programmers. TDD is a way to do this.

**Note**: Below points are taken verbatim from the talk. You should really watch the talk. It is awesome.


## TDD(Test Driven Development) defined

- Decide what the code will do.
- Write a test that will pass if the code does that thing.
- Run the test, see it fail. (A very important step.)
- Write the code.
- Refactor.


## TDD Provides
- design and plan before you code.
- document your design.
- proof that code implements design.
- encourages design of testable code.


## Testable code is

- modular.
- decoupled design.
- methods of limited scope.
- limits [cyclomatic complexiblity](https://en.wikipedia.org/wiki/Cyclomatic_complexity).

## Conclusion
Processes might feel tedious initially but they are necessary to transition from a 'programmer' to a software engineer. And they pay off in better productivity, cleaner codebase and better designed system. 

Also see: [TDD on wikipedia](https://en.wikipedia.org/wiki/Test-driven_development)
How I implemented 'Redux' in my React project...
Tags: redux, react
Published: 2020-11-14 03:17:25

What I know about redux is this: It manages state. At the beginning of the curriculum, I thought Redux was only used in React but that was not the case. While it’s mostly used with React, it can be used with any other JavaScript framework or library like Agular, Vue, etc. Redux has three main parts: a store, actions, and reducers. The state of the application is kept in a store, and each component can access any piece of state that it needs from this store. We can create a store as shown below:

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

There is only one store in any Redux application. When using Redux with React, states will no longer need to be lifted up; thus, it makes it easier to trace which action causes any change.

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

As seen above, the component does not need to provide any state or method for its children components to share data among themselves. Everything is handled by Redux. To send data to the redux store we need “actions”. Actions are sent using the store.dispatch() method. An action is a plain JavaScript object and it must have a type property to indicate the type of action to be carried out. It can also. optionally, have a payload property that contains the information that should be worked on by the action. Let’s take a look at one of my action creators:

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

Here I am creating an action to log in the user and dispatching it to the reducer. Reducers are pure functions that take the current state of the application and an action and then return a new state. Here is an example of a simple reducer:

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

In a reducer depending on the action type, it returns a new state. We can have multiple reducers to handle complex applications. To do so we can use combineReducers() which combines all reducers in the application into a single index reducer. Every reducer is responsible for its own part of the application’s state, and the state parameter is different for every reducer. The combineReducers() utility makes the file structure much easier to maintain.

Here is what my combine reducer looks like:

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

Lastly, this reducer will be passed in createstore. There is much more to explain but here, I just tried to highlight the main features.

Thank you for reading. Happy coding...
MacOS users, Java problems in Big Sur? HELP
Tags: help, java
Published: 2020-11-14 09:07:37

Well, yesterday I impatiently upgraded to MacOs Big sur and since then I can't use any of my IDEs (Eclipse, Netbeans, IntelliJ). They don't recognize the JDK.

I have already tried to set the JAVA_HOME variable, I have reinstalled and even formatted and done a clean installation of OS and programs ... but without success.

Searching the internet there are more people affected, although there is no clear solution.

Does anyone feel the same? Possible solution? Is this the fault of Apple, Java, or the IDE developers?

___

Edit to conclude:

To this day (11/17/2020), we still have no solution for NetBeans. I have finally tried IntelliJ and it works perfectly with Big Sur. I don't know whose actual responsibility is, but I think Apache is in the mood to lose users.
Let's graduate GUI and Live in Terminal!!
Tags: beginners, linux
Published: 2020-11-14 08:45:48

Hello there:)
This is my first post!
This article can help a person who is a beginner.
Recently I live in iterm2 and I graduated GUI.
So if you haven't tried CUI, this article is really helping for you!
Let's get started!

## Open the terminal

first, please type ⌘ + space, so you can use the Spotlight function and then type the word "terminal"
Can you see the black background application like this? It's the terminal that is CUI tool (I use iterm2 that's why the appearance is a little bit different but no problem!)
![スクリーンショット 2020-11-14 12.23.01](https://dev-to-uploads.s3.amazonaws.com/i/vmb3ziebjd96sykosm1t.png)
 
## cd
next type the word cd.
"cd" means change directory.
you can type cd directory name like this.
```sh
cd Desktop
```
and then you can see like this.
```sh
~/Desktop
```
this means you are on Desktop.

## pwd
pwd means print working directory
just type pwd.
```sh
pwd
```
you can see like this.
```sh
/Users/your name/Desktop
```
if you confuse about where you are, you can type it.

## mkdir
next, please type the word mkdir.
"mkdir" means make directory.
please type mkdir directory name like this.

```sh
mkdir sample_dir
```
you could make a new directory!

## ls
ls means list.
you can see a list of directories and files.
and you can check sample_dir is made like this.
```sh
sample_dir xxx.txt yyy.txt zzz
```
(if many files appeared, please type clear.
your screen is to be clean.)

## touch
touch means create a file.
(To be accurate, it update timestamp)
you can type like this
```sh
touch sample_file
```
you made a file and then please type ls

```sh
sample_dir sample_file xxx yyy zzz
```

## mv
mv means to move.
you can move your file or directory.

```sh
mv sample_file sample_dir/
```
this sentence means mv [files you want to move] [destination]

please type ls

```
sample_dir xxx yyy zzz
```
and then please type cd sample_dir and ls.

you can see like this
```sh
sample_file
```
you could move the sample_file below the sample_dir!

finally, you can type rm.
rm means remove but take care!
if you type this command, you can't be undone.
please type carefully.
```sh
rm sample_file
```
and then type ls.
you can see nothing.

if you want to take a rest, please type exit.
you can close the terminal!

All right! this is a basic command of the unix system.
please practice and then let's graduate GUI!
Thank you for reading!
if you like this post, please smash the like button and share it!
Fantasy themed programming flashcards
Tags: javascript, python, beginners
Published: 2020-11-14 08:38:24

{% youtube P0aVBqiQfmU %}

🐉 Do you like playing games and are learning programming? Now you can do both with Summon The JSON Javascript and Python printed decks

⚔️ Dive into a fantasy world and discover the most useful programming functions. Have a quality offline time doing things you love the most, and are good for you anywhere you are

💰 Save money and order your deck now, for you, or as a gift: https://summonthejson.com/products/summon-the-json-javascript-deck

Limited time offer ⏰
Good Linux distros for new users.
Tags: linux, beginners, productivity, programming
Published: 2020-11-14 08:31:59

Are you willing to switch to linux or maybe give it a shot? Well I was too and to between all these hustle of distros and desktop environments I did what you did to find this article, I googled,"top linux distos". So here are my top distros that I'd recommend to a new comer.

### 1. <a href="https://ubuntu.com/download"> Ubuntu </a>
![Ubuntu](https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/Ubuntu_20.10_Groovy_Gorilla_Desktop.png/1200px-Ubuntu_20.10_Groovy_Gorilla_Desktop.png)

Let's begin with probably the most popular distro, Ubuntu itself. Ubuntu is based on Gnome desktop environment. It's comes with a side dock by default good for people who want something different than windows' taskbar and mac's dock, though it is customizable like any other linux disto. It comes with libre office preinstalled. Overall I'd suggest ubuntu to anyone who have heard about it and want to see what ubuntu is. 

### 2. <a href="https://pop.system76.com/">Pop OS</a>
![pop os](https://images.idgesg.net/images/article/2017/06/linux-pop-os-desktop-100727995-large.jpg)

I'm currently using pop os as my main distro. It has probably the cleanest desktop out of every distro. It is built on top of ubuntu but there are several key differences. By default it has a hidden dock like default gnome, it's latest release has built in windows manager for people who are into that. It comes with a only a few basic software. It's made by system 76 for their hardware but it runs like a charm on any device. Overall I'm loving it and I'd recommend it to you if you want a clean desktop. **I'll write an article on how I customize my pop os for learning and developing python**.

### 3. <a href="https://linuxmint.com/">Linux Mint</a>
![Linux Mint](https://fossbytes.com/wp-content/uploads/2020/06/You-Can-Now-Download-Beta-Version-Of-Linux-Mint-20-22Ulyana22.jpg)

If you're a windows user and want similar user experience on linux then Linux Mint is for you. It is built to attract windows users with a similar user interface and props driver installation and media codes on boot. I've not used it for long but with the short time I spent on it I'd say it was really good and polished. 

### 4. <a href="https://elementary.io/">Elementary OS</a>
![Elementary OS](https://www.getmyos.com/app_public/files/t/1/2020/05/elementary-os-5-1-4-hera-april-2020-s3.png)
If you're switching from mac and want a similar user interface by default then I'd recommend you Elementary OS. It's clean, it's simple and it's beautiful. It does a few things different from other distros, like having a 'Pay what you want' model. For apps in it's app center you can pay whatever you like to the developer to get that application, of-course you can choose to pay nothing. It also has something called Curated app, i.e, apps developed specifically for elementary os keeping it's theme in mind. Do give it a shot if you want something clean. 

### Bonus
If you want something with arch then give manjaro a try. I've personally never used manjaro but I've heard some good things about it.
Top Visual Collaboration tools for team
Tags: productivity, beginners, tools, collaborate
Published: 2020-11-14 08:31:31

It’s nearly impossible to build a complex application without the right tools and proper direction. Add the need to deliver products and iterations quickly, and application development grows even more challenging–if not unattainable. Also when working from home a need for visual workspace arises at a much more rate where multiple teams or individuals can come and collaborate.
Here is a list of tools that you can add to your inventory to work with ease: 

**[Whimsical](http://whimsical.com/)**
Whimsical is free to use tools to work. It provides communicates visually at the speed of thought – collaborative flowcharts, wireframes, sticky notes, and mind maps. But, If you are using the free version of it, then you are only limited up to 4 whiteboards only. 
![Whimsical homepage](https://dev-to-uploads.s3.amazonaws.com/i/rekg50lmtyyc1yfjukj2.PNG)
However, 4 are very much sufficient for me as I don't work at a much larger scale. If you want more, you can upgrade as per your wish. One drawback is that currently, its mobile version is not available, if you want to access Whimsical the only way is through your desktop/laptop.

**[Miro](miro.com)**
Miro is the online collaborative whiteboarding platform that enables distributed teams to work effectively together, from brainstorming with digital sticky notes to planning and managing agile workflows.
![Miro Workspace](https://dev-to-uploads.s3.amazonaws.com/i/80vgi17vnhg8etvfbnuf.PNG)
You can easily create mind-maps, user stories, flow charts, and many more. 

**[LucidChart](https://www.lucidchart.com/c)**
LucidChart provides excellent features for the designer as for the creation of flowcharts, use case diagrams, flowcharts, and many more sort of documents at a very easy.
![LucidChart homepage](https://dev-to-uploads.s3.amazonaws.com/i/qocukgtxdzamh51p14ta.PNG)
At a free version, you are, limited to only a few workspaces and in each workspace, you can not add more than `60` shapes. Although it works pretty much well for me under 60 shapes. 

**[Creately](https://creately.com/)**
Creately is a web-based diagramming tool, that supports many diagrams types including Flowcharts, Venn diagrams, storyboards, etc, which are commonly used in teaching. Creately even has its own desktop software that automatically syncs with your online account, making it ideal for offline drawing as well.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ed9xjavjvakmdhxvuhgr.PNG)
Creately provides a very large variety of documents which is a very big advantage from all the above-mentioned tools.

Although all the above-metioned tools are very much attractive and using them once will always make you use again and again and going for the paid version is absolutely your choice as per your usage and love towards the tool.
Hacktoberfest - the open-source festival
Tags: hacktoberfest
Published: 2020-11-14 08:25:46


### Who am I and why did I participate in Hacktoberfest?
I am a complete beginner to the open-source community a few months back and it is fairly recently when I actually understood what the open-source community actually is, This when I really wanted to participate in the Hactoberfest, It was through my DSC that I got to know about Hacktoberfest

### Background
<!-- Share a bit about where you’re at in your Hacktoberfest journey. What stage are you at? How has the process been?  -->
This was my first time taking part in the hacktoberfest and I am extremely happy as I could learn a lot.

### Contributions

<!-- This is where you can list the contributions you made and explain why you chose the projects you did. Don’t forget to add links!  -->
As this was my first time contributing to an open-source community, I opted to go for a beginner-friendly repository where I wrote a few python programmes that can display patterns.


### Reflections
<!-- Overall, how has your Hacktoberfest 2020 experience been? If you’re a first-timer, will you participate again? What have you learned? Have you made any interesting connections? What is your next step in open source?  -->
As I said this was my first time taking part in Hactoberfest and
Hactoberfest 2020 was beautiful.
I am so happy that I was able to learn Git, and how Open source works!
Thank you Hacktoberfest!
I will collaborate in various open-source projects from now!
Go Struct And Stack Data Structure
Tags: programming, algorithms, go
Published: 2020-11-14 08:13:05

A byte-sized article that can teach or remind you of a programming concept and/or language in <2 minutes.

---

# Stack

Stack is a **LIFO (last-in-first-out)** data structure. It's usually used to convert a recursive solution into an iterative solution.

ℹ️ It is asked **a lot** during technical interviews at big tech companies.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1605195413607/_ZtbbGD9Z.png)

---

# Golang implementation

Interestingly enough, there's no built-in implementation of Stack in Go, you'll have to implement it based on a linked list.

```go
import "container/list" // import a package in Golang

type Stack struct { // how a struct is defined
    list *list.List // lowercase var/function is private
}

func (s *Stack) Push(val int) { // upperccase var/function is public
    s.list.PushBack(val)
}

func (s *Stack) Pop() int { // how a struct's function is defined
    item := s.list.Back()
    val := item.Value.(int)
    s.list.Remove(item)
    return val
}

func (s *Stack) Clean() {
    for s.list.Len() > 0 { // there's no 'while' in Golang, only 'for'
        s.list.Remove(s.list.Back())
    }
}
```

---

Hope you learned something new from this article 🙏!

If you have any comments, please leave them below. You can always DM and ask me anything on Twitter ([@phuctm97](https://twitter.com/phuctm97)) 😉
My 2-week reaction post about App Academy Open
Published: 2020-11-14 07:56:56

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vn39k0n22rn1gzhxdmqg.png)
(Note: I wasn't paid or asked to write this article by anyone but my own mind)

I stumbled across App Academy Open a few weeks back and read up a bit on the program and what it is.  App Academy Open is the free version of their Bootcamp curriculum, which supposedly covers everything that is in their paid bootcamp program.  Seems great right?  So far, it is!  There are a few things you don't get if you go the complete cheapskate way as I did - I do not have access to their Slack Channel or subreddit, I don't have any job/career support, and I do not have any tutoring access either.  Basically, if you go this route, you are completely on your own (save for some pre-recorded video lectures and practice problem explanations).

On the pre-recorded lectures, my man Alvin is fantastic.  He does a great job explaining concepts and will often backtrack to cover the basics while going through a multi-step problem.  I really appreciate that.  I have learned several techniques and ways to break down and solve problems, just by watching him answer them once I've finished on my own.  Having access to pre-recorded videos like this is a new thing for me.  As far as teaching me a little bit on how to "think", the pre-recorded lectures are clutch.

Being on my own?  Kinda sucks.  The challenge with this comes from not having any sort of hints or help on the practice problems.  Most of the problems I'll eventually figure out, but there have been a few I needed help to solve which meant I had to watch the problem explanation video and feel like an utter failure.  At one point this morning, I realized I wasn't going to get a problem answered on my own and got so frustrated at myself, I had to put the computer away for several hours before going back with a fresh mind and the acceptance that I couldn't do it.  There are zero hints to get you thinking in the right direction, so when you are completely clueless, you are SOL.  (One thing I enjoy about freeCodeCamp are the hints to point you in the right direction).

Besides being on my own, I've really enjoyed the experience thus far.  I'm still near the beginning since it takes me awhile on my own, but I'm learning.  And that's what counts.  Plus I started on Ruby for the first time with this program and have picked it up pretty quick thanks to the videos and practice problems.  I also get to use VS Code and my terminal, and I have uploaded a lot of my own work to Github which is a plus.

If anyone else is out there and currently doing the free a/A Open course, give me a shout!  We're pretty much on our own and I'd love to meet others doing it!  Also, if you are just starting out on it yourself, let me know.  Happy to provide help where I can!