Skip to content

Commit 69b11e6

Browse files
avneesh0612avneesh0612
authored
feat: added next custom next doc and _app (#23)
1 parent 4806d95 commit 69b11e6

File tree

3 files changed

+172
-49
lines changed

3 files changed

+172
-49
lines changed

‎README.md‎

Lines changed: 100 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -16,125 +16,151 @@ NextJS and React Snippets with TypeScript support as well!🚀
1616

1717
1. `rimr` (Import React)
1818

19-
```jsx
20-
import React from 'react';
21-
```
19+
```jsx
20+
import React from "react";
21+
```
2222

2323
2. `rimrd` (Import ReactDOM)
2424

25-
```jsx
26-
import ReactDOM from 'react-dom';
27-
```
25+
```jsx
26+
import ReactDOM from "react-dom";
27+
```
2828

2929
3. `rimrs` (Import React and useState)
3030

31-
```jsx
32-
import React, { useState } from 'react';
33-
```
31+
```jsx
32+
import React, { useState } from "react";
33+
```
3434

3535
4. `rimrse` (Import React, useState and useEffect)
3636

37-
```jsx
38-
import React, { useState, useEffect} from 'react';
39-
```
37+
```jsx
38+
import React, { useState, useEffect } from "react";
39+
```
4040

4141
5. `rfce` (React functional component)
4242

43-
```jsx
44-
const Component = () => {
45-
return <div></div>;
46-
}
47-
export default Component;
48-
```
43+
```jsx
44+
const Component = () => {
45+
return <div></div>;
46+
};
47+
export default Component;
48+
```
4949

5050
6. `rue` (React useEffect)
5151

52-
```jsx
53-
useEffect(() => {
54-
55-
}, []);
56-
```
52+
```jsx
53+
useEffect(() => {}, []);
54+
```
5755

5856
7. `rus` (React useState)
5957

60-
```jsx
61-
const [state, setState] = useState(initialValue);
62-
```
58+
```jsx
59+
const [state, setState] = useState(initialValue);
60+
```
6361

6462
8. `ruc` (React useContext)
6563

66-
```jsx
67-
const value = useContext(myContext);
68-
```
64+
```jsx
65+
const value = useContext(myContext);
66+
```
6967

7068
9. `rur` (React useRef)
7169

72-
```jsx
73-
const refContainer = useRef(initialValue);
74-
```
70+
```jsx
71+
const refContainer = useRef(initialValue);
72+
```
7573

7674
### TypeScript
7775

7876
1. `rfcet` (React functional component Typescript)
7977

80-
```tsx
81-
import React from "react";
78+
```tsx
79+
import React from "react";
8280

83-
interface Props {}
81+
interface Props {}
8482

85-
function Component({}: Props) {
86-
return <div></div>;
87-
}
83+
function Component({}: Props) {
84+
return <div></div>;
85+
}
8886

89-
export default Component;
90-
```
87+
export default Component;
88+
```
9189

9290
## NextJS
9391

9492
### JavaScript
9593

96-
1. `nssr` (Next.js Get Server Side Props Typescript)
94+
1. `nssr` (Next.js Get Server Side Props)
9795

9896
```jsx
99-
export const getServerSideProps = async (context) => {
97+
export const getServerSideProps = async context => {
10098
return {
10199
props: {},
102100
};
103101
};
104102
```
105103

106-
2. `nssg` (Next.js Get Static Props Typescript)
104+
2. `nssg` (Next.js Get Static Props)
107105

108106
```jsx
109-
export const getStaticProps = async (context) => {
107+
export const getStaticProps = async context => {
110108
return {
111109
props: {},
112110
};
113111
};
114112
```
115113

114+
3. `ncapp` (Next Custom App)
115+
116+
```jsx
117+
const MyApp = ({ Component, pageProps }) => {
118+
return <Component {...pageProps} />;
119+
};
120+
121+
export default MyApp;
122+
```
123+
124+
4. `ncdoc` (Next Custom Document)
125+
126+
```jsx
127+
import Document, { Html, Main, NextScript } from "next/_document";
128+
const Document: Document = () => {
129+
return (
130+
<Html lang="en">
131+
<body>
132+
<Main />
133+
<NextScript />
134+
</body>
135+
</Html>
136+
);
137+
};
138+
139+
export default Document;
140+
```
141+
116142
### TypeScript
117143

118144
1. `nssrt` (Next.js Get Server Side Props Typescript)
119145

120146
```tsx
121-
export const getServerSideProps: GetServerSideProps = async (context) => {
147+
export const getServerSideProps: GetServerSideProps = async context => {
122148
return { props: {} };
123149
};
124150
```
125151

126152
2. `nssgt` (Next.js Get Static Props Typescript)
127153

128154
```tsx
129-
export const getStaticProps: getStaticProps = async (context) => {
155+
export const getStaticProps: getStaticProps = async context => {
130156
return { props: {} };
131157
};
132158
```
133159

134160
3. `ngip` (Get Initial Props in Next.js)
135161

136162
```tsx
137-
Page.getInitialProps = async (context) => {
163+
Page.getInitialProps = async context => {
138164
return { props: {} };
139165
};
140166
```
@@ -161,3 +187,30 @@ NextJS and React Snippets with TypeScript support as well!🚀
161187
};
162188
export default Component;
163189
```
190+
191+
6. `ncappt` (Next Custom App Typescript)
192+
193+
```tsx
194+
const MyApp = ({ Component, pageProps }) => {
195+
return <Component {...pageProps} />;
196+
};
197+
export default MyApp;
198+
```
199+
200+
7. `ncdoct`(Next Custom Document Typescript)
201+
202+
```tsx
203+
import Document, { Html, Main, NextScript } from "next/_document";
204+
const Document: Document = () => {
205+
return (
206+
<Html lang="en">
207+
<body>
208+
<Main />
209+
<NextScript />
210+
</body>
211+
</Html>
212+
);
213+
};
214+
215+
export default Document;
216+
```

‎snippets/next-javascript.json‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
],
1111
"description": "Next.js Get Server Side Props Typescript"
1212
},
13+
1314
"nssg": {
1415
"prefix": "nssg",
1516
"body": [
@@ -20,5 +21,38 @@
2021
"};"
2122
],
2223
"description": "Next.js Get Static Props Typescript"
24+
},
25+
26+
"ncapp": {
27+
"prefix": "ncapp",
28+
"body": [
29+
"const MyApp = ({ Component, pageProps }) => {",
30+
" return <Component {...pageProps} />;",
31+
"}",
32+
"",
33+
"export default MyApp;"
34+
],
35+
"description": "Next Custom App"
36+
},
37+
38+
"ncdoc": {
39+
"prefix": "ncdoc",
40+
"body": [
41+
"import { Html, Main, NextScript } from \"next/_document\";",
42+
"",
43+
"const Document = () => {",
44+
" return (",
45+
" <Html lang=\"en\">",
46+
" <body>",
47+
" <Main />",
48+
" <NextScript />",
49+
" </body>",
50+
" </Html>",
51+
" );",
52+
"};",
53+
"",
54+
"export default Document;"
55+
],
56+
"description": "Next Custom Document"
2357
}
2458
}

‎snippets/next-typescript.json‎

Lines changed: 38 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
],
1111
"description": "Next.js Get Server Side Props Typescript"
1212
},
13+
1314
"nssgt": {
1415
"prefix": "nssgt",
1516
"body": [
@@ -21,6 +22,7 @@
2122
],
2223
"description": "Next.js Get Static Props Typescript"
2324
},
25+
2426
"npt": {
2527
"prefix": "npt",
2628
"body": [
@@ -37,18 +39,19 @@
3739
],
3840
"description": "Next.js Page Typescript"
3941
},
42+
4043
"ngip": {
4144
"prefix": "ngip",
4245
"body": [
4346
"${1:${TM_FILENAME_BASE/(.*)/${1:/capitalize}/}}.getInitialProps = async context => {",
4447
" return {",
4548
" ",
4649
" };",
47-
"};",
48-
""
50+
"};"
4951
],
5052
"description": "Next.js Get Initial Props"
5153
},
54+
5255
"nct": {
5356
"prefix": "nct",
5457
"body": [
@@ -67,5 +70,38 @@
6770
"export default ${1:${TM_FILENAME_BASE/(.*)/${1:/capitalize}/}}"
6871
],
6972
"description": "Next.js Component Typescript"
73+
},
74+
75+
"ncappt": {
76+
"prefix": "ncappt",
77+
"body": [
78+
"const MyApp = ({ Component, pageProps }) => {",
79+
" return <Component {...pageProps} />;",
80+
"};",
81+
"",
82+
"export default MyApp;"
83+
],
84+
"description": "Next Custom App Typescript"
85+
},
86+
87+
"ncdoct": {
88+
"prefix": "ncdoct",
89+
"body": [
90+
"import Document, { Html, Main, NextScript } from \"next/_document\";",
91+
"",
92+
"const Document: Document = () => {",
93+
" return (",
94+
" <Html lang=\"en\">",
95+
" <body>",
96+
" <Main />",
97+
" <NextScript />",
98+
" </body>",
99+
" </Html>",
100+
" );",
101+
"};",
102+
"",
103+
"export default Document;"
104+
],
105+
"description": "Next Custom Document Typescript"
70106
}
71107
}

0 commit comments

Comments
 (0)