Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/cassiofb-dev/omnistack11

Implementação do aprendizado ocorrido na semana omnistack
https://github.com/cassiofb-dev/omnistack11

android expo ios js nodejs react react-native semana-omnistack

Last synced: about 2 months ago
JSON representation

Implementação do aprendizado ocorrido na semana omnistack

Awesome Lists containing this project

README 

        
# Semana OmniStack 11.0

![enter image description here](https://raw.githubusercontent.com/cassiofb-dev/OmniStack11/master/img/Wallpapers_OmniStack_11/Wallpaper%20OmniStack%2011%20-%201440x900.jpg)



---



Repositório onde será implementado o aprendizado da 11º edição da semana [OmniStack](https://rocketseat.com.br/week/inscricao/11.0).

# Dia 0

Aulas gratuitas e de qualidade para aprender [JavaScript](https://rocketseat.com.br/starter).



# Dia 1



 1. Apresentar aplicação
O nome da aplicação é **The Hero**, ela foi idealizada para facilitar e popularizar doações para ONGs.

 2. Configurar o ambiente OmniStack
Windows: [chocolatey](https://chocolatey.org/)
macOS: [Homebrew](https://brew.sh/index_pt-br)
VS Code: [Visual Studio Code](https://code.visualstudio.com/)

 3. Back-end X Front-end

 4. Criar projeto com [Node.js](https://nodejs.org/en/)

 5. Entender [React](https://reactjs.org/) e SPA

 6. Criar projeto com [reactjs](https://github.com/facebook/react/)

 7. Entender sobre [React Native](https://reactnative.dev/) e [Expo](https://expo.io/)

# Dia 2

 1. [Node.js](https://nodejs.org/en/) e [Express](https://expressjs.com/)
Métodos HTTP
Tipos de parâmetros

 2. Utilizando o [Insomnia](https://insomnia.rest/)

 3. Configurando o [Nodemon](https://nodemon.io/)

 4. Diferença entre bancos de dados

 5. Pensando nas entidades e funcionalidades

 6. Adicionando Knex

 7. Construção do back-end

 8. Adicionando módulo CORS

 9. Enviando back-end ao [GitHub](https://github.com/)

## Entidades



 - ONG

 - Caso (incident)

## Funcionalidades

 - Login de ONG

 - Logout de ONG

 - Cadastro de ONG

 - Cadastrar novos casos

 - Deletar casos

 - Listar casos de uma ONG

 - Listar todos os casos

# Dia 3

1. Limpando a estrutura

2. Conceitos do React:

	- Componentes

	- JSX

	- Propriedades

	- Estado

	- Imutabilidade

3. Página de Login

4. Configurando rotas

5. Cadastro de ONGs

6. Listagem de casos

7. Cadastro de um novo caso

8. Conectando a aplicação api

9. Enviar projeto ao github

# Dia 4

1. Instalando o Expo

2. Criando projeto React Native

3. Executando o projeto

	- No celular

	- No emulador

	- Expo Snack

4. Diferenças para ReactJS

	- Elementos HTML

	- Semântica

	- Estilização

		- Flexbox

		- Propriedades

		- Herança de estilos

		- Estilização própria

5. Estrutura de Pastas

6. Ícone e Splash Screen

7. Configurando Navegação

8. Página de Casos

9. Detalhe do Caso

10. Abrindo Whatsapp e Email

11. Conexão com a API

12. Eviando ao GitHub

# Dia 5

1. Adicionando validação

2. Adicionando testes

	- Porque fazer testes?

	- TDD

	- Configurando o [JEST](https://jestjs.io/)

	- Tipos de testes

	- Configurando o banco de testes

	- Instalando [supertest](https://github.com/visionmedia/supertest)

	- Testando rotas de autenticação

3. Deploy

	- Alternativas

	- Qual escolher

4. Estudos daqui pra frente

	- Padrões de código: [ESLint](https://eslint.org/), [Prettier](https://prettier.io/)

	- Autenticação [JWT](https://jwt.io/)

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

5. Dicas para aproveitar melhor

	- GitHub

	- Linkedin

	

---



> Ajudinha do [StackEdit](https://stackedit.io/)