Skip to content

Projeto de responsabilidade da @Rocketseat (https://rocketseat.com.br/) desenvolvido durante a 3a edição da Next Level Week - Trilha Discovery (https://nextlevelweek.com/), realizado entre os dias 12 a 18 de Outubro de 2020.

License

Notifications You must be signed in to change notification settings

DavidCezar/nlw3-discovery-happy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Happy


PRs welcome! License


Happy


Happy



Happy


💻 Tecnologias

Este projeto, 100% responsivo, utilizou das seguintes tecnologias para criação dos ambientes front-end e back-end:


📐 Projeto

O Happy é uma aplicação que conecta pessoas à casas de acolhimento institucional (antes chamadas de orfanatos) em homenagem ao mês das crianças. 💜

Foi escolhida como localização de exemplo Rio do Sul - Santa Catarina.

As imagens no site são aleatórias e servem apenas de exemplo.

Este projeto é de responsabilidade da Rocketseat e foi desenvolvido durante a 3a edição da Next Level Week - Trilha Discovery, realizada pela Rocketseat entre os dias 12 a 18 de Outubro de 2020.


📝 Layout

Você pode visualizar o layout do projeto através desse link. Lembrando que você precisa ter uma conta no Figma para acessá-lo.


💿 Instalação

Link de acesso a aplicação (Local)

Endereço local utilizado tanto pela extensão do VSCode (Live Server) no Front-End quanto pelo Node no Back-End.

http://127.0.0.1:5500/


Front-End

  1. Utilizado Visual Studio Code (VSCode) durante o desenvolvimento de todo projeto. Abaixo as principais extensões utitizadas:
  • Launchbase Theme
  • Bracket Pair Colorizer
  • Prettier
  • Tabnine
  • Material Icon Theme
  • Live Server (Utilizado apenas durante o desenvolvimento do front-end)

Back-End

  1. Desintalar a extensão do VSCode (Live Server) utilizada apenas no front-end

  2. Instalação do Node.js

  3. Instalação do Git. Usado como emulador de terminal por dentro do VSCode.

  4. Caso venha baixar o projeto via Github, toda a estrutura de diretório do projeto ficou alocado em c:\nlw (caminho absoluto: /c/nlw)

  5. Instalação dos seguintes plugins do Node com o uso do npm (node package manger):

  • Na pasta principal do projeto (/c/nlw) via terminal:

    $ npm init -y (Responsável por iniciar o projeto e pela criação do arquivo package.json o qual já se encontra disponível na estrutura de arquivos)

    $ npm install express (Responsável pelo mapeamento das dependências, bibliotecas, pela criação do arquivo package_lock.json e da pasta node-modules os quais já se encontram disponíveis na estrutura de arquivos)

    $ npm install nodemon (Faz o monitoramento do Node. Já está configurado no aquivo server.js a chamada da biblioteca express e o start no servidor na porta 5500. Será a partir do arquivo server.js que o plugin/dependência nodemon fará o restart automático do servidor sem a necessidade do restart manual ($ node src/server.js). Toda e qualquer alteração no arquivo server.js, o nodemon fará o restart automaticamente em background)

  • $ npm start (Executará o start do servidor com comando starting node src/server.js em backgound e o nodemon já estará monitorando o reload das alterarções sem a necessidade de um restart manual. O terminal pode ser fechado e aberto somente na necessidade de acompanhar algum console.log.

  • $ npm install hbs (Conhecido como Handlebars, é uma template engine que permite o uso de variáveis dentro do HTML. Sua chamada também é configurada pelo arquivo server.js. Após instalação do módulo hbs, todos os arquivos .html obrigatoriamente foram renomeados para .hbs tornando a funcionalidade do html dinâmico. Torna-se obrigatório essa alteração por estarrmos configurando toda parte de execução do projeto no back-end onde este será responsável em enviar as informações ao fron-end)

  • $ npm install sqlite-async (Será utilizado o SQLite onde o banco será armazenado em um arquivo a parte dentro da própria aplicação denominado database.sqlite Configurado nos aquivos pages.js e db.js)


🚀 Desafio

Validar se lat e lng estão preenchidos antes do envio do formulário. (Desafio sugerido pelo instrutor Mayk Brito) Desafio encontra-se realizado no final do arquivo page-create-orphanage.js.


⌛ Histórico de Versão

  • 1.0 - 16/10/2020

📋 Licença

Esse projeto está sob a licença MIT. Veja o link MIT License para mais detalhes.