teleren/devto huggingface dataset:
Building a Joke guesser game in React
Tags: react, webdev
Published: 2021-09-29 16:32:52

---
title: Building a Joke guesser game in React
published: true
description: Hello fellow humanoids. In this post we will build a basic Joke guesser game in react. 
tags: React, webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3brorpqtx7l89gc0f89u.jpg
---

## What is this post about ?
Hello fellow humanoids. Today we will build a Joke guesser game and cover some basic concepts of making API calls and other react concepts.
Check out the game here : [Joke Guesser Game](https://vigneshiyergithub.github.io/joke-guesser-game/)
Github repo for reference : [Repo Link](https://github.com/vigneshiyergithub/joke-guesser-game)

## Content
* How to create a game ?
* How to use Joke API for game ?
* How to do scoring ?

Lets go deep dive into each one and explore how it was implemented.

## How to create a game
The game we are creating today will be a joke guesser game. 
It will be comprised of 2 part Joke. The first part will set the premise for the joke and the gamer will enter the probable second part of the joke and will be scored according to the string similarity. The complete game is comprised of 10 rounds.
![Game UI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8x0xa9hm391e93gd3o5g.png)
{% gist https://gist.github.com/vigneshiyergithub/3a5ef0f745e6b99af0af10d8034443b0 %}

## How to use Joke API for game ?
For the game in context we would query a Joke API endpoint to fetch the joke for the round. The joke will be a bi-parted joke which we would use to form Question for the joke and use the second part for the text similarity score.
{% gist https://gist.github.com/vigneshiyergithub/70be6110d9d7e0c2afdd3ede8b914fd3 %}

## How to do scoring ?
Once the gamer has entered his guess for scoring with the original joke we would be using Text Similarity. 
For text similarity we would be using ["string-similarity"](https://www.npmjs.com/package/string-similarity) npm package.

## Conclusion
This game is not developed to it's entirety and has room for improvement. Please feel free to fork the repo and make changes as you please. Do let me know if I made any grave blunders in coding this. Thanks for reading this post. 
Stay safe and lend a hand to another :)
What is Hacktoberfest 2021?
Tags: hacktoberfest, opensource, github, contributorswanted
Published: 2021-09-29 18:33:38

**Hacktoberfest** 2021 is the 8th edition of Hacktoberfest hosted by DigitalOcean. It is an open source festival celebrated during October every year, encouraging people worldwide to actively participate and contribute to participating open source projects hosted across GitHub and GitLab.

In fact, Hacktoberfest 2020 had attracted 169,886 participants and 116,361 participating open source repositories, representing 135 countries.

You can simply [register yourself here](https://hacktoberfest.digitalocean.com/) and start contributing to any participating open source project from Oct 01 - Oct 31. And if you meet the [contribution criteria](https://hacktoberfest.digitalocean.com/resources/participation) set by DigitalOcean, you’ll receive a Hacktoberfest t-shirt🤩 from DigitalOcean!

Additionally, if you make successful contributions to [LoginRadius open source projects](https://github.com/LoginRadius), you’ll separately receive a LoginRadius branded Hacktoberfest t-shirt from us, recognizing and thanking you for your valuable contributions.




#How to Contribute?

The exciting part about being involved in the open source community is that no matter how small or big your contributions are, the community will welcome your efforts and collaborate with you positively, sharing feedback and expressing gratitude.

Especially with LoginRadius open source projects, your contributions can make a big difference! We also try making your collaboration with us more enjoyable.

Please note that only contributions that add significant value to our projects will be eligible for swag. This will be at our sole discretion. But you may go ahead and contribute in any way you would like.


##Prerequisites

####. Git
####. Github
####. Forking a repository
####. Creating a pull request





##Win LoginRadius Branded Swag

By actively participating in Hacktoberfest, you make the open source community more sustainable, and, in turn, this makes you feel at home. Empowering one another is what best depicts the open source philosophy and is a reward in itself.

However, we want to make it more fun by sending cool t-shirts to all the accepted/eligible contributors. Just make sure to fill this form after you raise a pull request.

Don’t forget that your contributions to our projects also count towards your overall Hacktoberfest contributions calculated by DigitalOcean — and if you’re eligible, they’ll send you another t-shirt as well.

Let’s have fun with Hacktoberfest 2021!

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1godkvgae6nss8pu2q46.gif)

i am also mentor in the Hacktoberfest so feel free connect with me

Thanks for reading....
Java: Convert String to a Number
Tags: java, programming, coding, oop
Published: 2021-09-29 19:21:50

When it comes to converting a string of numbers, like: "1234" into a number the first question that jumps to your mind is:
"They look like a number! why do I need to convert a number to a number?!"

Well, the computer doesn't see things the way we see them, a **_string_** consists of numbers is not a number! or at least according to the computer.

A string of numbers is a bunch of characters and they do not present a numeric value.

So in Java we have two ways to convert a string of 'numbers' to a real number, and here is how this could be done:
>In this post I'm going to talk about converting string to int

###Using Integer.parseInt()
This method will return the primitive numeric value of a string that contains **only** numbers, otherwise it will throw an error (NumberFormatException)

For example:
```
String testStr = "150";
        try{
            System.out.println(Integer.parseInt(testStr));
        } catch (NumberFormatException e) {
            System.out.print("Error: String doesn't contain a valid integer. " + e.getMessage());
        }
```
###Using Integer.valueOf()

This method will return an integer object of the passed parameter,
if the passed parameter isn't valid it will throw an error.
For example:
```
String testStr = "200";
        try{
            System.out.println(Integer.valueOf(testStr));
        } catch (NumberFormatException e) {
            System.out.print("Error: String doesn't contain a valid integer. " + e.getMessage());
        }
```
Welcome Thread - v144
Tags: welcome
Published: 2021-09-29 19:49:08

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

![Willy Wonka Welcome](https://media.giphy.com/media/OJqimXwqG7CQE/giphy.gif?cid=ecf05e47phjd4n8s48dw6z2to68w2n5km6609s75lh8pdrer&rid=giphy.gif&ct=g)

### 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!**
Deploying Spring Boot MVC with JSP project to AWS Elastic Beanstalk
Tags: java, jsp, aws, beanstalk
Published: 2021-10-01 00:20:23

_Disclaimer: Try this at your own risk. AWS resources required for DemoApplication should be covered under the free tier. If you’re not on a free tier make sure to clean up the resources provisioned soon after trying this out. Check if there are any leftovers remaining inside an Amazon S3 bucket after deleting the application._

There are multiple options available when it comes to the deployment of a Spring Boot project. In this story, we’ll be focusing on how to deploy a project with JSP pages using a service available in Amazon Web Services.
___

Throughout the last couple of Medium stories, I have discussed how to create a Spring Boot project and adding different features to those projects. In order to proceed with this story you need to have a Spring Boot MVC project, if you don’t have one check out my Medium story [Implementing Spring Boot MVC CRUD operations with JPA and JSP] (https://mmafrar.medium.com/implementing-spring-boot-mvc-crud-operations-with-jpa-and-jsp-4dfa1882b4a3) or feel free to clone the below repository.

{% github mmafrar/spring-mvc-crud-example %}

Once you have a project to work on, open **build.gradle** file and under plugins change id ‘java’ to id ‘war’ and add the below dependencies to the project.

```
implementation 'org.apache.tomcat.embed:tomcat-embed-jasper'
implementation 'org.springframework.boot:spring-boot-starter-tomcat'
```
If you’re using Maven as the build tool, update the ***pom.xml*** file. Then open the main Spring Boot application and make below changes.

{% gist https://gist.github.com/mmafrar/74afc82cf59de871d8b60870dd2012f7 %}

Next login to AWS Management Console. From the search bar look for Elastic Beanstalk and navigate to the page. Click on ***Create Application*** button to open Create a web app form. Make sure to provide a suitable name for the application. Select the values in the image for the dropdowns. Upload *.war file and click on Create application.

![Create a web app form](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6fmr34sq2zu4lo9s7goa.png)

You’ll be displayed with the steps and progress on provisioning the resources needed to deploy the application. This will take some time based on the size and resources required for the project. If the deployment was successful you’ll be seeing the shown screen.

![Environment page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/shejxy56j38s2hvu1ir5.png)

Click on the domain name displayed on the screen to open the application. Use **Upload and deploy** button to publish a different version of the code.
___

Happy Coding! Below is a DEV Community video I have published. Also, you might be interested to check my Medium story [Setting up continuous integration in Spring Boot with GitHub and CircleCI] (https://medium.com/geekculture/setting-up-continuous-integration-in-spring-boot-with-github-and-circleci-f2e68690e138).

{% link mmafrar/how-to-add-an-icon-for-an-ios-app-312c %}

Cover Image: Photo by [Austin Distel] (https://unsplash.com/@austindistel) on [Unsplash] (https://unsplash.com)
Animation In Flutter: Animation Class, Tween & CurvedAnimation
Tags: flutter, dart, animation, programming
Published: 2021-09-30 05:18:35

* In the previous article, we saw how to use AnimationController to control our animation. We will further customize our basketball animation in this article.
* The following is an example of our earlier animation:
* ![animation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rox2gnwfokbdugbyelwc.gif)
* Because of the lack of a smooth bouncing effect, the above animation appears strange. Let's make this animation better.
* But first, let's have a look at the basic Animation library that comes along with the Flutter SDK.

----------

## Animation:
* Animation is a core library of the Flutter. This is an abstract class. It means we won't be able to instantiate it.
![animtioninstantiate](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ebkwqmymnoy0ccaen9i0.png)
* We can track the animation's completion and dismissal using an instance of the Animation class. In addition, we can check the status of the currently running animation.
* Let's first create an Animation instance in our app.
```
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
    late Animation _animation;
//.....
}
```
* A value of type T is assigned to an animation. It means that we can make an animation for almost any datatypes. For example, we can make:
![animationType](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d4tmwdj6xs22zgpgksmw.png)
* In our case, we want an animation of type double. Because we want to translate the ball position which is of type double. So let's update the Animation type.
```
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
    late Animation<double> _animation;
//.....
}
```
* As previously stated, Animation is an abstract class. It has no idea what is going on on-screen. It only understands the values that are passed to it and the state of that specific animation.
* The Animation provides us with more control over defining the upperBound and lowerBound values of the animation, i.e. the begin and end values.
* When the controller plays this animation, it generates interpolated values between the begin and end points. We use that interpolated value to animate our widget.
* But now comes the question of how to make an animation? To do so, let us first define Tween.

---------

Read the rest on [my website](https://dhruvnakum.xyz/animation-in-flutter-animation-class-tween-and-curvedanimation)
[Java] Converting PDF to SVG
Tags: java, pdf, svg, api
Published: 2021-09-30 06:40:10

SVG (Scalable Vector Graphics) is a vector image format that can be searched, indexed, scripted, compressed, and can be scaled in size without loss of quality. In this article, I will share the following two ways to convert a PDF file to SVG format using Free Spire.PDF for Java.
● Converting each page of the PDF file into a single SVG file.
● Converting multiple pages of the PDF file into one SVG file.

**Import jar dependency**
**Method 1:** Download the [free library](https://www.e-iceblue.com/Download/pdf-for-java-free.html) and unzip it. Then add the Spire.Pdf.jar file to your project as dependency.
**Method 2:** Directly add the jar dependency to maven project by adding the following configurations to the pom.xml.
```xml
<repositories>
    <repository>
        <id>com.e-iceblue</id>
        <name>e-iceblue</name>
        <url>http://repo.e-iceblue.com/nexus/content/groups/public/</url>
    </repository>
</repositories>
<dependencies>
    <dependency>
        <groupId>e-iceblue</groupId>
        <artifactId>spire.pdf.free</artifactId>
        <version>4.4.1</version>
    </dependency>
</dependencies>
```

**Sample 1: Converting a 3-page PDF file to 3 SVG files**
```java
import com.spire.pdf.*;

public class ToSVG {
    public static void main(String[] args) {

        //Load the PDF file
        PdfDocument pdf = new PdfDocument();
        pdf.loadFromFile("Island.pdf");

        //Save to SVG image
        pdf.saveToFile("ToSVG.svg", FileFormat.SVG);
        pdf.close();
    }
}
```
![ToSVG1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qplrpe4mm0gjqtep3472.jpg)

**Sample 2: Converting a 3-page PDF file to 1 SVG file**
```java
import com.spire.pdf.*;


public class PDFtoSVG {
    public static void main(String[] args) throws Exception {

        String inputPath = "Island.pdf";

        PdfDocument document = new PdfDocument();
        document.loadFromFile(inputPath);

        document.getConvertOptions().setOutputToOneSvg(true);

        document.saveToFile("output.svg", FileFormat.SVG);
        document.close();
    }
}
```
![ToSVG2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2pdal6wkx91jijmq1x0d.jpg)
Getting Started with HTML
Tags: html, webdev, beginners
Published: 2021-09-30 09:51:59

### Get Started

**What do you need**  

  > Any code editor and a browser on your 💻
  >>Here are some good options
  >> - [VSCode](https://code.visualstudio.com/)
  >> - [Atom](https://atom.io/)
  >
  >> And these are some really useful VSCode extensions
  >> - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
  >> - [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)


## Basics of HTML


This is the structure of a basic HTML Document
```HTML
<!DOCTYPE html>
<html>
    <head>
        <title>Page Title here</title>
    </head>
    <body>

        Write anything here
        
    </body>
</html>
```

Let me Break it down for you
- `<!DOCTYPE html>` - Used to decalre that it is a HTML5 Document
- `<html>` - The whole HTML document is written inside the the `<html>`and`</html>` tag
- `<title>` - Used to define the title of your webpage
- `<body>` - Everything you see inside the browser are written inside the `body` tag
 
Now Here's the list of some really useful tags
- `<div></div>`
- `<p></p>`
- `<span></span>`
- `<b></b>`
- `<i></i>`

## Here are some cool resources you could refer to
 - [W3Schools](https://www.w3schools.com/html/)
 - [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML)
Have you ever needed to import CSV files from your users? 3 super tools that that make this a breeze!
Tags: webdev, csv, dataimporter, datauploader
Published: 2021-09-30 11:50:43

If you've ever tried to implement a CSV importer, you know how annoying it can be to devote expensive development time to a feature only to see your users struggle with it.

In certain cases, developers aim to improve the user experience by providing FAQs and tutorials that explain consumers how to use their importer appropriately. This, on the other hand, simply moves the burden from the product to the user. Users don't want to go through pages of instructions or watch video tutorials just to submit a simple spreadsheet. 

Here are 3 CSV importers that make CSV collection 10x faster:

## [1. csvbox.io](https://csvbox.io)
CSVbox a no-code CSV importer that helps to implement a production-ready import feature in your web app in just a few minutes. Your users get an elegant upload experience as they upload CSV, Excel files, map columns and validate data all in the importer itself. You get ready-to-use clean data in your app, database or API. 

## [2. Flatfile.com](https://flatfile.com)
Flatfile Portal is the AI-powered data importer that makes self-serve data onboarding seamless. Flatfile's data onboarding platform ensures that companies can import data quickly and seamlessly and that it's clean and ready to use. CSV or XLS files are ingested and you can set target data models for data validation, allowing users to match incoming file data. With features like automatic column matching recommendations, Flatfile learns over time how data should be organized, which helps make the data onboarding process more efficient for your customers. Flatfile's validation features provide control over how data is formatted. 

## [3. Papaparse](https://www.papaparse.com/)
Papaparse is a fast and powerful CSV parser for the browser that supports web workers and streaming large files. Its a robust JavaScript library that is claimed to be the fastest in-browser CSV parser. This is your one-stop-shop for parsing CSV to JSON.
3 Sites for FREE UI KITS!
Tags: webdev, productivity, design, uiweekly
Published: 2021-09-30 13:37:14

_Save for later._
<br/>

### [uistore.design](https://www.uistore.design/)
![uistore](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9uy11pu2agd6r1978mwz.png)
<br/>

### [ui8.net](https://ui8.net/)
![ui8](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gpx26d5ofywyr4z1d7ex.png)
<br/>

### [uispace.net](https://uispace.net/)
![uispace](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tmiv5avpkvmq63eivwrt.png)
<br/>

P.S. Want the next post to be something specific? Do let me know in the comments.

🤘🏻
<br/>
Connect with me : [Github](https://github.com/deyRupak)
Support me : [Buy me a coffee!](https://paypal.me/deyrdx?locale.x=en_GB)
Começando com Spark
Tags: datascience, javascript
Published: 2021-09-30 17:38:33

O Spark é uma ferramenta para processamento de dados em grande escala, escrita na linguagem de programação funcional **Scala**, possui foco em velocidade, facilidade de uso e análises sofisticadas. Netflix, Yahoo e eBay são algumas empresas que implementaram soluções através do Spark. 

## Spark Ecosystem

O ecossistema Spark inclui cinco componentes principais: Spark Streaming, MLlib e GraphX, Spark SQL e Spark Core.

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

### Spark Streaming

O Spark Streaming facilita a criação de soluções de streaming escalonáveis e tolerantes a falhas. Ele traz a API integrada à linguagem Spark para o processamento de stream, para que você possa escrever jobs de streaming da mesma forma que os jobs em lote. O Spark Streaming oferece suporte a Java, Scala e Python, e apresenta semânticas "exatamente uma vez" com estado, prontas para uso. 

### MLlib

MLlib é a biblioteca de machine learning escalonável do Spark com ferramentas que tornam a ML prática escalonável e fácil. MLlib contém muitos algoritmos de aprendizado comuns, como classificação, regressão, recomendação e clustering. Também contém fluxos de trabalho e outros utilitários, incluindo transformações de recursos, construção de pipeline de ML, avaliação de modelo, álgebra linear distribuída e estatísticas.

### GraphX

GraphX é a API Spark para gráficos e computação paralela a gráficos. É flexível e funciona perfeitamente com gráficos e coleções. Unifica extrair, transformar, carregar, análise exploratória, e computação gráfica iterativa em um sistema. Além de uma API altamente flexível, GraphX vem com uma variedade de algoritmos de gráfico. Ela compete em desempenho com os sistemas gráficos mais rápidos, mantendo a flexibilidade, tolerância a falhas e facilidade de uso do Spark.

### Spark SQL 

Spark SQL é o módulo Spark para trabalhar com dados estruturados que oferece suporte a uma maneira comum de acessar uma variedade de fontes de dados. Ele permite consultar dados estruturados dentro de programas Spark, usando SQL ou uma API DataFrame familiar. O Spark SQL oferece suporte à sintaxe HiveQL e permite o acesso a armazenamentos existentes do Apache Hive. O modo de servidor fornece conectividade padrão por meio de conectividade de banco de dados Java ou conectividade aberta de banco de dados.

### Spark Core

O Spark Core é um mecanismo de processamento de dados distribuído de uso geral. Além disso, há bibliotecas para SQL, processamento de stream, machine learning e computação gráfica, sendo que todas elas podem ser usadas juntas em um aplicativo. O Spark Core é a base de todo um projeto, fornecendo despacho distribuído de tarefas, programação e funcionalidades básicas de E/S.

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

That's all folks! ✌️
Which companies are doing DevRel?
Tags: devrel
Published: 2021-09-30 19:01:44

Have you ever been asked or wondered -  "How many companies have a DevRel program?"

So have we, and we never had a good answer, or a reference to point to so we created a Developer Relations Program Directory.

Developer Products include APIs, SDKs, HDKs, tools, and reference designs. There are also Developer Services from hackathon organizers, recruiters and app stores.

What's missing or inaccurate? Check it out and let us know.
As of this post - we have 760 companies.
[DevRel Program Directory](https://www.devrelbook.com/devreldirectory)