teleren/devto huggingface dataset:
JavaScript Interview Question #21: ISO Date
Tags: beginners, webdev, javascript, codenewbie
Published: 2021-02-24 13:19:38

![js-test-21](https://learn.coderslang.com/js-test-21.png)

How does the ISO date look in JavaScript? What will be logged to the console?	

.

.

.

.

.

.

.

.

.

.

.

.

.

.

.

.

In the first line, we create a new `Date` object.

It holds the current date and time.

The function `toISOString` returns the string representation of the `date` object in the `ISO` format. It starts with the year and ends with time. Something like `2020-12-27T10:35:26.159Z`.

When we’re [slicing this string](https://learn.coderslang.com/js-test-29-slice-and-dice/) with `slice(0, 4)` we’ll get the first four characters, which represent the year.

---

**ANSWER**: the current year will be logged to the console.

[Learn Full Stack JavaScript](https://js.coderslang.com)
SQL: Calculate Bussiness Days
Tags: sql, sqlserver, mysql
Published: 2021-02-24 13:16:20

In this example I'm going to give the query to find the business days between two days.

Use this function to calculate the number of business days excluding Saturday and Sunday. Also it will exclude start date and it will include end date.

```
go
-- Select [dbo].[CalculateBussinessDays]  ('02/18/2021', '03/06/2021')
CREATE or ALTER FUNCTION [dbo].[CalculateBussinessDays] ( 
	@StartDate DATETIME,
	@EndDate  DATETIME 
)
returns INT AS
BEGIN
  DECLARE @tempStartDate     DATETIME= @StartDate;
  DECLARE @tempEndDate       DATETIME = @EndDate;
  
  IF(@tempStartDate IS NULL
  OR
  @tempEndDate IS NULL)
  BEGIN
    RETURN NULL;
  END
  --To avoid negative values reverse the date if StartDate is grater than EndDate
  IF(@StartDate > @EndDate)
  BEGIN
    SET @StartDate = @tempEndDate;
    SET @EndDate = @tempStartDate;
  END

  DECLARE @Counter           INT = Datediff(day,@StartDate ,@EndDate);
  DECLARE @TempCounter       INT = 0;
  DECLARE @TotalBusinessDays INT = 0;

  WHILE @Counter >= 0
  BEGIN
    IF(@TempCounter > 0 OR @Counter = 1) -- To ignore first day's calculation
	Begin
		SET @TotalBusinessDays = @TotalBusinessDays 
                                        + (Iif(Datename(dw, Dateadd(day,@TempCounter,@StartDate)) 
                                            IN('Monday', 'Tuesday','Wednesday','Thursday','Friday'),1,0))
	END

    SET @Counter = @Counter - 1
    SET @TempCounter = @TempCounter +1
  END
  RETURN @TotalBusinessDays;
END



```
[Software Newbies] What’s your experience since bootcamp?
Tags: career, beginners, podcast
Published: 2021-02-24 13:14:54

Making a career change to software engineering is not an easy decision. I, for example, have millions of questions: Can you really get a job after coding bootcamp? How much you will make? How well do bootcamps prepare you for employment?

I'm planning to join in a clubhouse event this week, “Software Newbie’s Hangout”. They are talking about real-life experiences after bootcamp graduation.

Come and join us, if you want to hear some inspiring career stories and hopefully share yours!

Thursday, Feb 25 at 19.00 CET on Clubhouse! https://loom.ly/bXby2R0
Show off your Terminal Setup 👩🏻‍💻💯
Tags: watercooler, discuss, productivity
Published: 2021-02-24 13:05:42

---
title: Show off your Terminal Setup 👩🏻‍💻💯
published: true
description: Monthly Terminal Setup Show off and Few others
tags: watercooler, discuss, productivity 
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ahod8gtae6bu2yfswknq.jpg
---
After the ***["Show off Your VSCode Setup"](https://dev.to/xenoxdev/show-off-your-vscode-setup-5no)*** it's time for Terminal setups. So I will go first, here is my setup:
{% twitter 1364553220840853521 %}

![Screenshot 2021-02-24 at 3.51.30 PM](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8co8iagxdiuw2rm62n5t.png)
 
𝗧𝗲𝗿𝗺𝗶𝗻𝗮𝗹: Hyper 
𝗧𝗵𝗲𝗺𝗲: Shades of Purple 
𝗙𝗼𝗻𝘁: Cascadia Code PL
 

***Plugins I ❤️***

*For every terminal*
- [spaceship-prompt](https://github.com/denysdovhan/spaceship-prompt) : Spaceship is a minimalistic, powerful and extremely customizable Zsh prompt. 
- [Powerlevel10k](https://github.com/romkatv/powerlevel10k)
- [git-extra-commands](https://github.com/unixorn/git-extra-commands)

-----

*For Hyper only*
- [hypercwd](https://github.com/hharnisc/hypercwd): Opens new tabs with the same directory as the current tab in Hyper for OS X, Linux and Windows.
- [HyperLine](https://github.com/Hyperline/hyperline): HyperLine is a status line plugin for Hyper.app. 
- [Hyper pane](https://github.com/chabou/hyper-pane): Extension for Hyper.app to enhance pane navigation. 
 
 So tell me what's your current terminal setup look like? I'm Curious.

![](https://media.giphy.com/media/6pUBXVTai18Iw/giphy.gif)
CSS.GG + Vercel  & Updates
Tags: css, webdev, html
Published: 2021-02-24 12:52:21

Hello everyone, 

Long time no see. Short update. 

First of all thank you to every single one of you who has contributed for this project to be where it is, with a single like, star or using it on your project. 

So far this has been incredible
7,140 Stars on Github
17,000 Figma copies

And much more that I can't even track

Thank you. 

{% github astrit/css.gg %}

---

Now to the fun stuff. 

I have been working on the new version and trying to listen to the feedback that people got and also checking the analytics on what people are using most. 

As a conclusion the SVG version naturally is being used more, after that the Figma version mainly by UI Designers. 

Based on this I decided to do the new version on SVG primarily with the CSS version being there as a downloadable option.

Also I have been developing some other modules* that are going to be part of the project so stay tuned for this when I announce on [twitter](https://twitter.com/astrit) and [youtube](https://youtube.com/astrit)

---

🍒 And the cherry on top. 

Getting sponsored by Vercel.

I totally forgot to announce since I was working on the project and wanted to do it on the release but not here we go.

So I would like to personally thank Guillermo from Vercel for making this happen and enabling me to use my favourite framework and platform on the new version. 

---

Plug: 
As you might already know I have started to create videos on youtube and if you like my work or you want to learn how to do CSS animations please make sure to [subscribe](http://bit.ly/astritsub)

{% youtube RTLM2SyEL6o %}
JavaScript setTimeout, how to delay the function execution
Tags: beginners, webdev, codenewbie, javascript
Published: 2021-02-24 13:01:46

By default, all JavaScript code runs synchronously. This means that the statements are evaluated from top to bottom, one after another.

```javascript
console.log('hello');
console.log('synchronous');
console.log('world');
```

The strings will be printed to the console in the same order as they appear.

```bash
hello
synchronous
world
```

## Starting the timer with `setTimeout`

To delay the execution of some function in JavaScript, you can `setTimeout`. In the base case it accepts two parameters:

- `callback` - the function that should be called
- `delay` - in milliseconds

`setTimeout` sets the timer and calls `callback` function after `delay` milliseconds.

The `callback` function will be executed only once. If you’re looking for repeated execution, you should use [setInterval](https://learn.coderslang.com/0026-javascript-setinterval-repeated-execution-with-a-delay/).

```javascript
console.log('hello');
setTimeout(() => {
  console.log('async message that appears on the screen in 1 second')
}, 1000);
console.log('world');
```

The messages will appear in the following order:

```bash
hello
world
async message that appears on the screen in 1 second
```

## Common `setTimeout` mistakes

In JS, the first argument passed to `setTimeout` should always be a function. If you just write `console.log` - it won’t work properly.

```javascript
console.log('hello');
setTimeout(console.log('failed async message'), 1000);
console.log('world');
```

This code snippet is broken. The output of `failed async message` won’t be delayed as the `console.log` will be evaluated synchronously and return `undefined`.

Then, there are 2 possibilities, which depend on the environment that your code runs in: 

- Node.js - error

  ```javascript
  TypeError [ERR_INVALID_CALLBACK]: Callback must be a function
  ```

- Browser - no error, but there will be no delay and the order of the messages will be not as expected

  ```text
  hello
  failed async message
  world
  ```

[Learn Full Stack JavaScript](https://learn.coderslang.com)
Daily Developer Jokes - Wednesday, Feb 24, 2021
Tags: jokes, dailydeveloperjokes
Published: 2021-02-24 13:00:16

---
title: "Daily Developer Jokes - Wednesday, Feb 24, 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=Wednesday%2C%20Feb%2024%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/5e12597d4e1c1.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:___ What accommodations did the JavaScript developer request at the hotel?

___A:___ A room with a Vue.
 -->
Never mix up greater/less than when comparing dates again
Tags: ruby, rails, webdev
Published: 2021-02-24 15:10:17

---
title: Never mix up greater/less than when comparing dates again
published: true
date: 2021-02-24 13:00:00 UTC
tags: ruby,rails,webdev
canonical_url: https://boringrails.com/tips/rails-date-before-after
---

When it comes to compare dates, for some reason my brain really struggles. I mix up `<` and `>=` all the time and end up flipping them.

Is `start_date` greater than `end_date`? Or vice-versa? I get confused because I think about dates in terms of `before` and `after` not `greater_than` or `less_than`.

## Usage

Luckily, Rails is here to save the day and make sure I never make this mistake again by adding `before?` and `after?` for all Date-related comparisons.

```ruby
start_date = Date.new(2019, 3, 31)
end_date = Date.new(2019, 4, 1)

start_date.before? end_date
#=> true
end_date.after? start_date
#=> true

start_date = Date.new(2020, 8, 11)
end_date = Date.new(2018, 8, 11)

start_date.before? end_date
#=> false
```

I find myself using these methods frequently in Rails model validations when I need to ensure two dates form a valid range.

```ruby
class Promotion < ApplicationRecord
  validate :valid_eligiblity_range?

  def valid_eligiblity_range?
    return unless expiration_date? && start_date?

    if !expiration_date.after?(start_date)
      errors.add(:start_date, "must be before Expiration Date")
      errors.add(:expiration_date, "must be after Start Date")
    end
  end
end
```

## Additional Resources

Rails API Docs: [DateAndTime::Calculations#before?](https://api.rubyonrails.org/classes/DateAndTime/Calculations.html#method-i-before-3F)

Rails API Docs: [DateAndTime::Calculations#after?](https://api.rubyonrails.org/classes/DateAndTime/Calculations.html#method-i-after-3F)

* * *
[![](https://boringrails.com/images/twitter-banner.png)](https://twitter.com/_swanson)
Editable box component with React Hooks
Tags: react, hooks, components, editabletext
Published: 2021-02-24 12:58:38

Recently, I needed a user friendly component which can be editable when the user clicks on it. In this post I will show you how to do it with react hooks.  

I used the onBlur and onFocus functions of the text area to handle edit and save mode. 

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

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

```javascript
import React, { useState } from "react";

export const EditBox = (props) => {
	const maxChar = 500;
	const rows = 10;
	const [remainedChar, setRemainedChar] = useState(500);
	const [isEditable, setEditable] = useState(false);
	
	const handleChange = (e) => {
		setRemainedChar(maxChar - e.target.value.length);
	};
	const handleFocus= (e) => {
		setEditable( true);
	}
	const handleBlur = (e) => {
		console.log( 'Saved:', e.target.value);
		setEditable( false);
	}

	return (
		<div className="editbox">
			<div className="custom-label" >
				<div className = "editbox-label">
					{props.label}
				</div>
			</div>
			<textarea
				rows={rows}
				maxLength={maxChar}
				onChange={handleChange}
				onBlur={handleBlur}
				onFocus={handleFocus}
				className={`editbox-textarea ${isEditable ? "text-edit active-box" : ""} `}
			></textarea>
			<div className={`edit-bottom  d-flex justify-content-end text-detail ${isEditable ? "" : "invisible"}`}>
				<i className="remained-char">
					{remainedChar}/{maxChar}
				</i>
			</div>
		</div>
	);
};

export default EditBox;

```

I removed border and outline of the text-area since I want it  to be seen like a box. I get the row number value as a prop and showed the remained-chars to the user, so I set the resize property to none because I did not need it.  

```CSS
/* EDITBOX --------------- */
.editbox {
  margin-bottom: 1rem;
}
.editbox textarea {
  font-family: inherit;
}

.editbox .edit-action {
  text-decoration: underline;
  font-size: 1rem;
  font-weight: normal;
}

.editbox .editbox-textarea {
  outline: none;
  border: none;
  color: var(--text-secondary);
  width: 100%;
  resize: none;
  background-color: transparent;
  border: 1px solid #C6CBD4;
  border-radius: .5rem;
  padding: 1rem;
  transition: .2s;
}

.editbox .editbox-textarea:hover{ border: #9090cc .5px solid;}

.editbox .editbox-textarea:focus,
:active,
:visited {
  outline: none;
}

.editbox .text-edit {
  color: var(--text-secondary);
  background-color: transparent;
  font-weight: normal;
}

.editbox .edit-bottom { transform: translate(-.5rem, -1.5rem);}
```
The only way you should be handling exceptions in C#
Tags: csharp
Published: 2021-02-24 12:34:13

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

## Enjoy :sunny:

https://gist.github.com/GrantHair5/88a9f902d287cc5efc40cd4c63c81125

or if you enjoy a fiddle (that sounded weird but were rolling with it)

https://dotnetfiddle.net/E0JdC1
Selenium Python Generate Screenshot
Tags: testing, python, webdev, tutorial
Published: 2021-02-24 12:03:55

In this post, we will take a look at how we can generate a screenshot of a test failure in Selenium Python so that we can quickly look at the screenshot and identify what was the state of our application at that moment.

We will also learn how to take screenshots whenever we want for a certain part of the screen and these screenshots can then be reviewed by your team for manual validation if needed.

---

### Taking screenshot of failed tests

One of the many great features of using the SeleniumBase framework is that it comes with in-built screenshot generation capability when a test fails. Along with the screenshot, it also ends up saving the logs of the test run in the latest_logs/ folder.

Example of the latest_logs/ folder –

![logs](https://automationbro.com/wp-content/uploads/2021/02/image.png)

In the screenshot above, 3 files got generated when a test failed which are stored under the auto-generated test_name folder –

- .txt file – failed test logs get stored in this file
- .html file – a copy of the DOM for that particular gets stored in this file
- .png file – screenshot of that particular part of the screen

--- 

### Generate Screenshot manually

You also have the ability to generate screenshot during the test run at any step using the `save_screenshot` method –

![save_screenshot](https://automationbro.com/wp-content/uploads/2021/02/image-1.png)

The `save_screenshot` method takes in 2 parameters – filename and the folder name. If a folder name is passed in the file will get stored within that folder.

---

#### **Check out the video below to learn more about generating screenshots using the SeleniumBase framework –**

{% youtube x-w2Oq99J_0%}

---

📧 Subscribe to my [mailing list](https://automationbro.com/mailing-list) to get access to more content like this 

👍 Follow [automationbro](https://twitter.com/automationbro) on Twitter for the latest updates

...

This post was written with the help of a high amount of caffeine. And, if this post helped you out and you would like to support my work, you can do that by clicking on the button below and continue supporting my caffeine love :)

<a href="https://www.buymeacoffee.com/automationbro">![Buy me a coffee](https://dev-to-uploads.s3.amazonaws.com/i/4aw2ub3f4qkyjk0ivwt4.png)</a>

You can also support me by liking and sharing this content.

Thanks for reading!
How to open hyperlink with target=“_blank” in PyQtWebEngine?
Tags: python, pyqt5
Published: 2021-02-24 11:58:24

I have made a web browser using pyqt5 and PyQtWebEngine.It works fine but when I click on a hyperlink with target="_blank" then it does not work but how will I fix it. You can view its source code by clicking on this link https://github.com/SaptakBhoumik/WebPlus
Merge Word Documents in Java applications
Tags: merge, word, java
Published: 2021-02-24 09:02:31

---
title: Merge Word Documents in Java applications
published: true
description: merge word document, combine two word into one word
tags: merge, word, java
---
In this article, we will introduce how to merge multiple Word documents into one Word document by using Free Spire.Doc for Java.

*Combine two Word documents into one Word document*

Free Spire.Doc for java offers an insertTextFromFile() method to merge Word documents by inserting content from a source document into a destination document. In the resulted Word document, the inserted content starts from a new page and it follows the source document’s header, footer and background style.

```java
import com.spire.doc.Document;
import com.spire.doc.FileFormat;

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

        //File path of the first document
        String filePath1 = "Sample1.docx";
        //File path of the second document
        String filePath2 = "Sample2.docx";

        //Load the first document
        Document document = new Document(filePath1);

        //Insert content of the second document into the first document
        document.insertTextFromFile(filePath2, FileFormat.Docx_2013);

        //Save the document
        document.saveToFile("MergeWord.docx", FileFormat.Docx_2013);
    }
}
```
Output:

![merge word](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/huys3j3ivugf8tqo8i7t.png)

*Merge Word document on the same page*

If we want to combine the two Word documents together and the inserted content follows the last paragraph of the original Word document, Free Spire.Doc for Java also supports to do like this. Please check the code snippets as below:

```java
import com.spire.doc.Document;
import com.spire.doc.DocumentObject;
import com.spire.doc.FileFormat;
import com.spire.doc.Section;

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

        //File path of the first document
        String filePath1 = "Sample1.docx";
        //File path of the second document
        String filePath2 = "Sample2.docx";

        //Load the first document
        Document document1 = new Document(filePath1);
        //Load the second document
        Document document2 = new Document(filePath2);

        //Get the last section of the first document
        Section lastSection = document1.getLastSection();

        //Traverse sections
        for (Object sectionObj : document2.getSections()) {
            Section section=(Section)sectionObj;
            // Traverse body ChildObjects
            for (Object docObj : section.getBody().getChildObjects()) {
                DocumentObject obj=(DocumentObject)docObj;
                // Clone to destination document at the same page
                document1.getSections().get(0).getBody().getChildObjects().add(obj.deepClone());
            }
        }
        //Save the document
        document1.saveToFile("MergeWord2.docx", FileFormat.Docx_2013);
    }
}
```
Output:
![Merge Word documents](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nzpejndzf0idk5784qhy.png)
Realtime Chat Application using PHP with MySQL & JavaScript Ajax
Tags: chatapp, phpchatapp, chatapplication, chatbox
Published: 2021-02-24 11:35:14

Hey friends, today in this blog you'll learn how to create a Realtime Chat Web Application using PHP with MySQL & JavaScript Ajax. Earlier I have shared a blog on <a href="https://www.codingnepalweb.com/2020/09/simple-chatbot-using-php-with-mysql.html">how to create a Simple Chatbot using PHP with MySQL & jQuery Ajax.</a> Our maximum viewers have requested me to create a Chat App so I decided to create one.

In this chat app, when you open it first on your browser, there is shown a signup form where you have to signup with your details like name, email, password, and image. Email and image field is fully validated which means you've to enter a valid email and an image file only. Once you signed up successfully, you'll be redirected to the user's page where you can see your full name, image, status, and logout button to the top, and users, like you, appear on the bottom if someone has signed up. On this page, you can see their image, name, status, and the last message if they sent to you. You have to click on the particular user or you can also search any existing user with their name then you'll be redirected to the chat page and there you can see the image, name, status of that user who is going to chat.


####You might like this:
<a href="https://www.codingnepalweb.com/2020/11/email-subscription-form-using-html-css-php.html" target="_blank">Email Subscription Form in PHP only</a>
<a href="https://www.codingnepalweb.com/2020/09/simple-chatbot-using-php-with-mysql.html" target="_blank">Chatbot using PHP with MySQL & jQuery</a>
<a href="https://www.codingnepalweb.com/2020/09/login-signup-form-with-email-verification-php-mysql-bootstrap.html" target="_blank">Login & Signup Form with Email Verification</a>
<a href="https://www.codingnepalweb.com/2020/09/how-to-send-email-with-php-from-localhost.html" target="_blank">How to Send Email from Localhost using XAMPP</a>

You can download all source files for free from this given link. <a href="https://www.codingnepalweb.com/2021/02/realtime-chat-application-using-php-mysql-ajax.html">Click here to download code files.</a>