Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/vagnernerves/igniteteams

I developed the Ignite Teams project in React Native, where the creation of classes was developed and within them the creation of teams where people can be placed within each team.
https://github.com/vagnernerves/igniteteams

asyncstorage expo phosphoricons react-native react-navigation safeareacontext styled-components typescript

Last synced: 4 days ago
JSON representation

I developed the Ignite Teams project in React Native, where the creation of classes was developed and within them the creation of teams where people can be placed within each team.

Host: GitHub
URL: https://github.com/vagnernerves/igniteteams
Owner: VagnerNerves
License: mit
Created: 2023-01-29T21:52:30.000Z (almost 2 years ago)
Default Branch: master
Last Pushed: 2023-02-24T21:48:42.000Z (over 1 year ago)
Last Synced: 2023-04-29T15:09:08.404Z (over 1 year ago)
Topics: asyncstorage, expo, phosphoricons, react-native, react-navigation, safeareacontext, styled-components, typescript
Language: TypeScript
Homepage:
Size: 428 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        


  

  

  
Ignite Teams


  

I developed the Ignite Teams project in React Native, where the creation of classes was developed and within them the creation of teams where people can be placed within each team.

## 🧭 Table of contents

- [🧭 Table of contents](#-table-of-contents)

- [🎥 Implementation Video](#-implementation-video)

- [🎨 Layout](#-layout)

- [👏 Learning and more Implementations](#-learning-and-more-implementations)

- [💡 Technologies Used](#-technologies-used)

- [📂 Folder Structure](#-folder-structure)

- [🚀 Running the Project](#-running-the-project)

  - [Mobile](#mobile)

- [🌎 License](#-license)

- [✒ Author](#-author)

## 🎥 Implementation Video

https://user-images.githubusercontent.com/40831841/221297886-8f52b7b5-f79d-4a9a-add9-6d1f41706ede.mp4

## 🎨 Layout

Layout developed by [Rodrigo Gonçalves ](https://www.linkedin.com/in/rodrigo-goncalves-santana/) and [Millena Kupsinskü Martins](https://www.linkedin.com/in/millenakmartins/)

[![Layout in Figma](https://github.com/VagnerNerves/default-readme/blob/main/assets/layout-in-figma.svg)]()

## 👏 Learning and more Implementations

- I learned and implemented tweaks in import paths, decreasing the size with aliases configured in Babel and tsConfig.

- I learned and implemented the creation of a default and configured theme in Styled Components.

- I learned about how route navigation works in react native navigation and implemented Stack Navigator type routes.

- I learned how to save local data on the cell phone and implemented the functionalities in the storage folder.

- I implemented the screen to create teams and configured it to adjust when adding people, being able to exclude the team.

## 💡 Technologies Used

- [x] [Expo](https://docs.expo.dev/)

- [x] [React Native](https://reactnative.dev/) `version: "0.70.5"`

- [x] [TypeScript](https://www.typescriptlang.org/)

- [x] [Phosphor Icons](https://github.com/duongdev/phosphor-react-native)

- [x] [Styled Components](https://styled-components.com/)

- [x] [SafeAreaContext](https://docs.expo.dev/versions/latest/sdk/safe-area-context/)

- [x] [React Navigation](https://reactnavigation.org/)

- [x] [AsyncStorage](https://docs.expo.dev/versions/latest/sdk/async-storage/)

## 📂 Folder Structure

```plainText

app

.

├── assets                      # Images for expo

├── src                         # Source files

│   ├── @types                  # Contains all global definitions of types and interfaces

│   ├── assets                  # Contains Js bundles assets. e.g: icons, splash, images etc...

│   ├── components              # Contains all global react components

│   ├── routes                  # Contains application routes

│   ├── screens                 # Contains application screens

│   ├── storage                 # Contains saving data in locations.

│   ├── theme                   # Contains the theme of the application

│   ├── utils                   # Contains useful classes and functions

.

.

├── App.tsx                     # Bundle entry

.

.

└── README.md

```

## 🚀 Running the Project

### Mobile

Clone the project

```bash

  git clone https://github.com/VagnerNerves/igniteteams.git

```

Enter the project directory

```bash

  cd igniteteams

```

Install with dependencies

```bash

  npm i

```

Start the server

```bash

  npx expo start

```

## 🌎 License

This project is under the MIT license. See the [LICENSE](https://github.com/VagnerNerves/igniteteams/blob/master/LICENSE) file for more details.

## ✒ Author



  

    

  

  

  
Vagner Nerves


  


    Made with love and hate 😅, get in touch!

  




[![Linkedin Badge](https://img.shields.io/badge/-LinkedIn-1f6feb?style=flat-square&logo=Linkedin&logoColor=white&link=https://www.linkedin.com/in/vagnernervessantos/)](https://www.linkedin.com/in/vagnernervessantos/)

[![Gmail Badge](https://img.shields.io/badge/[email protected]?style=flat-square&logo=Gmail&logoColor=white&link=mailto:[email protected])](mailto:[email protected])

[![GitHub Badge](https://img.shields.io/badge/-GitHub-1f6feb?style=flat-square&logo=GitHub&logoColor=white&link=https://github.com/VagnerNerves)](https://github.com/VagnerNerves)