teleren/devto huggingface dataset:
Advantages And Disadvantages Of Java Programming Language
Tags: javascript
Published: 2022-05-15 01:56:23

**Java Advantages**

1. Multiplatform

The main advantage of Java is that it can run on multiple  platforms  /  computer operating systems  , in accordance with the principle of  write once, run anywhere . With this advantage the programmer simply writes a Java program and compiles (converted, from a human -understood language to a machine language /  bytecode ) once and then the result can be run on multiple platforms without changes. This advantage allows a java -based program to work on the Linux operating system but run well on Microsoft Windows. Platforms supported to date are  Microsoft Windows ,  Linux ,  Mac OS  and 

Sun Solaris . The reason is that each operating system uses its own program (which can be downloaded from a Java site) to interpret  the bytecode  .

2. Complete Classroom Library

Java is known for its  library equipment ( a  group of programs included in java programming) that is very easy to use by programmers to develop their applications. The completeness of this library is coupled with the existence of a large Java community that is constantly creating new libraries to cover all application development needs.

3. C ++ style

It has syntax like the  C ++ programming language  so it attracts many C ++ programmers to move to Java. Currently there are many Java users, most of them are C ++ programmers who have moved to Java. Universities in the  United States  are also beginning to move by teaching Java to new students because it is easier for students to understand and can be useful as well for those who are not majoring in computers.

4. Garbage Collection

Automatically, it has the facility of setting memory usage so that programmers do not need to perform memory settings directly (as is the case in the widely used C ++ language).

**Deficiency**

1. Write Once, Run Anywhere

There are still some things that are not compatible between   one  platform and  another. For  J2SE , for example  SWT-AWT bridge  which until now does not work on  Mac OS X.

2. Easy to Decompile

Decompilation is the process of turning from current code into source code. This is possible because Java-based code is a  bytecode  that stores many high-level language attributes, such as class names, methods, and data types. The same is true of the  Microsoft .NET Platform . Thus, the algorithm used by the program will be more difficult to hide and easily hijacked/ reverse-engineered .

3. Excessive Memory Consumption

Memory usage for Java -based programs is much greater than previous generation high -level languages ​​such as C/ C ++  and  Pascal (more specifically,  Delphi  and  Object Pascal ). Usually this is not a problem for those who use the latest technology (because the trend of installed memory is getting cheaper), but a problem for those who still have to struggle with computer machines older than 4 years.
For...of? Or for...in? Which to choose!
Tags: javascript, beginners
Published: 2022-05-14 23:06:53

Need to iterate through some properties, but not sure which statement to choose? I got you. 

