teleren/devto huggingface dataset:
Help with Javascript
Published: 2021-05-27 12:35:34

Hi, I am supposed to do this work with javascript and don´t know how or even where to start.

"Your task is to encode a program that:

Asks the user to enter different products and how much they cost
Displays the most expensive product to the user
Displays the most affordable product for the user."

Can someone help me?

I think I would want around 5 products to deal with.
I have tried to solve this out with inputs, labels, arrays, buttons etc.but nothing works. I can´t get the button to return (or save) anything to anywhere. 

Wishfully,
Dude
Advantages/disadvantages of poetry vs pipenv
Tags: python, tooling
Published: 2021-05-27 11:09:47

You might be used to working with a virtual environment to isolate dependencies in a Python project, right?

*Most* people prefer `venv` or `pipenv`. However, `venv` lacks backward compatibility. Hence, for most people, `pipenv` turns out to be the best choice. Is that actually the best choice though?

The underdog `poetry` is identical to `pipenv` at the core, so which one should you use?

- `pipenv` helps you lock down dependencies, easily manage your virtual environment, has backwards compatibility, dependency graphs, and more.

- `poetry` is all that and offers extra tools that help you build and publish your packages to PyPi within few commands, resolve dependencies easily, and most of all, it's *really* **snappy**!

However, 

- `pipenv` can separate `dev` and `build` dependencies does this but it can get tricky.

Bottom line, if you want a dependency management system that **just works**, `pipenv` should be good enough but if you're on the hunt for an all round snappy tool, `poetry` is your friend.
🦋Email Validation made simple in Flutter
Tags: flutter, programming, android, dart
Published: 2021-05-27 12:30:52

Photo by <a href="https://unsplash.com/@inlytics?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">inlytics | LinkedIn Analytics Tool</a> on <a href="https://unsplash.com/s/photos/login?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

Welcome to my first article about Flutter package testing. Each week, I will test another package published under pub.dev.

##Email Validator
This week’s package provides you with one easy-to-use function to validate an email input. The author mentions that this is a simple (but “correct”) Dart class for email validation without using regular expressions. We’ll come back later to why he calls it correct.

##The Purpose
I think the purpose of this package is very clear. For example, if you want to register a user with an email address and a password, you have to verify that the email address is valid. If it’s not, you can give your user a hint that they have to check their email address again for any spelling mistakes. Not all backend systems support email validation while creating a new user. According to your app’s user experience, it’s also much better to help your user when they’ve finished the email address input and want to start filling in a password.
Most of the time, you start searching for an email validation right when you need it. Looking at Stack Overflow, the most upvoted response for this scenario is a complex regex.

##Package Scope
...

###Head over to [Medium to read the whole post](https://lucianojung.medium.com/membership)
India Satta Matka Results - A game that can take You from rags to riches.
Published: 2021-05-27 12:29:24

Playing in portable applications has consistently been simple and fun. The fervor in winning on any application is constantly seen on the higher side. What's more, who would not like to win cash whenever applications offer you this chance. The online satta matka application gives the players the joy of bringing in cash. in the high-speed world, everybody is running behind acquiring. Be that as it may, for what reason to surge when satta game purposes this for any of its clients. The game that has an interesting history has turned up a huge success to many of the current players. The game of betting might sound risky but if played with caution it definitely will turn the tables for many.

Amazing Benefits of Playing Online Satta Matka 
The satta gaming applications accompany different advantages for the clients. This satta matka application is effectively accessible to download. The downloading occurs in parts of seconds. This application should be possible from any area. With no issue, any player can begin appreciating the match and dominate genuine money. The application has been extremely straightforward since its quality in the external world. The straightforwardness of this application has acquired a great deal of fame. Satta matka is the most popular with a lot of people and one of the old types of betting. Playing on the web matka is simple with the help of live satta matka results. 
 

