Skip to content

Commit 585feb3

Browse files
walteribeirowalteribeiro
committed
Update React life-cycle snippets
1 parent 1699f72 commit 585feb3

File tree

7 files changed

+884
-696
lines changed

7 files changed

+884
-696
lines changed

‎CHANGELOG.md‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
## [1.2.0 - Release]
2+
3+
- Update React life-cycle snippets
4+
5+
![React Life-cycle](https://github.com/walteribeiro/full-react-snippets/raw/master/images/lifecycle.jpg 'React Life-cycle')
6+
17
## [1.0.0 - Release]
28

3-
- First Version
9+
- First Version

‎README.md‎

Lines changed: 151 additions & 141 deletions
Original file line numberDiff line numberDiff line change
@@ -12,170 +12,180 @@ After install this snippets add this inside your settings
1212

1313
### ES7
1414

15-
| Snippets | Content |
16-
| -------: | --------|
17-
| edl | Eslint Disable Line |
18-
| imst | Import Statement |
19-
| imp | Import |
20-
| imn | Import No Module Name |
21-
| ime | Import Everything |
22-
| ima | Import As |
23-
| ed | Export Default |
24-
| exd | Export Destructing |
25-
| exa | Export As |
26-
| enf | Export Named Function |
27-
| edf | Export Default Function |
28-
| met | Method |
29-
| fre | For Each |
30-
| fof | For Of |
31-
| fin | For Inf |
32-
| anfn | Anonymous Function |
33-
| nfn | Named Function |
34-
| dob | Destructing Object |
35-
| dar | Destructing Array |
36-
| sti | Set Interval |
37-
| sto | Set TimeOut |
38-
| prom | Promise |
39-
| cas | Console Assert |
40-
| ccl | Console Clear |
41-
| cco | Console Count |
42-
| cdi | Console Dir |
43-
| cer | Console Error |
44-
| cgr | Console Group |
45-
| cge | Console Group End |
46-
| clg | Console Log |
47-
| ctr | Console Trace |
48-
| cwa | Console Warn |
49-
| cin | Console Info |
50-
| cm | Comment Block |
51-
| cmmb | Comment Big Block |
52-
| cbl | Comment Big Line |
15+
| Snippets | Content |
16+
| -------: | ----------------------- |
17+
| edl | Eslint Disable Line |
18+
| imst | Import Statement |
19+
| imp | Import |
20+
| imn | Import No Module Name |
21+
| ime | Import Everything |
22+
| ima | Import As |
23+
| ed | Export Default |
24+
| exd | Export Destructing |
25+
| exa | Export As |
26+
| enf | Export Named Function |
27+
| edf | Export Default Function |
28+
| met | Method |
29+
| fre | For Each |
30+
| fof | For Of |
31+
| fin | For Inf |
32+
| anfn | Anonymous Function |
33+
| nfn | Named Function |
34+
| dob | Destructing Object |
35+
| dar | Destructing Array |
36+
| sti | Set Interval |
37+
| sto | Set TimeOut |
38+
| prom | Promise |
39+
| cas | Console Assert |
40+
| ccl | Console Clear |
41+
| cco | Console Count |
42+
| cdi | Console Dir |
43+
| cer | Console Error |
44+
| cgr | Console Group |
45+
| cge | Console Group End |
46+
| clg | Console Log |
47+
| ctr | Console Trace |
48+
| cwa | Console Warn |
49+
| cin | Console Info |
50+
| cm | Comment Block |
51+
| cmmb | Comment Big Block |
52+
| cbl | Comment Big Line |
5353

5454
### GraphQL
5555

56-
| Snippets | Content |
57-
| -------: | --------|
58-
| graphql | GraphQL For Component |
59-
| expgql | Export GraphQL |
56+
| Snippets | Content |
57+
| -------: | --------------------- |
58+
| graphql | GraphQL For Component |
59+
| expgql | Export GraphQL |
6060

6161
### Prop Types
6262

63-
| Snippets | Content |
64-
| -------: | --------|
65-
| impt | Import PropTypes |
66-
| pta | Prop Type Array |
67-
| ptar | Prop Type Array Required |
68-
| ptb | Prop Type Bool |
69-
| ptbr | Prop Type Bool Required |
70-
| ptf | Prop Type Func |
71-
| ptfr | Prop Type Func Required |
72-
| ptn | Prop Type Number |
73-
| ptnr | Prop Type Number Required |
74-
| pto | Prop Type Object |
75-
| ptor | Prop Type Object Required |
76-
| pts | Prop Type String |
77-
| ptsr | Prop Type String Required |
78-
| ptnd | Prop Type Node |
79-
| ptndr | Prop Type Node Required |
80-
| ptel | Prop Type Element |
81-
| ptelr | Prop Type Element Required |
82-
| pti | Prop Type Instance Of |
83-
| ptir | Prop Type Instance Of Required |
84-
| pte | Prop Type Enum |
85-
| pter | Prop Type Enum Required |
86-
| ptet | Prop Type One Of Type |
87-
| ptetr | Prop Type One Of Type Required |
88-
| ptao | Prop Type Array Of |
89-
| ptaor | Prop Type Array Of Required |
90-
| ptoo | Prop Type Object Of |
91-
| ptoor | Prop Type Object Of Required |
92-
| ptsh | Prop Type Shape |
93-
| ptshr | Prop Type Shape Required |
94-
| ptypes | Static Prop Types |
63+
| Snippets | Content |
64+
| -------: | ------------------------------ |
65+
| impt | Import PropTypes |
66+
| pta | Prop Type Array |
67+
| ptar | Prop Type Array Required |
68+
| ptb | Prop Type Bool |
69+
| ptbr | Prop Type Bool Required |
70+
| ptf | Prop Type Func |
71+
| ptfr | Prop Type Func Required |
72+
| ptn | Prop Type Number |
73+
| ptnr | Prop Type Number Required |
74+
| pto | Prop Type Object |
75+
| ptor | Prop Type Object Required |
76+
| pts | Prop Type String |
77+
| ptsr | Prop Type String Required |
78+
| ptnd | Prop Type Node |
79+
| ptndr | Prop Type Node Required |
80+
| ptel | Prop Type Element |
81+
| ptelr | Prop Type Element Required |
82+
| pti | Prop Type Instance Of |
83+
| ptir | Prop Type Instance Of Required |
84+
| pte | Prop Type Enum |
85+
| pter | Prop Type Enum Required |
86+
| ptet | Prop Type One Of Type |
87+
| ptetr | Prop Type One Of Type Required |
88+
| ptao | Prop Type Array Of |
89+
| ptaor | Prop Type Array Of Required |
90+
| ptoo | Prop Type Object Of |
91+
| ptoor | Prop Type Object Of Required |
92+
| ptsh | Prop Type Shape |
93+
| ptshr | Prop Type Shape Required |
94+
| ptypes | Static Prop Types |
9595

9696
### HOC
9797

98-
| Snippets | Content |
99-
| -------: | --------|
98+
| Snippets | Content |
99+
| -------: | -------------- |
100100
| hocredux | HOC With Redux |
101-
| hoc | HOC |
101+
| hoc | HOC |
102102

103103
### React Native
104104

105-
| Snippets | Content |
106-
| -------: | --------|
107-
| rnc | React Native Component |
108-
| rnce | React Native Component Export |
105+
| Snippets | Content |
106+
| -------: | ---------------------------------- |
107+
| rnc | React Native Component |
108+
| rnce | React Native Component Export |
109109
| rncredux | React Native Class Component Redux |
110-
| imrn | React Native Import |
110+
| imrn | React Native Import |
111111

112112
### React
113113

114-
| Snippets | Content |
115-
| -------: | --------|
116-
| imr | Import React |
117-
| imrc | Import React, { Component } |
118-
| imrcp | Import React, { Component } & PropTypes |
119-
| imrpc | Import React, { PureComponent } |
120-
| imrpcp | Import React, { PureComponent } & PropTypes |
121-
| rcc | React Class Compoment |
122-
| rce | React Class Export Component |
123-
| rfe | React Functional Export Component |
124-
| rfep | React Functional Export Component With PropTypes |
125-
| rfc | React Functional Component |
126-
| rfcp | React Functional Component With PropTypes |
127-
| rcep | React Class Export Component With PropTypes |
128-
| rpc | React Class Pure Component |
129-
| rpcp | React Class Pure Component With PropTypes |
130-
| rccp | React Class Compoment PropTypes |
131-
| rconst | Class Constructor |
132-
| est | Empty State |
133-
| cwm | Component Will Mount |
134-
| cdm | Component Did Mount |
135-
| cwr | Component Will Receive Props |
136-
| scu | Should Component Update |
137-
| cwup | Component Will Update |
138-
| cdup | Component Did Update |
139-
| cwun | Component Will Unmount |
140-
| ren | Component Render |
141-
| sst | Component Set State Object |
142-
| ssf | Component Set State Func |
143-
| props | Component Props |
144-
| state | Component State |
114+
| Snippets | Content |
115+
| -------: | ------------------------------------------------------------------------ |
116+
| imr | Import React |
117+
| imrc | Import React, { Component } |
118+
| imrcp | Import React, { Component } & PropTypes |
119+
| imrpc | Import React, { PureComponent } |
120+
| imrpcp | Import React, { PureComponent } & PropTypes |
121+
| rcc | React Class Compoment |
122+
| rce | React Class Export Component |
123+
| rfe | React Functional Export Component |
124+
| rfep | React Functional Export Component With PropTypes |
125+
| rfc | React Functional Component |
126+
| rfcp | React Functional Component With PropTypes |
127+
| rcep | React Class Export Component With PropTypes |
128+
| rpc | React Class Pure Component |
129+
| rpcp | React Class Pure Component With PropTypes |
130+
| rccp | React Class Compoment PropTypes |
131+
| rconst | Class Constructor |
132+
| est | Empty State |
133+
| dsfp | Get Derived State From Props **`New`** |
134+
| sbu | Get Snapshot Before Update **`New`** |
135+
| cdc | Component Did Catch **`New`** |
136+
| cdm | Component Did Mount **`Updated`** |
137+
| cdma | Component Did Mount (Arrow func) **`Updated`** |
138+
| scu | Should Component Update **`Updated`** |
139+
| scua | Should Component Update (Arrow func) **`Updated`** |
140+
| cdup | Component Did Update **`Updated`** |
141+
| cdupa | Component Did Update (Arrow func) **`Updated`** |
142+
| cwun | Component Will Unmount **`Updated`** |
143+
| cwuna | Component Will Unmount (Arrow func) **`Updated`** |
144+
| cwm | Component Will Mount \[Deprecated\] **`Updated`** |
145+
| cwma | Component Will Mount (Arrow func) - \[Deprecated\] **`Updated`** |
146+
| cwr | Component Will Receive Props \[Deprecated\] **`Updated`** |
147+
| cwra | Component Will Receive Props (Arrow func) - \[Deprecated\] **`Updated`** |
148+
| cwup | Component Will Update \[Deprecated\] **`Updated`** |
149+
| cwupa | Component Will Update (Arrow func) - \[Deprecated\] **`Updated`** |
150+
| ren | Component Render |
151+
| sst | Component Set State Object |
152+
| ssf | Component Set State Func |
153+
| props | Component Props |
154+
| state | Component State |
145155

146156
### Redux
147157

148-
| Snippets | Content |
149-
| -------: | --------|
150-
| redux | Import Redux Statement |
151-
| rpf | Redux Pure Function |
152-
| rpc | Redux Pure Function Const |
153-
| rcredux | React Class Compoment Redux |
154-
| reduxmap | Mapping To Props |
155-
| rxaction | Redux Action |
156-
| rxconst | Redux Const |
157-
| rxreducer | Redux Reducer |
158-
| rxselect | Redux Selector |
158+
| Snippets | Content |
159+
| --------: | --------------------------- |
160+
| redux | Import Redux Statement |
161+
| rpf | Redux Pure Function |
162+
| rpc | Redux Pure Function Const |
163+
| rcredux | React Class Compoment Redux |
164+
| reduxmap | Mapping To Props |
165+
| rxaction | Redux Action |
166+
| rxconst | Redux Const |
167+
| rxreducer | Redux Reducer |
168+
| rxselect | Redux Selector |
159169

160170
### React Router
161171

162-
| Snippets | Content |
163-
| -------: | --------|
164-
| imrr | import { BrowserRouter as Router, Route } from 'react-router-dom' |
165-
| imnl | import { NavLink } from 'react-router-dom' |
166-
| imwr | import { withRouter } from 'react-router' |
167-
| router | react-router Router template |
168-
| route | react-router Route component |
169-
| navlink | react-router NavLink component |
172+
| Snippets | Content |
173+
| -------: | ----------------------------------------------------------------- |
174+
| imrr | import { BrowserRouter as Router, Route } from 'react-router-dom' |
175+
| imnl | import { NavLink } from 'react-router-dom' |
176+
| imwr | import { withRouter } from 'react-router' |
177+
| router | react-router Router template |
178+
| route | react-router Route component |
179+
| navlink | react-router NavLink component |
170180

171181
### Testing
172182

173-
| Snippets | Content |
174-
| -------: | --------|
175-
| desc | Describe Block |
176-
| test | Test Block |
177-
| tit | It Block |
178-
| stest | Setup Test |
179-
| sjtest | Setup Test With Enzyme To Json |
180-
| sntest | Setup React Native Test |
181-
| snrtest | Setup React Native Test With Redux |
183+
| Snippets | Content |
184+
| -------: | ---------------------------------- |
185+
| desc | Describe Block |
186+
| test | Test Block |
187+
| tit | It Block |
188+
| stest | Setup Test |
189+
| sjtest | Setup Test With Enzyme To Json |
190+
| sntest | Setup React Native Test |
191+
| snrtest | Setup React Native Test With Redux |

‎README.pdf‎

400 KB
Binary file not shown.

‎images/lifecycle.jpg‎

155 KB
Loading

‎package.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "full-react-snippets",
33
"displayName": "Full React/React Native/React Router/Redux/GraphQL/ES7/Testing/PropTypes snippets",
44
"description": "Code snippets for React/React Native/React Router/Redux/GraphQL/ES7/Testing/PropTypes",
5-
"version": "1.1.2",
5+
"version": "1.2.0",
66
"icon": "images/logo.png",
77
"publisher": "walter-ribeiro",
88
"repository": {
@@ -23,7 +23,7 @@
2323
"react/react-native",
2424
"react-router",
2525
"redux",
26-
"GrapQL"
26+
"GraphQL"
2727
],
2828
"contributes": {
2929
"snippets": [
@@ -44,8 +44,8 @@
4444
"path": "./snippets/snippets.json"
4545
},
4646
{
47-
"language": "jsx",
48-
"path": "./snippets/snippets.json"
47+
"language": "jsx",
48+
"path": "./snippets/snippets.json"
4949
}
5050
]
5151
},

0 commit comments

Comments
 (0)