eudiegosilva / template--next-ts

This project is a boilerplate for Next and TypeScript projects. This template was built with Vite, TypeScript and Stitches.

Template NextTS — TypeScript, Stitches, Radix and Design Tokens

---

Summary

• About this template
• Avaliale scripts
  • Other scripts available
• Main technologies used
  • radix
  • stitches
  • storybook
  • typescript
• About me
  • #followMyWork

About this template

This project is a template for NextJS with TypeScript projects. This template was built with create-next-app, typescript, stitches, @radix-ui and storybook.

---

Avaliale scripts

At first, in the project directory, you need run:

// installing the dependencies
yarn

Other scripts available

// run project on http://127.0.0.1:5173/
yarn dev

Run the app in the development mode by opening http://localhost:3000/ to view it in the browser. The page will reload if you make edits.

// build project
yarn build

// preview project
yarn start

// runs the linter in all src/ files
yarn lint

// generate components quickly. e.g. to generate a <Button /> component, run:
yarn generate button

// run storybook on http://localhost:6006/
yarn storybook

Learn how to install yarn through the official documentation.

---

Main technologies used

• NextJS
• TypeScript
• Stitches
• Radix UI Colors
• Storybook
• ESLint
• Prettier
• Husky
• Commitlint
• Lint-staged
• Light / Dark theme
• Automated component creation

radix colors

An open-source color system for designing beautiful, accessible websites and apps.

stitches

CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.

storybook

Storybook is a frontend workshop for building UI components and pages in isolation.

typescript

TypeScript is JavaScript with syntax for types.

---

About me

I'm Diego Silva, Senior Frontend Developer at Neon Bank with focus on improving the Developer Experience and Community Manager at @99juniors.

---

#followMyWork