According to our handy-dandy MDN, "the [`for...of`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of) statement creates a loop iterating over iterable objects." Iterable objects are those that have a default behavior when iterating such as Array or Map. 
The [`for...in`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in#why_use_for...in) statement iterates over all enumerable properties of an object that are keyed by strings." Enumerable properties are properties that are set to true by default. So no symbol properties will work with this loop! Because it iterates over all of the properties, it may be helpful to use `for...in` when debugging. 

Take a look at the examples below.
##for...of:
```
const superHeroes = ["Super Man", "Batman", "Hawkgirl", "Wonder Woman"]

for(const superHero of superHeroes) {
  console.log(superHero)
}
// expected output: Super Man
// expected output: Batman
// expected output: Hawkgirl
// expected output: Wonder Woman
```
In this example above, superHeroes is our array of objects. `for...of` returns the values. In this case, they are Super Man, Batman, Hawkgirl, and Wonder Woman while the keys are the indexes of each — 0, 1, 2, 3. If you're unsure which index belongs to which property, you can always use indexOf method or simply change the `for...of` to a `for...in` loop to see the keys. 

##for...in:
```
const heroIdentities = {
  "Clark Kent": "Super Man",
  "Bruce Wayne": "Batman",
  "Shayera Hol": "Hawkgirl",
  "Diana": "Wonder Woman"
}
for(const identity in heroIdentities) {
  console.log(`${identity} is: ${heroIdentities[identity]}`)
}
// expected output: Clark Kent is: Super Man
// expected output: Bruce Wayne is: Batman
// expected output: Shayera Hol is: Hawkgirl
// expected output: Diana is: Wonder Woman
```
In the `for...in` example, you have an object, heroIndentities, which has key/value pairs in it. The keys are the names of the superheroes: Bruce Wayne, Clark Kent, etc. The values are their aliases: Super Man, Batman, etc. `for...in` iterates and returns the keys. The reason my examples output returns both the key and the value is because I used bracket notation —`heroIdentities[identity]`— to access the objects properties.

Rule of thumb: `for...of` is typically used for arrays or array-like objects and `for...in` is typically used for objects.
Intermediate to Advanced Machine Learning Project Ideas
Tags: machinelearning, deeplearning, datascience
Published: 2022-05-15 01:22:46

- [Uber Data Analysis Project](https://data-flair.training/blogs/r-data-science-project-uber-data-analysis/)
- T-rex Dino Bot
- [Handwritten Character Recognition](https://data-flair.training/blogs/handwritten-character-recognition-neural-network/)
- [Brain Tumor Detection with Data Science](https://www.kaggle.com/navoneel/brain-mri-images-for-brain-tumor-detection)
- [Detecting Parkinson’s Disease](https://data-flair.training/blogs/python-machine-learning-project-detecting-parkinson-disease/)
- Lane Line Detection
- [Credit Card Fraud Detection Project](https://data-flair.training/blogs/data-science-machine-learning-project-credit-card-fraud-detection/)
- [Leaf Disease Detection](https://www.kaggle.com/sizlingdhairya1/leaf-disease)
- [Color Detection with Python](https://data-flair.training/blogs/project-in-python-colour-detection/)
- Optimal Path
- [Cartoonify Image with Machine Learning](https://data-flair.training/blogs/cartoonify-image-opencv-python/)
- [Speech Emotion Recognition Machine Learning Project](https://data-flair.training/blogs/python-mini-project-speech-emotion-recognition/)
- Next word predictor
- [Automatic License Number Plate Recognition System](https://techvidvan.com/tutorials/python-project-license-number-plate-recognition/)
- Game of Chess
- [Xbox Game Prediction Project](https://www.kaggle.com/c/acm-sf-chapter-hackathon-small/overview)
- [Music Genre Classification Machine Learning Project](https://data-flair.training/blogs/python-project-music-genre-classification/)
- [Online Grocery Recommendation using Collaborative Filtering](https://data-flair.training/blogs/data-science-r-movie-recommendation/)
- [Emojify – Create your own emoji with Python](https://data-flair.training/blogs/create-emoji-with-deep-learning/)
- [Sentiment Analysis using Machine Learning](https://data-flair.training/blogs/data-science-r-sentiment-analysis-project/)
- [Loan Prediction using Machine Learning](https://www.kaggle.com/altruistdelhite04/loan-prediction-problem-dataset)
- [MNIST Digit Classification Machine Learning Project](https://data-flair.training/blogs/python-deep-learning-project-handwritten-digit-recognition/)
- [Wine Quality Test Project](https://archive.ics.uci.edu/ml/datasets/wine+quality)
- [Fake News Detection Project](https://data-flair.training/blogs/advanced-python-project-detecting-fake-news/)


Happy coding!
You're Not Very Consistent, Are You?
Tags: consistency, todayilearned, beginners, habits
Published: 2022-05-15 01:13:43


## Table of Contents <a name="TOC">
1. [What is "Consistency"](#what-is-consistency)
2. [Benefits from Being Consistent](#benefits-from-being-consistent)
3. [Principles of Consistency](#principles-of-consistency)
4. [Tips for Consistency](#tips-for-consistency)


### What is Consistency
Consistency means focusing on the task at hand in the present moment while maintaining a long term vision.

Consistency:

- allows for measurement
- creates accountability
- establishes your reputation
- makes you relevant
- maintains your message

"The more you do something, the better you get at doing it. And when you get better, improving your performance gets easier."

> “Small disciplines repeated with consistency every day lead great achievements gained over time” — John Maxwell

### Benefits from Being Consistent

- Reflecting on our practice
- Engaging in self-care
- Greeting our learners
- Maintaining a positive classroom environment
- Teaching through a culturally diverse lens
- Providing meaningful and useful feedback
- Helps students retain information
- Develop the discipline of routine
- Establish an environment of trust
- Listening with empathy and understanding
- Adding-value to others
- Investing time in cultivating relationships with both colleagues and learners
- Embracing quiet time or mindfulness
- Inspiring curiosity and incorporating opportunities for creativity
- Providing time for exploration and inquiry
- Engaging in team-building to foster communication and collaboration
- Leveraging social-emotional learning
- Foster a learning environment that embraces every individual for who they are and their unique differences


### Principles of Consistency

1. Patience
2. Belief
3. Value

### Tips for Consistency

1. Reminders
2. Reward yourself when you get even the smallest tasks done
3. Correct mistakes right away
4. Use motivational tools to keep going
5. Give yourself time to see the compound changes
6. Know the results you are aiming for
7. Know what time you have available to word towards your goals
8. Work out what's the most important next step
9. Write your tasks in your schedule
10. Take action each and every day

Happy coding!
I want to convert an HTML file in express...
Published: 2022-05-15 01:10:49

First of all, I want you to see there.

index.js quote
```js
webdata = (fs.readFileSync(__dirname + '/web/wiki.html', 'utf8'));
webdata=String(webdata)
webdata = webdata.replace('{tmp.data.name}',articlesname);
 res.end(webdata);
```

web/wiki.html
```html
<!DOCTYPE HTML>
<html>
<head>
...
</head>
    <body>
      <h2>${tmp.data.name}</h2>
      <hr>
      <br>
      <div id="article">
          ：
          ：
    </body>
</html>
```

Next, I will explain what I want to do.

I want to use replace to read the string "$ {tmp.data.name}" in HTML and use Node.js Express to make it the content of a variable.

However, 
```js
webdata=String(webdata)
webdata = webdata.replace('{tmp.data.name}',articlesname);
```
does not work.
Variables are defined.
Also, I couldn't try it with a string instead of a variable.
Please help me...
Responsive sidebar using React and Tailwind with dark mode and react-router
Tags: react, tailwindcss, javascript, webdev
Published: 2022-05-15 00:19:00

I was searching for a simple layout with responsive sidebar and support for dark mode built with react and tailwind. And I decided to create one myself.

Supports light and dark mode 
Responsive Side Bar 
Mobile Menu
[Live Website](https://react-tailwind-dark-sidebar.netlify.app/)

No third party libraries used!

Feel free to contribute and extend it in any suitable way :)

{% embed https://github.com/idrsdev/react-sidebar-tailwind-darkmode %}

Connect with me :)
[LinkedIn](https://www.linkedin.com/in/malik-idrees/)
Fiverr: [imidrees](https://www.fiverr.com/share/27Yy04) ✨
How to easily make a new type by removing or omitting certain properties from another type in TypeScript?
Tags: typescript
Published: 2022-05-15 00:00:00

---
  title: How to easily make a new type by removing or omitting certain properties from another type in TypeScript?
  published: true
  tags: TypeScript
  date: Sun May 15 2022 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/easily-make-new-type-by-removing-certain-properties-from-another-type-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-ae6f9ad8cde86b841c3df7752a71acc8.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/easily-make-new-type-by-removing-certain-properties-from-another-type-typescript)
  
To easily make a new type by removing or omitting certain properties from another type in TypeScript, you can use the `Omit` utility type and pass the name of the type you want to remove the properties from as its first type argument, and the properties you need to remove as a string literal union type or as a string as its second type argument.

### TL;DR

```ts
// a simple interface
interface Person {
  name: string;
  age: number;
  dob: string;
  salary: number;
}

// make new type by omiting the `salary`
// property from the `Person` interface
// using the `Omit` utility type
type NecessaryDetails = Omit<Person, "salary">;

/*
Content of `NecessaryDetails` type
    
{
    name: string;
    age: number;
    dob: string;
}
*/
```

For example, let's say we have an interface called `Person` with some properties called `name` having the type of string, `age` having the type of `number`, `dob` having the type of `string`, and `salary` having the type of `number` like this,

```ts
// a simple interface
interface Person {
  name: string;
  age: number;
  dob: string;
  salary: number;
}
```

Now let's say we need to make a new type where we need the `name`, `age`, and the `dob` properties but not the `salary` property from the `Person` interface, to do that we can use the `Omit` utility type and pass the `Person` type as its first type argument and string `salary` as its second type argument like this,

```ts
// a simple interface
interface Person {
  name: string;
  age: number;
  dob: string;
  salary: number;
}

// make new type by omiting the `salary`
// property from the `Person` interface
// using the `Omit` utility type
type NecessaryDetails = Omit<Person, "salary">;

/*
Content of `NecessaryDetails` type
    
{
    name: string;
    age: number;
    dob: string;
}
*/
```

Now if you hover over the `NecessaryDetails` type, you can see that the `name`, `age`, and `dob` properties are picked from the `Person` interface except the `salary` property which is now available in the `NecessaryDetails` type.

We have successfully made a new type by removing or omitting certain properties from another type in TypeScript. Yay 🥳!

See the above code live in [codesandbox](https://codesandbox.io/s/easily-make-new-type-by-removing-certain-properties-from-another-type-typescript-dp9fjv?file=/src/index.ts).

That's all 😃!

### Feel free to share if you found this useful 😃.

---
Dockerize a React App with node and nginx and how to push an image to Docker Hub
Published: 2022-05-14 23:48:28

## Hi, Devs!

Let's see a React app dockerized and how to push the image the we are going to create to the Docker Hub.


![React, Docker and Nginx](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3kcclo2jgnpi09hlv8v1.png)

First if you need to search the main docker commands, look at: https://docs.docker.com/engine/reference/commandline

You need to create one specific user with the write, read and delete privileges to avoid the message _The common error is the message: requested access to the resource is denied_. Look at https://docs.docker.com/docker-hub/access-tokens/

After creating an access token on docker hub:
```
docker login -u <username>
```
---

Creating a React App with:
```
npx create-react-app my-app
```

We are going to use https://hub.docker.com/_/node, into the src folder we can create the Dockerfile and copy these commands.
```
FROM node AS prod
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
# RUN npm test - if you want to test before to build
RUN npm run build

FROM nginx:alpine AS prod
WORKDIR /usr/share/nginx/html
COPY --from=prod /app/build .
EXPOSE 80
# run nginx with global directives and daemon off
ENTRYPOINT ["nginx", "-g", "daemon off;"]
```

Into src folder, you can create the .dockerignore and add it:
```
/node_modules
```

Execute the Docker image build:
```
docker image build -t react:v1 .
```

After you built an image, let’s run to verify if it is working.
```
docker run -dit -p 3300:80 --name react react:v1
```

To get the container id:
```
docker container ls 
```

After you got the container id you can use it and commit the container:
```
docker container commit <id-container> react:v1
```

Let’s looking for the image that we built before and get the id:
```
docker images
```

Looking at the output of the `docker images` command, we can see the repository name, tag and image id. We need to create a tag:
```
docker tag <image-name:tag> <your-repository>/image-name:image-name-repository

docker tag react:v1 luizcalaca/react:react
```

The last is the push:
```
docker push <repository>/<tag>

docker push luizcalaca/react:react
```

**Contacts**
Email: luizcalaca@gmail.com
Instagram: https://www.instagram.com/luizcalaca
Linkedin: https://www.linkedin.com/in/luizcalaca/
Twitter: https://twitter.com/luizcalaca
Day 36: I tried, I failed but It's okay
Published: 2022-05-14 23:41:27

Hi!
So I tried to write get the article ready by today but I failed I was just writing about   Jest and React testing Library trying to rush everything so that I can sleep finished but it i tried to run the tests and they failed so I will have to debug it tomorrow I'm not thinking clearly.
But I think it's okay Afterall today was a productive one I was able to setup material UI for my project and helped a friend with his own project Heroku deployment 
The plan for tomorrow is to finish this article prepare for incoming articles about GitHub actions which are going to be the longest I want also to introduce redux in the app so it will be a busy one but I think I can manage. we will see

signing off...
Next.js Image Component Cheatsheet
Tags: nextjs, react, javascript, ecommerce
Published: 2022-05-14 22:51:51

_Cheatsheet for Next.js Image Component with common use cases_

After the introduction of the Image component in Next.js version 10, it is rare to use Next.js with the regular `<img />` component and is now even considered incorrect! This Article is to help you learn and remember the most common uses cases for the Next.js Image component.


## Quick Cheatsheet:

_**1. with predefined width and height:**_

```
import Image from 'next/image'
import example from '../asset/myimage.png'

const Example = () => {
  return (
    <Image
      src={example}
      alt="Alt text for the picture"
      width="350px"
      height="300px"
    />
)

```



_**2. with predefined width and height with layout prop:**_

With the layout prop, you get 5 options:

'fill'
'responsive'
'intrinsic'
'fixed'
and now 'raw'

```
import Image from 'next/image'
import example from '../asset/myimage.png'

const Example = () => {
  return (
    <Image
      src={example}
      alt="Alt text for the picture"
      width="350px"
      height="300px"
      layout="responsive" 
  />
)
```



_**with layout fill (dynamic image size)**_

```
import Image from 'next/image'
import example from '../asset/myimage.png'

const Example = () => {
  return (
    <Image
        src={example}
        alt="Alt text for the picture"
        layout="fill"
        objectFit="cover"
        quality={100}
   />
)
```



_**3. styling using Tailwind CSS**_

```
import Image from 'next/image'
import example from '../asset/myimage.png'

const Example = () => {
  return (
    <div className="relative w-24 h-24 border border-gray-200 rounded-md overflow-hidden">
        <Image
           src={product.image}
           alt={product.title}
           layout="fill"
           objectFit="cover"
       />
    </div>
)
```



_**4. Next.js Image as a background image**_

```
import Image from 'next/image'
import example from '../asset/myimage.png'

const Background = () => (
  <div>
    <ViewSource pathname="pages/background.js" />
    <div className="fixed h-screen w-screen overflow-hidden
  -z-10">
      <Image
        alt="Mountains"
        src="/mountains.jpg"
        layout="fill"
        objectFit="cover"
        quality={100}
      />
    </div>
  </div>
)

```


In the comments below, suggest some of your own favorite/most common use cases!

_Learn more about Next.js at [BuildNextShop.com](https://www.buildnextshop.com)_
Managing a team's stress
Tags: leadership, culture, management
Published: 2022-05-14 22:46:49


As a leader, it can be tempting to push your team to get the most out of them and to get results. People don't like like saying no and often just want to be helpful and give it their all. Many people will even offer to do things like take a meeting on a personal day or work a bit later for a week or two. While it's important to respect people's privacy and their right to manage their own lives, it's also your responsibility to do what you can to discourage burnout.

I’ve found the best ways to manage this is to limit the amount of unnecessary stress at work, keep your ear very close to the ground, and use smoke signals. Some strategies

- Lead by example, I once saw a manager leave a note in slack saying they were going to take that day off because they "woke up grumpy". That's awesome leadership, it encourages others to do the same and normalizes the idea of a mental health day. 

- Experiment with mandatory time off; my last role had flexible PTO so it was originally a safeguard to prevent people from not taking it. Apart from a minimum, we said that part of it must be consecutive. I made it clear that I would deduct from bonuses if people don't take enough. 

- Be clear and transparent. Don't make people stress out about unknowns. While constant reprioritization is a stressor, once you know about something it doesn't hurt to fill the team in. If you are setting expectations define them as much as possible and make yourself around to answer questions if/when there ends up still being unclarity.

- Don't write or respond to emails after work hours; I may be working but I don't want to publicize (and certainly not glorify) it or compel people to respond. Gmail has a feature to schedule emails for the next day, so does slack.

- Respect people’s privacy. Let people know they don't need to give a reason for taking time off and make sure not to ask for details unless people volunteer them. 

- Be there if someone is working off-hours. In my line of work, it was very rare for anyone to have to work nights or weekends. For the few times we needed to I made sure to be there (in person or virtually) as well. 

- Smoke signals; besides traditional 1-1s and retros, I did a weekly session where I take a bunch of gifs and put them on a miro board, then everyone goes around and talks about which one they feel most like. I had a "dumb manager" idea and created a dashboard to emulate a Brazilian steakhouse, (put up a green card if you need more stuff to do, put on a red if you are full), no one really used it but I don't regret trying. 

At the end of the day, people will live their own lives. Stress can come from many places and while you can never eliminate it completely, it doesn't hurt to try to reduce it if you can. A less stressful team is more effective, happier, less likely to leave and just results in a more fun environment.