Advanzzze NPM | npm.io

npx advanzzze

npx advanzzze é um comando simples e útil para iniciar projetos utilizando a versão mais recente do Next.js, com alguns pacotes de utilidades pré-instalados e configurados.

Funcionalidades

Projetos

Criar projetos Next.js mais recente
- Suporte Javascript
- Suporte Typescript
Suporte para criação de aplicativos desktop com Tauri e Next.js
Suporte para criação de aplicativos mobile

Utilidades

Plugin do Prettier de ordenação de classes para o Tailwind CSS
Adicionar a função cn para melhor aplicação de classes condicionais
- Guia para utilização do comando.

Instalação

Crie a pasta do seu projeto.
Entre na pasta do projeto e use npx advanzzze.
Escolha seu tipo de projeto e preferências.
Siga qualquer instrução adicional.
Comece a programar.

Referências úteis

Gerais
Desktop
- Tauri

Uso/Exemplos

cn

cn é uma função personalizada que utiliza clsx e tailwind-merge para, respectivamente, criar classes condicionalmente e juntá-las sem conflitos com o Tailwind CSS.

Utilização

cn('classes padrão', {
	'classes Condicinais': CondicaoUm,
	'classes Condicinais': CondicaoDois,
});

Exemplo de código

import cn from '@/utils/cn';

export default function Card({ bgColor, children }) {
	const isBlue = bgColor === 'blue';
	const isRed = bgColor === 'red';
	const isGreen = bgColor === 'green';

	return (
		<div
			className={cn('p-2 w-52 h-24 border border-black', {
				'bg-blue-500': isBlue,
				'bg-red-500': isRed,
				'bg-green-500': isGreen,
			})}>
			{children}
		</div>
	);
}