Giter VIP home page Giter VIP logo

demo-shareable-cards's Introduction

Getting Started

Yarn commands:

  • dev: Starts next in development mode
  • build: Builds the application for production
  • start: Starts the Next.js production server
  • export: Builds the application and exports to the out folder.
  • serve:static: Builds, exports and serves the static app.
  • lint: Runs ESLint to check for linting errors
  • lint:fix: Runs ESLint and attempts to fix linting errors
  • format: Checks the code for formatting errors using Prettier
  • format:fix: Fixes code formatting using Prettier
  • test: Runs Jest
  • test:watch: Runs Jest in watch mode

Open http://localhost:3000 with your browser to see the result.

✨ Code generators

Code generators help to create boilerplate code based on templates. This helps document best practices and keep the codebase consistent, as well as saving a bit of time. The templates are implemented in plopfile.ts. See Plop.js

Create a new component

Generates the boilerplate code for a component. Includes the styles, main component file and the index.ts file to export the main component and other functions or variables. The generator takes care of making capitalization of the files and variable names uniform.

Example:

# generates the code, prompting for the component name
$ yarn create-component
# generates the code using the given name (`usa map`)
$ yarn create-component 'usa map'
yarn run v1.22.10
$ plop component 'usa map'
✔  ++ /src/components/UsaMap/index.ts
✔  ++ /src/components/UsaMap/UsaMap.tsx
✔  ++ /src/components/UsaMap/UsaMap.styles.ts
✨  Done in 3.33s.

Create a script

Generates the boilerplate code for a script, including an index.ts and README.md files. The index file includes basic argument parsing and processing. See scripts/sum for an example.

Example:

# generate the code, prompting for the name and description
$ yarn create-script
# generates the code using the given name and description
$ yarn create-script 'fetch data' 'fetch data from the cloud'
yarn run v1.22.10
$ plop script 'fetch data' 'fetch data from the cloud'
✔  ++ /scripts/fetch-data/index.ts
✔  ++ /scripts/fetch-data/README.md
✨  Done in 3.44s.

Learn More

demo-shareable-cards's People

Contributors

pnavarrc avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.