Skip to main content

· One min read
// App.js
import LimitedWordTextArea from "./LimitedWordTextArea";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <h1>Limited Word TextArea</h1>
      <LimitedWordTextArea limit={10} />
    </div>
  );
}
// LimitedWordTextArea.js
import React, { useState, useCallback } from "react";

const LimitedWordTextArea = ({ limit }) => {
  const [{ content, wordCount }, setContent] = useState({
    content: "",
    wordCount: 0
  });

  const setFormattedContent = useCallback(
    (text) => {
      let words = text.split(" ").filter(Boolean);
      if (words.length > limit) {
        setContent({
          content: words.slice(0, limit).join(" "),
          wordCount: limit
        });
      } else {
        setContent({ content: text, wordCount: words.length });
      }
    },
    [limit, setContent]
  );

  return (
    <>
      <textarea
        onChange={(e) => setFormattedContent(e.target.value)}
        value={content}
      />
      <p>
        {wordCount}/{limit} Words.
      </p>
    </>
  );
};
export default LimitedWordTextArea;

· 2 min read
Subrata Dash

I have decided to dedicate my weekend to Software Engineer Community. I Will try to share my knowledge with beginners who need it. This may be in the form of a blog or video tutorial. This is the first capsule of that series.

6 Days - 6 Videos - Daily at 7 PM

· One min read
Subrata Dash

6 days 6 videos part 2

This is the second week, I have dedicate my weekend to Software Engineer Community. I tried to share my knowledge with beginners who need it. This may be in the form of a blog or video tutorial. This is the second capsule of this series.

6 Days - 6 Videos - Daily at 7 PM

· 9 min read
Subrata Dash

Redux is a predictable state container for JavaScript apps. In this post we will try to learn about React-Redux. But, you may ask, is it valuable to learn redux 4.0 at July 2022. My answer is yes. Two days back, I got a client project which is based on redux 4.0 and I realised that new learners should also have knowledge of legacy redux.

· One min read
Sébastien Lorber
Yangshun Tay

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.