1
- [ ![ Version] ( http ://vsmarketplacebadge.apphb.com/version-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
2
- [ ![ Install] ( http ://vsmarketplacebadge.apphb.com/installs-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
3
- [ ![ Ratings] ( http ://vsmarketplacebadge.apphb.com/rating-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
1
+ [ ![ Version] ( https ://vsmarketplacebadge.apphb.com/version-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
2
+ [ ![ Install] ( https ://vsmarketplacebadge.apphb.com/installs-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
3
+ [ ![ Ratings] ( https ://vsmarketplacebadge.apphb.com/rating-short/walter-ribeiro.full-react-snippets.svg)] ( https://marketplace.visualstudio.com/items?itemName=walter-ribeiro.full-react-snippets )
4
4
5
5
## Usage
6
6
@@ -10,347 +10,6 @@ After install this snippets add this inside your settings
10
10
11
11
## Snippets List
12
12
13
- | Snippets | Content |
14
- | -------: | --------|
15
- | imr | Import React |
16
- | imrc | Import React Component |
17
- | imrn | Import React-Native Element |
18
- | ims | Import Styled-Components |
19
- | imsn | Import Styled-Components Native |
20
- | rct | Redux constant |
21
- | crr | Connect Redux |
22
- | sl | Stateless Component |
23
- | slc | Stateless Component Function |
24
- | ccs | Component Class |
25
- | edccs | Export default Component Class |
26
- | rrd | Redux Reducer |
27
- | rpf | Redux Pure Function |
28
- | rpc | Redux Pure Function Const |
29
- | cwm | ComponentWillMount |
30
- | cdm | ComponentDidMount |
31
- | cdu | ComponentDidUpdate |
32
- | cwu | ComponentWillUpdate |
33
- | cwum | ComponentWillUnmount |
34
- | cwrp | ComponentWillReceiveProps |
35
- | ess | EStyleSheet Style |
36
- | ed | Export default |
37
- | edl | EslintDisableLine |
38
- | styc | Styled Component |
39
- | estyc | Export Styled Component |
40
- | edstyc | Export default Styled Component |
41
- | cmmb | Comment Big Block |
42
- | log | Console Log |
43
- | tdesc | Test Describe |
44
- | tit | Test It |
13
+ Coming soon...
45
14
46
15
---
47
-
48
- # imr [ Import React]
49
-
50
- ``` js
51
- import React from ' react'
52
- ```
53
-
54
- ---
55
-
56
- ## imrc [ Import React Component]
57
-
58
- ``` js
59
- import React , { Component } from ' react'
60
- ```
61
-
62
- ---
63
-
64
- ## imrn [ Import React-Native Element]
65
-
66
- ``` js
67
- import { $1 } from ' react-native'
68
- ```
69
-
70
- ---
71
-
72
- ## ims [ Import Styled-Components]
73
-
74
- ``` js
75
- import styled from ' styled-components'
76
- ```
77
-
78
- ---
79
-
80
- ## imsn [ Import Styled-Components Native]
81
-
82
- ``` js
83
- import styled from ' styled-components/native'
84
- ```
85
-
86
- ---
87
-
88
- ## rct [ Redux Constant]
89
-
90
- ``` js
91
- export const $1 = ' $1'
92
- ```
93
-
94
- ---
95
-
96
- ## crr [ Connect Redux]
97
-
98
- ``` js
99
- import { connect } from ' react-redux'
100
- ```
101
-
102
- ---
103
-
104
- ## sl [ Stateless Component]
105
-
106
- ``` js
107
- const $1 = () => (
108
- $2
109
- )
110
-
111
- export default $1
112
- ```
113
-
114
- ---
115
-
116
- ## slc [ Stateless Component Function]
117
-
118
- ``` js
119
- function $1 ($2 ) {
120
- $3
121
- }
122
-
123
- export default $1
124
- ```
125
-
126
- ---
127
-
128
- ## ccs [ Component Class]
129
-
130
- ``` js
131
- class $1 extends Component {
132
- state = { $2 }
133
- render () {
134
- return (
135
- $3
136
- )
137
- }
138
- }
139
-
140
- export default $1
141
- ```
142
-
143
- ---
144
-
145
- ## edccs [ Export default Component Class]
146
-
147
- ``` js
148
- export default class $1 extends Component {
149
- state = { $2 }
150
- render () {
151
- return (
152
- $3
153
- )
154
- }
155
- }
156
- ```
157
-
158
- ---
159
-
160
- ## rrd [ Redux Reducer]
161
-
162
- ``` js
163
- export default (state = $1 , action ) => {
164
- switch (action .type ) {
165
- case $2:
166
- $3
167
- default :
168
- return state
169
- }
170
- }
171
- ```
172
-
173
- ---
174
-
175
- ## rpf [ Redux pure function]
176
-
177
- ``` js
178
- export const $1 = ' $1'
179
-
180
- export function $2 ($3 ) {
181
- return {
182
- type: $1,
183
- $3
184
- }
185
- }
186
- ```
187
-
188
- ---
189
-
190
- ## rpc [ Redux pure function const]
191
-
192
- ``` js
193
- export const $1 = ' $1'
194
-
195
- export const $2 = $3 => ({
196
- type: $1,
197
- $3
198
- })
199
- ```
200
-
201
- ---
202
-
203
- ## cwm [ ComponentWillMount]
204
-
205
- ``` js
206
- componentWillMount () {
207
- $1
208
- }
209
- ```
210
-
211
-
212
- ## cwu [ ComponentWillUpdate]
213
-
214
- ``` js
215
- componentWillUpdate () {
216
- $1
217
- }
218
- ```
219
-
220
- ---
221
-
222
- ## cdu [ ComponentDidUpdate]
223
-
224
- ``` js
225
- componentDidUpdate (prevProps , prevState ) {
226
- $1
227
- }
228
- ```
229
-
230
- ---
231
-
232
- ## cdm [ ComponentDidMount]
233
-
234
- ``` js
235
- componentDidMount () {
236
- $1
237
- }
238
- ```
239
-
240
- ---
241
-
242
- # cwum [ ComponentWillUnmount]
243
-
244
- ``` js
245
- componentWillUnmount () {
246
- $1
247
- }
248
- ```
249
-
250
- ---
251
-
252
- # cwrp [ ComponentWillReceiveProps]
253
-
254
- ``` js
255
- componentWillReceiveProps (nextProps ) {
256
- $1
257
- }
258
- ```
259
-
260
- ---
261
-
262
- # ess [ EStyleSheet]
263
-
264
- ``` js
265
- import EStyleSheet from ' react-native-extended-stylesheet'
266
-
267
- const styles = EStyleSheet .create ({
268
- $1
269
- })
270
-
271
- export default styles
272
- ```
273
-
274
- ---
275
-
276
- ## ed [ Export default]
277
-
278
- ``` js
279
- export default $1
280
- ```
281
-
282
- ---
283
-
284
- ## edl [ Eslint Disable Line]
285
-
286
- ``` js
287
- // eslint-disable-line
288
- ```
289
-
290
- ---
291
-
292
- ## styc [ Styled Component]
293
-
294
- ``` js
295
- const $1 = styled .$2 `
296
- $3
297
- `
298
- ```
299
-
300
- ---
301
-
302
- ## estyc [ Export Styled Component]
303
-
304
- ``` js
305
- export const $1 = styled .$2 `
306
- $3
307
- `
308
- ```
309
-
310
- ## edstyc [ Export default Styled Component]
311
-
312
- ``` js
313
- export default styled .$1 `
314
- $2
315
- `
316
- ```
317
-
318
- ## cmmb [ Comment Big Block]
319
-
320
- ``` js
321
- /**
322
- |--------------------------------------------------
323
- | $1
324
- |--------------------------------------------------
325
- */
326
- ```
327
-
328
- ---
329
-
330
- ## log [ Console Log]
331
-
332
- ``` js
333
- console .log (' ====================================' )
334
- console .log ($1)
335
- console .log (' ====================================' )
336
- ```
337
-
338
- ---
339
-
340
- ## tdesc [ Test Describe]
341
-
342
- ``` js
343
- describe (' $1' , () => {
344
- $2
345
- })
346
- ```
347
-
348
- ---
349
-
350
- ## tit [ Test It]
351
-
352
- ``` js
353
- it (' should $1' , $2 ($3) => {
354
- $4
355
- })
356
- ```
0 commit comments