The Web Dev

Sometimes, we want to truncate a string in JavaScript.

In this article, we’ll look at how to truncate a string in JavaScript.

How to truncate a string in JavaScript?

To truncate a string in JavaScript, we use the string substring method.

For instance, we write

const truncateString = (str, length) => {
  return str.length > length ? str.substring(0, length - 3) + "..." : str;
};

to define the truncateString function.

In it, we str.substring if str.length is bigger than length to return a truncated substring.

Otherwise, we return str.

Conclusion

To truncate a string in JavaScript, we use the string substring method.

Sometimes, we want to fix JavaScript scrollTo method doing nothing.

In this article, we’ll look at how to fix JavaScript scrollTo method doing nothing.

How to fix JavaScript scrollTo method doing nothing?

To fix JavaScript scrollTo method doing nothing, we put it in a setTimeout callback.

For instance, we write

setTimeout(() => {
  window.scrollTo(0, 300);
}, 2);

to call window.scrollTo in the setTimeout callback to delay the scrolling.

Conclusion

To fix JavaScript scrollTo method doing nothing, we put it in a setTimeout callback.

Sometimes, we want to split first name and last name using JavaScript.

In this article, we’ll look at how to split first name and last name using JavaScript.

How to split first name and last name using JavaScript?

To split first name and last name using JavaScript, we use the split method.

For instance, we write

const names = "Paul Steve Jones".split(" ");

to call split with ' ' to split the names into an array of name strings.

Conclusion

To split first name and last name using JavaScript, we use the split method.

Sometimes, we want to do fade-in and fade-out with JavaScript and CSS.

In this article, we’ll look at how to do fade-in and fade-out with JavaScript and CSS.

How to do fade-in and fade-out with JavaScript and CSS?

To do fade-in and fade-out with JavaScript and CSS, we use the transition CSS property.

For instance, we write

<button id="handle">Fade</button>
<div id="slideSource">Whatever you want here - images or text</div>

to add a button and the div we want to element.

Then we write

#slideSource {
  opacity: 1;
  transition: opacity 1s;
}

#slideSource.fade {
  opacity: 0;
}

to add the transition effects with the transition property.

We animate the opacity between 0 and 1.

Then we write

const slideSource = document.getElementById("slideSource");

document.getElementById("handle").onclick = () => {
  slideSource.classList.toggle("fade");
};

to select the div with getElementById.

And then we select the button and set its onclick property to a function that toggles the fade class to animate the opacity between 1 and 0 and vice versa when we click on it.

Conclusion

To do fade-in and fade-out with JavaScript and CSS, we use the transition CSS property.

Sometimes, we want to get path from the request with Node.js and JavaScript.

In this article, we’ll look at how to get path from the request with Node.js and JavaScript.

How to get path from the request with Node.js and JavaScript?

To get path from the request with Node.js and JavaScript, we use the request.url property.

For instance, we write

const http = require("http");
const url = require("url");

const start = () => {
  const onRequest = (request, response) => {
    const pathname = url.parse(request.url).pathname;
    console.log(pathname);
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("Hello World");
    response.end();
  };

  http.createServer(onRequest).listen(8888);
  console.log("Server has started.");
};

exports.start = start;

to get the path name of the request URL with url.parse(request.url).pathname.

Conclusion

To get path from the request with Node.js and JavaScript, we use the request.url property.