React Hooks , Accessibility, & Some Coding Problems You need To Know

Ujayer Ahmed Siddique
3 min readNov 6, 2020

We all have already known about react and React hooks already . But it is not a problem if we recap the things once again right??….

React Hooks

So, What Is React Hooks?

Hooks are a fundamentally simpler way of encapsulating stateful behavior and side effects in user interfaces. They were introduced in React but Nowadays they are being used in various frameworks like Vue, Svelte, and even adapted for general functional JS.

Why use Hooks?

There may be hundreds of reasons to use Hooks we can say but basic reasons are three:

  • Huge components that are hard to refactor and test.
  • Duplicated logic between different components and lifecycle methods.
  • Complex patterns like render props and higher-order components.

Do They Make React Application Bloated?

Hooks let one always use functions instead of having to constantly switch between functions, classes, higher-order components, and render props. In terms of the implementation size, the Hooks support increases React only by ~1.5kB (min+gzip). While using this isn’t much, it’s also likely that adopting Hooks could reduce ones bundle size because code using Hooks tends to minify better than equivalent code using classes.

What Really Are Hooks?

Hooks let one to use React features (like state) from a function by doing a single function call. React provides some built-in Hooks exposing the “building blocks” of React: state, lifecycle, and context.

Accessibility

Web accessibility (also referred to as a11y) is the design and creation of websites that can be used by everyone. Accessibility support is necessary to allow assistive technology to interpret web pages.

React fully supports building accessible websites, often by using standard HTML techniques.

Standards and Guidelines

WCAG

The Web Content Accessibility Guidelines provides guidelines for creating accessible web sites.

The following WCAG checklists provide an overview:

Some Basic Problem Solving

Factorial of a number:

  1. Factorialize a Number With Recursion
factorialize using recursion

2. Factorialize a Number with a WHILE loop

factorialize using while loops

3. Factorialize a Number with a FOR loop

factorialize using for loops

Fibonacci:

  1. For loop
using for loop

2. Recursive way

Recursive way

Prime number

Prime Number

Find the largest element of an array

Find the largest element of an array

Remove duplicate item from an array

Remove duplicate item from an array

Sum of all numbers in an array

Sum of all numbers in an array

Count the number of words in a string

Count the number of words in a string

Reverse a string

Reverse a string

--

--

Ujayer Ahmed Siddique

A tech enthusiast person. Loves to work using React js, JavaScript and in a word web Development.