Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 15 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ NextJS and React Snippets with TypeScript support as well!🚀
2. `rafect` (React Functional Component with Types)

```tsx
import { FC } from 'react';
import { FC } from "react";
interface Props {}
const Component: FC<Props> = () => {
return <div></div>;
Expand Down Expand Up @@ -81,9 +81,22 @@ NextJS and React Snippets with TypeScript support as well!🚀
3. `taytay` (NextPage component with NextPage type)

```tsx
import type { NextPage } from 'next';
import type { NextPage } from "next";
const Page: NextPage = () => {
return <></>;
};
export default Page;
```

4. `nextct` (Next JS Component with NextComponentType and Props)

```tsx
import type { NextComponentType, NextPageContext } from "next";
interface Props {}
const Component: NextComponentType<NextPageContext, {}, Props> = (
props: Props
) => {
return <div></div>;
};
export default Component;
```
19 changes: 18 additions & 1 deletion snippets/next-typescript.code-snippets
Original file line number Diff line number Diff line change
Expand Up @@ -38,5 +38,22 @@
"export default ${1:${TM_FILENAME}}"
],
"description": "NextPage component with NextPage type"
}
},
"nct": {
"prefix": "nextct",
"body": [
"import type { NextComponentType, NextPageContext } from \"next\";",
"interface Props {}",
"const ${1:${TM_FILENAME_BASE}}: NextComponentType<NextPageContext, {}, Props> = (",
" props: Props,",
") => {",
" return (",
" <div></div>",
" )",
"}",
"",
"export default ${1:${TM_FILENAME_BASE}}"
],
"description": "Next JS Component with NextComponentType and Props"
}
}