This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
## Typescript project start | |
yarn create react-app . --template typescript | |
## Add material UI | |
yarn add @mui/material @emotion/react @emotion/styled | |
## Add React Testing library | |
yarn add @testing-library/react |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
## Required | |
yarn add koa koa-router koa-views koa-body ejs nodemon | |
## If type orm used | |
yarn add -D @types/koa @types/koa-router @types/koa-views | |
## TypeScript sometimes not able to transcript body from ctx.request.body | |
For that add this in tscongig: | |
"compilerOptions": { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#step1 : Get NVM (Node Version Manger) | |
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.2/install.sh | bash | |
#step2 : Install the version of node.js you need | |
nvm install v12.16.1 | |
#step3 : Enjoy the rest of your day! |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
gatsby-plugin-emotion #https://www.gatsbyjs.org/packages/gatsby-plugin-emotion/ #for styled components | |
gatsby-plugin-sharp #https://www.gatsbyjs.org/packages/gatsby-plugin-sharp/ #Exposes several image processing functions | |
gatsby-transformer-sharp #https://www.gatsbyjs.org/packages/gatsby-transformer-sharp/?=gatsby%20transformer #Creates ImageSharp nodes from image types that are supported by the Sharp image processing library | |
gatsby-plugin-typography #https://www.gatsbyjs.org/packages/gatsby-plugin-typography/?=gatsby-plugin-typography #for typography | |
typography-theme-fairy-gates #https://github.com/KyleAMathews/typography.js/tree/master/packages/typography-theme-fairy-gates #typo library | |
gatsby-source-filesystem #https://www.gatsbyjs.org/packages/gatsby-source-filesystem/?=`gatsby-source-filesystem` #to get data about files |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import styled from "@emotion/styled" | |
import { css } from "@emotion/core" | |
import {Link} from 'gatsby'; | |
const NavLink = styled(Link)` | |
color:#222; | |
font-size:1rem; | |
font-weight: ${props => props.fontWeight || 'normal'}; | |
line-height:1; |