With the quickly developing innovation, one can without much stress access satta matka online applications on their smartphones. Likewise, these applications show the live satta matka results. With such countless business sectors accessible, these applications show the live satta matka results with their opening and shutting time. Also, these online live satta matka results give specific outcomes which are effectively accessible on these applications with no issue of voyaging. https://www.indiasatta.co/blog/
Structure for useReducer + Context Api 
Tags: react
Published: 2021-05-27 12:24:47

I've been studyng about Context API and useReducer hook, but i found nothing talking about pattern or file structure to use in projects with that.

I got to this structure:

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

Inside the context folder, i have the context itself and the reducer that controls the context state.

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

And in the component, i never (or almost never) access the context directly, leaving this job to a custom hook.

The complete code is [here](https://github.com/ClaitonBarreto/usereducer-structure)

What you think or comment about this ?
Day 8/30 : Game Card Hover Effects using HTML and CSS
Tags: html, css, webdev, tutorial
Published: 2021-05-27 12:13:31

Welcome to Day 8 of this [Challenge](https://dev.to/somanathgoudar/30dayschallenge-30-days-extreme-html-css-challenge-50k1). This is what I created today. 

**➜ Here is the Demo :**
![Game Card Hover Effects](https://1.bp.blogspot.com/-1Ida72bBFEU/YKOeIr0_WdI/AAAAAAAAACM/gjU31-aCH4EUYYBlB4zq7loIwnnWBTRDQCLcBGAsYHQ/s600/p8.gif)

**➜ Video Tutorial :**

{% youtube DmEcanPih_4 %}
**➜ Source Code :**
https://www.futurecodersweb.com/2021/05/css-card-hover-effects-using-html-and.html


**➜ Instagram Post and Reel for Day 8 :**
[See Post and Reel](https://www.instagram.com/future_coderss/)

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

Hey, If You don't know what is happening here. Don't Worry, I am doing a crazy challenge 😅. Read More about it from the post below.

{% link https://dev.to/somanathgoudar/30dayschallenge-30-days-extreme-html-css-challenge-50k1 %}

**Support Me :**
👉 Buy me a Coffee: https://www.buymeacoffee.com/somanathgoudar
👉 [Follow Me on Instagram](https://www.instagram.com/somanath_goudar/)
👉 [Follow Future Coders on Instagram](https://www.instagram.com/future_coderss/)
👉 [Subscribe to My Main Channel](https://www.youtube.com/channel/UC_nTrhTr5fnBGjOxnkPUmmA)
👉 [Subscribe to Channel Created for this Challenge](https://www.youtube.com/channel/UCzGSyMOf2jPt1MkNBB3SJ3g)

------------------------------------------------------------------
Make an impact. Join the mission at Wise🚀
Tags: python, career, job, opportunity
Published: 2021-05-27 12:09:47

Wise is one the fastest growing companies in Europe and we’re on a mission: to make money without borders the new normal. We’ve got 10 million customers across the globe and we’re growing. Fast.

Current banking systems don’t let us send, spend or receive money across borders easily. Or quickly. Or cheaply.

So, we’re building a new one.

And, we need a passionate Python Developer to join our mission. 

For our external customers, using Wise is as simple as sending money from A to B. Yet behind this process is a complex engine of currencies and routes, generating more than 15 billion data changes each day. In terms of decision making, this data is the lifeblood of our business.

The Analytics-Platform (AP) team builds and operates the platform that empowers all Wisers, including Analysts, Product Managers and Engineers with the access and tools required to effectively explore and analyse this data to help move their teams forward.

You will be working within the AP team to create and run several systems, including

Our in-house built, open-sourced data replication software PipelineWise
Our extensive DevOps tools
Our infrastructure as code
AP prides itself on being a DevOps team, meaning we put good software engineering principles, automated testing and metric gathering at the centre of everything we do.

A bit about you:
You have solid knowledge of Computer Science fundamentals
You believe in TDD and the SDLC
You have solid knowledge of the Python ecosystem
You are well versed in writing efficient, bug-free and scalable code
You are comfortable with the DevOps and Continuous Integration approach to work
You have experience working with APIs, SQL databases, query optimisation and designing schemas
You have the ability to work in a distributed team – identify problems, collaborate with your teammates to create plans, design and implement solutions
You have the ability to articulate complex and technical concepts to non-technical audiences
You have a passion for open-source

What you get back:
Be part of an autonomous team
The freedom to have real impact
Loads of development opportunities 
A fun work environment with social activities and events
The opportunity to work with super smart people
And more… 

Location: Tallinn,Estonia London,UK

Interested? Find out more:
https://www.wise.jobs/2019/12/05/how-we-work-a-practical-guide/
https://medium.com/transferwise-engineering
https://medium.com/transferwise-engineering/how-product-engineers-build-new-features-at-transferwise-88752cf87fa

We want to work with the best people, no matter their background. So if you’re passionate about learning new things and keen to join our mission, you’ll fit right in.

Also, qualifications aren’t that important to us. If you’ve got great experience, and you’re great at articulating your thinking, we’d like to hear from you.

And because we believe that diverse teams build better products, we’d especially love to hear from you if you’re from an under-represented demographic.

Find out more about Wise and role here: https://grnh.se/079bc86d1us
Daily Developer Jokes - Thursday, May 27, 2021
Tags: jokes, dailydeveloperjokes
Published: 2021-05-27 12:00:05

---
title: "Daily Developer Jokes - Thursday, May 27, 2021"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Thursday%2C%20May%2027%2C%202021"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1258b4d7b44.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ Why doesn't Hollywood make more Big Data movies?

___A:___ NoSQL.
 -->
5 Mistakes people do on Twitter when trying to grow their account
Tags: twitter, socialmedia, content, audience
Published: 2021-05-27 12:00:03

_If you found value in this thread you will most likely enjoy my tweets too so make sure you follow me on [Twitter](https://twitter.com/VladPasca5)  for more information about web development and how to improve as a developer. This article was first published on my [Blog](https://vladpasca.hashnode.dev/)_

### 1. They are not consistent

If you want to grow on any social media platform, not only Twitter, you need to be consistent

Post a Tweet every single day

Not only that Twitter algorithm will push your tweets more if you are consistent but you will also grow faster

### 2. They don't engage with bigger accounts

In the beginning, no one will see your tweets

Unfortunately, this is the truth

To grow in the beginning, you need to engage with a bigger account

Reply to their tweets and add value

Do this until you get to over 1000 followers

### 3. They use a lot of hashtags

Using more than 2 hashtags on your posts is useless

You could use at max 2 hashtags until you get to 1000-1500 followers

But after that drop them

They just make your posts look spammy and no one wants to engage with spammy tweets

### 4. They have a bad bio

Your bio should tell others who you are, what's your content is about, and what they get if they follow you

Don't use hashtags in your bio

Keep it simple and don't talk about useless stuff

### 5. They don't know how to format their tweets

You need to add more spaces between in your tweets

Like I do

This will make your tweets easier to read and people will engage more with them

### The end

_I hope found this useful and if you did please let me know. If you have any question feel free to DM me on  [Twitter](https://twitter.com/VladPasca5) ._
Cute sidebar menu with HTML, CSS and JQuery
Tags: html, css, codenewbie, todayilearned
Published: 2021-05-27 11:53:40

Hello dear community member,

In this post you will learn how to make cute sidebar menu with just pure languages like HTML, CSS and JQuery.

This is just a simple sidebar menu with hide/show(toggle) feature.

JQuery function(toggle) is triggered when some buddy click on burger menu it will toggle CSS class from show to hide or vise versa.

---
[![CSS course eduonix](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/az71k2lp2eeyll27izng.png)](https://www.eduonix.com/css-bootcamp-master-in-css-including-css-grid-css-flexbox/UHJvZHVjdC0xMzE1MDIw)
---

So don't worry I will not bore by explaining each and every steps in detail.

But if you want to learn more about this sidebar menu, I highly recommend you to play with this live codepen project. It will help you to understand concepts clearly.

{% codepen https://codepen.io/atulcodex/pen/jOBLwLO %}
How to make custom checkbox in HTML. Pure CSS
Tags: html, css, beginners, webdev
Published: 2021-05-27 11:53:40

Hello, glad you are here. I am kunaal and today we will see how to style checkbox in HTML. How we can easily make our own custom checkbox for website. You can see demo below.

#Demo

{% codepen https://codepen.io/kunaal_kumar/pen/vYxJrGK %}

#Video Tutorial -

If you find this article hard or for better explanation. You can watch video tutorial.

{% youtube St-DDo3hB_M %}

>If you like the video tutorial. Please consider subscribing my youtube channel.

#Let's code

Inside body tag lets make some check boxes

HTML 
```HTML
<label for="checkbox">
    <input type="checkbox" id="checkbox">
    <div class="circle"></div>
</label>
<label for="checkbox2">
    <input type="checkbox" id="checkbox2">
    <div class="circle"></div>
</label>
```
CSS

```CSS
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: #6da8ff;
}

label{
    position: relative;
    width: 120px;
    height: 50px;
    border-radius: 50px;
    background: #fff;
    box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    margin: 10px 0;
}

input{
    display: none;
}

.circle{
    width: 110px;
    height: 110px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: .5s ease-in-out;
    pointer-events: none;
}

.circle::before{
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: #ff6262;
    transition: .5s;
    transition-delay: .5s;
    border-radius: 50%;
}

input:checked ~ .circle{
    transform: translate(-50%, -50%) rotate(180deg);
}

input:checked ~ .circle::before{
    background: #6fff57;
}
```I hope you understood everything. If you have any doubt or you find any mistake that I made or you have any suggestion feel free to ask me in comment.

>If you are interested in programming and want to know how I a 15yr old teen do coding make these design. You can follow me on my Instagram. I am also planning to post my game development stuff on Instagram.

[My youtube Channel](https://www.youtube.com/c/TechyProgrammers/), [Instagram](https://www.instagram.com/techy_programmers/)
Drupal 8^9: Make a node's field accessible in page.html.twig
Tags: drupal, twig, template
Published: 2021-05-27 11:36:46

We can render the node fields value in `page.html.twig` on two different ways.

## First method 

Without defining node pre-processing in `mytheme.theme` file. We can render a field's default value inside page.html.twig, using the following Twig variable as in `{{ node.field_some_name.value }}`.

If you have an image field, and want to render the URL to the image stored in that field inside the page.html.twig template, you would use `{{ file_url(node.field_some_image.entity.fileuri) }}`.

Finally, if you want to render the title of a node inside the page.html.twig template, you would use `{{ node.label }}`.


## Second method

We had a use case where an image field needed to be used as a background image in the scope of `page.html.twig`. This is pretty simple with the use of `template_preprocess_page()`.

To get the image field into the page variable use this code:

```
/**
 * Implements template_preprocess_page().
 */
 
function MYTHEME_preprocess_page(&$variables) {
  // Define {{ field_image }} field value available in the template.  
  if (isset($variables['node'])) {
    $variables['page']['image_in_page'] = $variables['node']->field_image->view();
  }
}
```

Then, print the image in page.html.twig with:

```
{{ page.image_in_page }}
```
The logic above isn't checking whether the field_image exists, but should get you close.

Thanks for the assist: 
[https://www.computerminds.co.uk/articles/rendering-drupal-8-fields-righ…](https://www.computerminds.co.uk/articles/rendering-drupal-8-fields-right-way)
Wordcount for huge data
Tags: wordcount, algorithms
Published: 2021-05-27 11:35:48

---
title: Wordcount for huge data
published: true
description: It is easy to do unique word counts by keeping a map for input data, but becomes difficult if unique words volume is huge
tags: wordcount, algorithm
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jv7dk9qklb0avcyz8c9j.jpg
---

If we are to process unique word counts for input data (read many sentences), the solution is pretty straightforward using a map. Javascript example below:

![Map Solution](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jv7dk9qklb0avcyz8c9j.jpg)

However, if the number of unique words is huge and there are memory limitations, then finding an optimal solution becomes difficult. In that case we can go with a tree traversal route to save memory. Say, we have a to find the count of few words from input data. Words are "Stack", "Stick", "Stuck", "The", "Then". We can form a multi node tree where the leaf nodes will contain the count. Illustration below:

![Binary Tree](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qvba42nclpu3jxc35t3q.png)

As you can see, instead of having stuck, stack, stick, stuck as separate elements in the map, we are creating a tree to save some letters (bytes) being reused. 

Disclaimers note: I don't have the exact algorithms in my head as code yet :) and the representation of "the" and "then" in the image is not exactly right.

Thanks Joynal (https://www.linkedin.com/in/joynaluu/) for bringing up the topic to ponder upon in social media.

signing off,
Mukit
I read 99 Bottles of OOP
Published: 2021-05-27 11:13:41

---
title: I read 99 Bottles of OOP
published: true
description: My review of the book by Sandi Metz, Katrina Owen, and TJ Stankus.
tags: 
//cover_image: https://direct_url_to_image.jpg
---

_99 Bottles of OOP, A Practical Guide to Object-Oriented Design_ is a book by Sandi Metz, Katrina Owen, and TJ Stankus. I gave a four star review on Goodreads meaning that I _really liked it_!

---

This is a book about Object-Oriented concepts, or should I say processes? It presents the reader a series of doctrines to follow which will improve the quality of the code.

The book begins by requesting the reader to write code which prints out the lyrics to the _99 Bottles of Beer_ song. How often do we get this? It then guides the reader on evaluating its own code. The book also presents four different solutions to its own challenge and uses them, by a series of refactoring, to present the topics of the book.
The book can be as practical as the reader wants it to be; either by passively reading the authors' approach to solve this problem, or; following along the book and apply those changes to the code directly.

I think this extract from the book makes a good tl;dr summary: _"Strive for simplicity. Don't abstract too soon. Focus on smells. Concentrate on difference. Take small steps. Follow the Flocking Rules. Refactor under green. Fix the easy problems first. Work horizontally. Seek stable leading points. Be disciplined. Don't chase the shiny thing."_ 

I read the Ruby version of the book and I think it's worth re-reading it in the Javascript version. Mostly because I use both languages. The concepts in this book are language agnostic and can be used on any object oriented programming language. One can take the exercise a little bit further and use it with some other OO language.

---

99 Bottles of OOP [website](https://sandimetz.com/99bottles).
99 Bottles of OOP on [Goodreads](https://www.goodreads.com/book/show/54500642-99-bottles-of-oop).
Why use Flake8 to enforce PEP8
Tags: python, programming
Published: 2021-05-27 11:09:24

Flake8, as a tool, is a boon for those wanting to maintain clean, tight, and concise Python codebase. You might wonder, "If I want to maintain a clean and readable Python codebase, I might as well just use something like PyLint, what's so good about Flake8?". 

Glad that you got curious!

You see, Flake8 is quite handy for catching errors and even though PyLint also helps to some extent with formatting, it can be tough to catch PEP8 errors with PyLint since it **does not enforce** PEP8.

**Hence, if you plan on enforcing PEP8, Flake8 is the way to go.**

Overall, reasons you might want to consider using Flake8 include :

- It has got great support for plugins that PyLint can't even come close to including but not limited to doctoring style and type-checking.

- Flake8 plugins are easier to write relative to PyLint plugins, in terms of, lines of code.

- It enforces PEP8 which is, in fact, the whole point!


P.S I recommend using Flake8 with your CI as well. Also, you can always use Flake8 in conjunction with something like PyLint.
logical operater(Not !)
Tags: beginners, javascript
Published: 2021-05-27 11:07:35

##! (NOT)##

Converts the operand to boolean type: true/false.
Returns the inverse value.
he syntax is pretty simple:  result = !value;
e.g.
alert( !true ); // false
alert( !0 ); // true

A double NOT !! is sometimes used for converting a value to boolean type:
e.g
alert( !!"talha" ); // true
alert( !!0 ); // false