Projeto NCard

Aplicativo e site para comunicação entre funcionários utilzando o NCard

🛠 Tecnologias Utilizadas

• React
• React Native
• Expo
• Spring Boot (Java 20)
• Tailwind css
• Shadcn/ui
• TypeScript
• Native Base
• React Hook Form
• Yup
• Spring Security
• Tokens JWT
• Lombok
• Docker
• Github Actions
• Neon DB
• Figma

🎯 Objetivo Principal

O principal objetivo deste projto foi a criação de um site, aplicativo e API completa durante uma semana para a facilitar a comunicação dos colaboradores; Além disso foi implentado um fluxo de CI/CD Utilizando Docker, Github Actions, Render, Neon DB e Vercel.

📄 Documentação e casos de Uso

Link para a documentação

🎲 Modelagem do Banco de Dados

classDiagram
    class User {
        <<Entity>>
        - USER_CD_ID: UUID
        - USER_BOOL_STATUS: boolean
        - USER_TX_NAME: String
        - USER_TX_EMAIL: String
        - USER_TX_PASSWORD: String
        - USER_DT_BIRTHDATE: LocalDate
        - USER_TX_LOCALITY: String
        - USER_TX_DESCRIPTION: String
        - USER_TX_WORKTIME: LocalDate
        - USER_TX_WORKFUNCTION: String
        - USER_TX_SOCIALNAME: String
        - USER_TX_PHONE: String
        - USER_TX_PROFILE_PHOTO_URL: String
        - CREATED_AT: LocalDateTime
        - UPDATED_AT: LocalDateTime
        - USER_TX_ROLE: UserRole
        + updateInfos(dto: UpdateUserDTO): User
        + excluir(): void
    }

    class Card {
        <<Entity>>
        - CARD_CD_ID: UUID
        - CARD_BOOL_STATUS: boolean
        - CARD_CD_NFC_ID: String
        - CARD_TX_TYPE: CardType
        - CARD_TX_QRCODE_URL: String
        + excluir(): void
    }

    class SocialMedia {
        <<Entity>>
        - SOME_CD_ID: UUID
        - SOME_BOOL_STATUS: boolean
        - SOME_TX_NAME: SocialMediaNames
        - SOME_TX_URL: String
        + update(dto: SaveSocialMediaDTO): void
        + excluir(): void
    }

    class UserPhoto {
        <<Entity>>
        - USER_CD_ID: UUID
        - USPH_BL_PHOTO: byte[]
        - USPH_TX_TYPE: String
        - USPH_TX_SIZE: Long
    }

    class UserRole {
        <<Enum>>
        - ROLE: String
    }

    class CardType {
        <<Enum>>
        - TYPE: String
    }

    class SocialMediaNames {
        <<Enum>>
        - NAME: String
    }


  User --|> Card
  User --|> SocialMedia
  User --o UserPhoto
  UserRole --o User
  CardType --o Card
  SocialMediaNames --o SocialMedia

Loading

📸 Visuais e Telas

🎨 Link para o figma

💻 Como Rodar?

1. Clone o repositório

git clone https://github.com/Arawns1/NekiCard.git

2. Utilize o docker compose para subir a instancia de Banco de dados e API

    docker-compose up -d

3. Entre no diretório e rode

  npm install 

4. Altere o arquivo .ENV para o url de sua API para http://localhost:8082/

5. WEB - Rode o projeto. Abrirá em http://localhost:5173/

  npm run dev

5. MOBILE - Rode o projeto. E necessário rodar com um dispositivo conectado pois utiliza NFC

   npm run android
   

Por padrão o projeto web possui apenas a rota /user/{userId} que busca os dados do usuário