diff --git a/CHANGELOG.md b/CHANGELOG.md index e6766e0..83c5e7b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,10 +1,7 @@ -# 0.1.0 (2022-02-10) +# 0.1.0 (2022-02-11) ### Features * add nextjs snippet ([8bd2027](https://github.com/avneesh0612/React-Next.js-snippets/commit/8bd2027d3a8fc5d30ea926319f263f029463139d)) * added next js typescript component ([7da5468](https://github.com/avneesh0612/React-Next.js-snippets/commit/7da54689a5ab29ac27d9cf7c5dbf48e3e7f80ed8)) - - - diff --git a/README.md b/README.md index a8d8696..7fdd226 100644 --- a/README.md +++ b/README.md @@ -18,9 +18,9 @@ NextJS and React Snippets with TypeScript support as well!🚀 ```jsx const Component = () => { - return
; - }; - export default Component; + return
+ } + export default Component ``` ### TypeScript @@ -28,12 +28,12 @@ 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 = () => { - return
; - }; - export default Component; + return
+ } + export default Component ``` ## NextJS @@ -46,8 +46,8 @@ NextJS and React Snippets with TypeScript support as well!🚀 export const getServerSideProps = async (context) => { return { props: {}, - }; - }; + } + } ``` 2. `nextssg` (Get Static Props Next.js) @@ -56,8 +56,8 @@ NextJS and React Snippets with TypeScript support as well!🚀 export const getStaticProps = async (context) => { return { props: {}, - }; - }; + } + } ``` ### TypeScript @@ -66,37 +66,45 @@ NextJS and React Snippets with TypeScript support as well!🚀 ```tsx export const getServerSideProps: GetServerSideProps = async (context) => { - return { props: {} }; - }; + return { props: {} } + } ``` 2. `nextssgt` (Get Static Props Next.js) ```tsx export const getStaticProps: getStaticProps = async (context) => { - return { props: {} }; - }; + return { props: {} } + } ``` -3. `taytay` (NextPage component with NextPage type) +3. `nextgip` (Get Initial Props in Next.js) ```tsx - import type { NextPage } from "next"; + Page.getInitialProps = async (context) => { + return { props: {} } + } + ``` + +3) `taytay` (NextPage component with NextPage type) + + ```tsx + import type { NextPage } from 'next' const Page: NextPage = () => { - return <>; - }; - export default Page; + return <> + } + export default Page ``` -4. `nextct` (Next JS Component with NextComponentType and Props) +4) `nextct` (Next JS Component with NextComponentType and Props) ```tsx - import type { NextComponentType, NextPageContext } from "next"; + import type { NextComponentType, NextPageContext } from 'next' interface Props {} const Component: NextComponentType = ( - props: Props + props: Props, ) => { - return
; - }; - export default Component; + return
+ } + export default Component ``` diff --git a/package.json b/package.json index f38ae54..7ce70d6 100644 --- a/package.json +++ b/package.json @@ -40,4 +40,4 @@ "devDependencies": { "husky": "^7.0.4" } -} \ No newline at end of file +} diff --git a/snippets/next-typescript.code-snippets b/snippets/next-typescript.code-snippets index e175312..2ba6605 100644 --- a/snippets/next-typescript.code-snippets +++ b/snippets/next-typescript.code-snippets @@ -28,17 +28,29 @@ "body": [ "import type { NextPage } from \"next\";", "", - "const ${1:${TM_FILENAME}}: NextPage = () => {", + "const ${1:${TM_FILENAME_BASE/(.*)/${1:/capitalize}/}}: NextPage = () => {", " return (", " <>", " ", " )", "}", "", - "export default ${1:${TM_FILENAME}}" + "export default ${1:${TM_FILENAME_BASE/(.*)/${1:/capitalize}/}}" ], "description": "NextPage component with NextPage type" }, + "nextgip": { + "prefix": "nextgip", + "body": [ + "${1:${TM_FILENAME_BASE/(.*)/${1:/capitalize}/}}.getInitialProps = async context => {", + " return {", + " ", + " };", + "};", + "" + ], + "description": "Get Initial Props in Next.js" + }, "nct": { "prefix": "nextct", "body": [ diff --git a/snippets/react-javascript.code-snippets b/snippets/react-javascript.code-snippets index facad22..16135ea 100644 --- a/snippets/react-javascript.code-snippets +++ b/snippets/react-javascript.code-snippets @@ -2,11 +2,11 @@ "rafce": { "prefix": "rafce", "body": [ - "const ${1:${TM_FILENAME}}= () => {", + "const ${1:${TM_FILENAME_BASE}}= () => {", " return
;", "};", "", - "export default ${1:${TM_FILENAME}};", + "export default ${1:${TM_FILENAME_BASE}};", "" ], "description": "React Functional Component" diff --git a/snippets/react-typescript.code-snippets b/snippets/react-typescript.code-snippets index d21816c..4ec3b9b 100644 --- a/snippets/react-typescript.code-snippets +++ b/snippets/react-typescript.code-snippets @@ -6,10 +6,10 @@ "", "interface Props {}", "", - "const ${1:${TM_FILENAME}}: FC = () => {", + "const ${1:${TM_FILENAME_BASE}}: FC = () => {", " return
;", "};", - "export default ${1:${TM_FILENAME}};" + "export default ${1:${TM_FILENAME_BASE}};" ], "description": "React Functional Component with Types" }