Desenvolvi uma página, que consome a API do The Meal DB, que consiste em trazer receitas diversas. O desafio foi proposto pela Arise Technology e cumprido com muito esforço e dedicação.
Finalizado
Indique como é possível baixar ou acessar o código fonte do projeto, seja projeto inicial ou final
Certifique-se de ter o Node.js instalado no seu sistema. Você pode baixá-lo em nodejs.org.
O Vite é uma ferramenta de desenvolvimento rápida que será usada para criar o projeto React. Você pode instalá-lo globalmente com o seguinte comando:
npm install -g create-vite
# ou, usando Yarn
yarn global add create-vite
Agora, você pode criar um novo projeto React usando o Vite com o template "react":
create-vite my-react-app --template react
# ou, usando Yarn
yarn create vite my-react-app --template react
Isso criará uma estrutura básica de projeto React usando o Vite.
Vá para a pasta do projeto recém-criado:
cd my-react-app
Dentro da pasta do projeto, você deve instalar as dependências do projeto, incluindo o Tailwind CSS e o React:
npm install
# ou, usando Yarn
yarn install
Agora, você precisa configurar o Tailwind CSS. Crie um arquivo de configuração do Tailwind chamado tailwind.config.js na raiz do seu projeto:
npx tailwindcss init -p
Isso criará um arquivo de configuração tailwind.config.js. Você pode personalizar as configurações do Tailwind conforme necessário.
Abra o arquivo src/index.css e importe o Tailwind CSS:
/* src/index.css */
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';
Agora, você pode iniciar o servidor de desenvolvimento para executar o projeto:
npm run dev
# ou, usando Yarn
yarn dev
O servidor de desenvolvimento Vite iniciará, e seu projeto React com o Tailwind CSS estará disponível em (alguma porta, que indicar no terminal)