DEV Community

Cover image for React 18 Snippets - I need your help ❤️
Kristiyan Velkov
Kristiyan Velkov

Posted on • Edited on

7 1 1 1 1

React 18 Snippets - I need your help ❤️

Hello, folks.

I'm thrilled to announce that I've developed a fantastic new VS Code extension called React 18 Snippets. It's designed to greatly enhance your productivity and save you valuable time.❤️

I saw many snippets for React, but they don't support new features in React 18, so I decide to create my own and to share it to the public.

Image description


HELP

This VS code extension is for you guys. Please, support! ❤️

So, to be able to improve the extension, please:

  1. Download it from VS code workspace Link or directly in VS code. 😊
  2. If you find something that can be improved, comment here.💪
  3. If you want to join as a contributor, please contact me.🔥

Don't forget to add a review if you like the extension LINK

Image description


List of snippets for React JS version 18

Snippet Renders
ri Import React
ridom Import ReactDOM
riustate Import React, { useState }
riustateueffect Import React, { useState, useEffect }
riprototype Import PropTypes
rfc Functional Component
rafc Arrow Functional Component
rcustomhook Custom Hook
racustomhook Custom Hook (Arrow)
rueffect useEffect Hook
rustate useState Hook
rucontext useContext Hook
ruref useRef Hook
rumemo useMemo Hook
rucallback useCallback Hook
rudebugvalue useDebugValue Hook
rudeferredvalue useDeferredValue Hook
ruid useId Hook
rulayouteffect useLayoutEffect Hook
rureducer useReducer Hook
rutransition useTransition Hook
rrender render
rfragment Fragment
rfragmentkey Fragment with key prop
rprofiler Profiler
rstrict StrictMode
rsuspense Suspense
rforwardref forwardRef
rlazy lazy
rstartTransition startTransition
rmemo memo
rroot Create Root
rhandle handle function
rahandle handle arrow function
rcontextprovider Context Provider

Developer Support:❤️

  • If you saw some issue/bug 🐛 related to the specific release version.
  • If you want some new feature or change to be added/implemented. 😊

Please, contact the creator of the React 18 Snippets, so he will be able to fix or improve it:

Image description

linkedin

portfolio


Image description

Support my work

If you like my work and want to support me to work hard, please donate via:

Revolut website payment or use the QR code above.

Thanks a bunch for supporting me! It means a LOT 😍


Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

Top comments (1)

Collapse
 
kristiyanvelkov profile image
Kristiyan Velkov

SHARE your favorite React JS Snippets 💻

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay