
Suporte técnico (WhatsApp) 62 9 9857-9084
Suporte técnico (WhatsApp) 62 9 9857-9084
Suporte técnico (WhatsApp) 62 9 9857-9084
Chame no WhatsApp
Contato para alunos ou suporte 62 9 9857-9084
Atenção o código da aula está em arquivo zip em baixo:
Qualquer dúvida suporte.
Suporte técnico (WhatsApp) 62 9 9857-9084
Atenção o código da aula está em arquivo zip em baixo:
Qualquer dúvida suporte.
Suporte técnico (WhatsApp) 62 9 9857-9084
Link para download
https://github.com/srodrigo28/expo-tailwind
Todos nossos arquivos de configuração.
** 0. criando o projeto
npx create-expo-app@latest --template
** 1. instalando dependência do tailwind
npx expo install nativewind tailwindcss react-native-reanimated react-native-safe-area-context
** 2. Setup tailwind
npx tailwindcss init
** 3. babel.config.js
module.exports = function (api) {
api.cache(true);
return {
presets: [
["babel-preset-expo", { jsxImportSource: "nativewind" }],
"nativewind/babel",
],
};
};
** 4. metro.config.js
const { getDefaultConfig } = require("expo/metro-config");
const { withNativeWind } = require("nativewind/metro");
const config = getDefaultConfig(__dirname);
module.exports = withNativeWind(config, { input: "./src/styles/global.css" });
** 5. nativewind-env.d.ts
/// <reference types="nativewind/types" />
tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{js,jsx,ts,tsx}"],
presets: [require("nativewind/preset")],
theme: {
extend: {},
},
plugins: [],
}
**** Criandos arquivos do projeto ****
** 6° Crie o arquivo: src/app/_layout.tsx
import '../styles/global.css'
import { Slot } from 'expo-router'
export default function Layout(){
return <Slot />
}
** 7° Crie o arquivo: src/app/styles/global.css
@tailwind base;
@tailwind components;
@tailwind utilities;
** 8° Crie o arquivo: src/app/index.tsx
import { View, Text } from "react-native"
export default function Index(){
return(
<View className="h-screen bg-black flex items-center justify-center">
<Text className="text-white text-3xl">Hello World Native Wind</Text>
</View>
)
}
Maior benefício para você: suporte direto comigo no WhatsApp.
Além do conteúdo em vídeo, você ganha consultoria gratuita para tirar dúvidas e receber orientação prática sempre que precisar.
O que você vai aprender
Criar aplicativos móveis do zero com React Native
Usar Expo, React Navigation e Styled-Components
Consumir APIs REST para criar apps com dados dinâmicos
Criar apps com layout responsivo e animações simples
Entender a estrutura de um projeto mobile real
Maior beneficio suporte por WhatsApp: Isso mesmo adquiriu o curso ganho uma consultoria grátis.
Para quem é este curso
Iniciantes que querem entrar no mundo do desenvolvimento mobile
Devs web que desejam migrar para aplicativos móveis
Quem busca criar seu próprio portfólio ou apps pessoais
Alunos que querem publicar apps em lojas no futuro
Para todo iniciante onde vamos começar da instalação das ferramentas
Para quem é apaixonado por códigos
Para quem quer um suporte com retorne em menos de 24hs.
Feito para quem quer trilhar em um futuro novo.
Projetos incluídos
App de receitas com categorias e navegação entre telas
App de listagem de usuários consumindo uma API real
Mini projeto com navegação em abas e drawer
Projeto Barber
Projeto telas de login
E muitos outros
Por que este curso é diferente?
Conteúdo direto e prático, com foco em construção de projetos reais
Didática pensada para quem está realmente começando
Apoio da comunidade e atualizações constantes do conteúdo
Gibhub e donwloads