Show Menu
Cheatography

VSCode ReactJS Code Snippets Cheat Sheet by

A list of snippets from the Reactjs code snippets VSCode Extension

Component Creators

rcc→
class component skeleton
rccp→
class component skeleton with prop types after the class
rcjc→
class component skeleton without import and default export lines
rcfc→
class component skeleton that contains all the lifecycle methods
rsc→
stateless component skeleton
rscp→
stateless component with prop types skeleton

Component Class Attributes

con→
class default constr­uctor with props
conc→
class default constr­uctor with props and context
est→
empty state object
cwm→
compon­ent­Wil­lMount method
cdm→
compon­ent­Did­Mount method
cwr→
compon­ent­Wil­lRe­cei­veProps method
scu→
should­Com­pon­ent­Update method
cwup→
compon­ent­Wil­lUpdate method
cdup→
compon­ent­Did­Update method
cwun→
compon­ent­Wil­lUn­mount method
ren→
render method
sst→
this.s­etState with object as parameter
ssf→
this.s­etState with function as parameter
bnd→
binds the this of method inside the constr­uctor
 

PropTypes

pta→
array
ptar→
array.i­sR­equired
ptb→
bool
ptbr→
bool.i­sRe­quired
ptf→
func
ptfr→
func.i­sRe­quired
ptn→
number
ptnr→
number.is­Req­uired
pto→
object
ptor→
object.is­Req­uired
pts→
string
ptsr→
string.is­Req­uired
ptnd→
node
ptndr→
node.i­sRe­quired
ptel→
element
ptelr→
elemen­t.i­sRe­quired
pti→
instan­ceO­f(C­las­sName)
ptir→
instan­ceO­f(C­las­sNa­me).is­Req­uired
pte→
oneOf(­['T­his', 'That'])
pter→
oneOf(­['T­his', 'That'­]).i­sR­equired
ptet→
oneOfT­ype­([P­rop­Typ­e.s­tring, PropTy­pe.n­um­ber])
ptetr→
oneOfT­ype­([P­rop­Typ­e.s­tring, PropTy­pe.n­um­ber­]).i­sR­equired
ptao→
arrayO­f(P­rop­Typ­es.n­umber)
ptaor→
arrayO­f(P­rop­Typ­es.n­um­ber­).i­sRe­quired
ptoo→
object­Of(­Pro­pTy­pes.nu­mber)
ptoor→
object­Of(­Pro­pTy­pes.nu­mbe­r).i­sR­equired

Help Us Go Positive!

We offset our carbon usage with Ecologi. Click the link below to help us!

We offset our carbon footprint via Ecologi
 

Comments

No comments yet. Add yours below!

Add a Comment

Your Comment

Please enter your name.

    Please enter your email address

      Please enter your Comment.

          Related Cheat Sheets

          Visual Studio Code Keyboard Shortcuts