Skip to main content

36 docs tagged with "FC"

View All Tags

!refactor class with non-pure method

!refactor class with non-pure method. Topics on: when helper method calls this.props with no arguments, need to modify helper function into a pure function, OR

!refactor Class with pure helper

!refactor Class with pure helper. Topics on: !recall class method can be moved outside CC, !convention keep utility helper function outside FC. Read more: React

!refactor constructor(props)

!refactor constructor(props). Topics on: constructor(props) only called once in CC lifetime, useMemo to Memoization for rerender. Read more: React, React Concep

!refactor Render only

!refactor Render only. Topics on: render() becomes return (...JSX), destructure props. Read more: React, React Concepts, Component Based Architecture, Component

@storybook/addon-a11y

@storybook/addon-a11y is defined as: official storybook Plugin to audit FC vs WCAG guidelines for max Accessibility & flag any violations. Topics on: 'Elements

/src/components/App.js

/src/components/App.js is defined as: root JS file to define App FC to import other Components. Topics on: !deprecated import React no longer required for JSX.

<Head>

<Head> is defined as: ( Next 12 ) FC extends <head>. Topics on: . Read more: React, React Stack, Nextjs, Next Component, Head, Next 12, FC|FullStack Wiki by RJ

<Image>

<Image> is defined as: ( Next 12 ) FC extends <img> with Prefetch/Lazy Loading & ✨img optimization to burn your free quota. Topics on: unoptimized. Read more: R

<MonacoEditor>

<MonacoEditor> is defined as: Monaco Editor FC. Topics on: theme, language, value. Read more: React, React Stack, Monaco Editor React, Monaco Editor, FC | Wiki

<RequireAuth>

<RequireAuth> is defined as: custom FC Wrapper to Declarative control Protected Route via useAuth() & <Navigate> from react-router-dom. Topics on: . Read more:

<Route>

<Route> is defined as: React Router FC to map route for element FC to path. Topics on: <Route> must renders element || null, element, path. Read more: React, Re

<Split>

<Split> is defined as: react-split FC to wrap children with options. Topics on: . Read more: React, React Stack, React Split, FC|FullStack Wiki by Roger J

Client Component

Client Component is defined as: FC to render on Client dynamically. Topics on: 'use client'. Read more: React, React Concepts, Component Based Architecture, Com

component

component is defined as: name of FC import name - must matc or nothing shows in Storybook Concurrent Explorer!. Topics on: . Read more: React, React Stack, Stor

Dependency

Dependency is defined as: any Variable local to FC Scope to control Hook Trigger. Topics on: Variable inside Scope of hook is not relevant Dependency. Read more

FC

FC is defined as: function to return UI via JSX. Pass propsfor dynamic input. add state via Hook. Topics on: since React 16.8 FC with Hooks are more powerful th

FC Advantages over CC

FC Advantages over CC. Topics on: Compact, Readabilty, Purity, Simplicity, Testability, Popularity. Read more: React, React Concepts, Component Based Architectu

FC Design Pattern/Conventions

FC Design Pattern/Conventions. Topics on: destructure props in Function Signature of FC, set Parameter Default Value for omitted attributes in FC, !convention t

File System Router

File System Router is defined as: to define Routing by filepath struct; to map FC src path to route. Topics on: Page, Index Route, Nest Route, Shared Layout. Re

Hook

Hook is defined as: Specialized Function Functional Programming extends FC with Lifecycle Method & persistent state. Topics on: Specialized Function to 'hook' i

Lazy()

Lazy() is defined as: React API function to Lazy Loading FC for Suspense Boundary. Topics on: . Read more: React, React API, Suspense API, Lazy, Function, Lazy

Page

Page is defined as: export default FC to display unique UI for Next.js File System Router. Topics on: /pages to export Page in Next 12, /app to export Page in N

Provider

Provider is defined as: Wrapper FC to provide Context value to all Subscribe children. Topics on: value. Read more: React, React API, Context API, Provider, Wra

Pure Component

Pure Component is defined as: stateless Component that always renders same based on same props input.. Topics on: No state to store changes = No Side Effect. Re

React Router FC

React Router FC is defined as: React Router API prebuild FC. Topics on: <BrowserRouter>, <Routes>, <Outlet>, <Navigate>, <Link>. Read more: React, React Stack,

react-markdown

react-markdown is defined as: React Stack FC Wrapper to render MDX extends with plugins. Topics on: react-markdown + syntax-highlighter. Read more: React, React

ReactDOMServer

ReactDOMServer is defined as: ReactDOM API Interface Object to render FC to static HTML. Topics on: ReactDOMServer method subdivide by compat with Node.js strea

Refactoring CC to FC

Refactoring CC to FC. Topics on: !refactor Render only, !refactor Class with pure helper, !refactor class with non-pure method, !refactor constructor(props), !r

Server Component

Server Component is defined as: FC to Server Side Render on Backend & serve Static Resource to Thin Client. Topics on: . Read more: React, React Concepts, Compo

Stateful Hook

Stateful Hook is defined as: (typeof) Hook to add state to FC. Topics on: useState(), useReducer(), useRef(), useContext(), userDeferredvalue(), useTransition()

Story

Story is defined as: export default Object to Declarative render FC snapshot with specific key state to dev/test/doc. Topics on: title & component req fields -

Suspense API

Suspense API is defined as: React API to defer render for FC. Topics on: <Suspense>, Lazy(), Suspense Boundary, Suspense API splits VDOM pipeline into smaller u

useEffect()

useEffect() is defined as: Hook to run Effect in FC at specific stage of Component Lifecycle, set by Deps Array. Topics on: Deps Array as 2nd Argument to useEff

useRef()

useRef() is defined as: Stateful Hook to persist Passive State Variable across renders in FC, as ref handle Escape Hatch to DOM API elements. Topics on: useRe

useState()

useState() is defined as: Stateful Hook to persist single state value in FC. Topics on: const [_value, _setter] = useState(initial), Lazy Initial value, !flow d