Transferir como PDF, PPTX
![gulp.task(glob, [deps], fn)
• Define uma tarefa com dependências opcionais](https://image.slidesharecdn.com/desenvolvendoumaaplicaofulljavascript-151126001730-lva1-app6891/75/Desenvolvendo-uma-aplicacao-Full-Javascript-27-2048.jpg)
Carregado porDenis Vieira
Desenvolvendo uma aplicacao Full Javascript
O documento discute o desenvolvimento de uma aplicação full stack JavaScript usando MongoDB, Express, AngularJS e Node.js. Ele explica como usar essas tecnologias juntas, incluindo o uso de bancos de dados NoSQL, arquitetura MVC, APIs RESTful e WebSockets. Além disso, discute ferramentas como Gulp para automatizar tarefas.
Mais conteúdo relacionado
Desenvolvendo uma aplicacao Full Javascript
- 1. Desenvolvendo uma aplicação FullJavascript
- 2. DENIS VIEIRA DJANILSON ALVES JOÃOVICTOR BERTA
- 3. •SINGLE-PAGE APPLICATION •BANCO DE DADOSNOSQL •ARQUITETURA MVC •API RESTFUL •WEBSOCKET
- 6. NoSQL ( NonRelational DB) • Bancos de dados que não utilizam o mesmo esquema de tabelas que os SGBDs comuns; • Altamente escaláveis; • Tipos: Documentos(MongoDb), Chave- Valor(Redis), Grafos(Neoj4).
- 7. COMPARAÇÃO SQL • Armazena osdados no formato de tabelas, em colunas e linhas; • Realiza Joins entre as Diferentes tabelas; • Utiliza os princípios ACID; • Possui o controle de transações. NOSQL • Armazena os dados em diversos formatos a depender do objetivo; • Não possui estrutura pré-definida; • Escalabilidade horizontal(Sharding).
- 8.
- 9. • Desenvolvido emC++ • Interface em JS • Orientado a documentos JSON • Genérico • Schemaless • Replica • Sharding
- 10. Node.js is aplatform built on Google’s V8 JavaScript engine for easily building fast scalable network applicatioons. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, data- intensive real-time applications that run across distributed devices
- 11.
- 12.
- 13.
- 14. Asynchronous I/O • I/Oera o gargalo das aplicações • Não espera as operações de I/O acabarem para continuar executando.
- 15.
- 16. • Gerenciador dePacotes • Repositório
- 17.
- 19. • Utilizado paraaplicação que necessitam de comunicação em tempo real; • Abstrai a complexidade dos WebSockets; • Fornece uma API simples para a aplicação cliente se comunicar.
- 21. PROS/CONTRAS PROS • Aplicação em temporeal; • Chat; • Aplicação Web; • Banco de dados não relacionais; • Data streaming; CONTRAS • Cpu intensive; • Necessidade de utilizar bancos relacionais.
- 22.
- 23. Por que usarGULP ? • Eficiente • Gulp usa o poder de streams do NodeJs, o que permite builds muitos mais rápidos. • Fácil de usar • Código para definir as configuração, o Gulp mantém as coisas simples e faz tarefas complexas gerenciável. • Fácil de aprender • Com uma API mínima, aprende-se a trabalhar com o Gulp quase que na hora!
- 24.
- 25. Gulpfile.js • Importe ogulp e os plugins associados às tarefas que deseja automatizar
- 26. 5 fatos importantespara criar e executar suas tarefas do gulpfile.js
- 27. gulp.task(glob, [deps], fn) •Define uma tarefa com dependências opcionais
- 28. Executando o gulpfile.js •Default, engloba todas as outras tarefas. Será executada ao entrar Gulp na linha de comando sem parâmetros adicionais.
- 29. Gulpfile watch • Watch,mantem o gulp rodando e esperando por eventos para tratá-los
- 30.
- 31. Pré-Processadores CSS • Umpré-processador é um programa que recebe texto e efetua conversões léxicas nele. • • As conversões podem incluir substituição de macros, inclusão condicional e inclusão de outros ficheiros.
- 32. Premissas • Syntactically Awesome Style Sheets •(Folhas de estilo sintaticamente incríveis) • Don’t Repeat Yourself (DRY CSS) • CSS 'componentizado' Features • Variáveis • Mixins • Operacionais • Condicionais • loops
- 33. Don’t Repeat Yourself (DRYCSS) • Mude a cor de uma variável e o compilador faz o resto.
- 34.
- 35.
- 36.
- 37.
- 39.
- 40. Estrutura de arquivos Componetizando: Pracada projeto uma public_html diferente mas a mesma SCSS. No geral o que mais muda é o diretório pages
- 43. Por que usar? • Data Binding de 2 vias • Separação Lógica e Visão • Testabilidade • Componentização • Filtros, ordenação, etc. • Extensa documentação e components de terceiros • SPA, Single Page Application • Comunidade Ativa • Mantenedor: Google!
- 44.
- 45.
- 46.
- 48. Gerenciamento do Projeto Controlede Versão Hospedagem da API
- 49.
- 50.
- 51.
- 53. • A CompleteGuide to MEAN Stack : • https://github.com/ericdouglas/MEAN- Learning • • Get Started : https://hackhands.com/how- to-get-started-on-the-mean-stack/ • • Mastering MEAN : • https://masteringmean.com/ • • Palestra Be Mean( Jean Carlo “Suissa” ): http://www.infoq.com/br/presentations/be- mean#downloadPdf
- 54. Guia MongoDB • MongoDb - https://www.mongodb.com/ • NoSql / Non Relational DB : https://www.mongodb.com/nosql-explained • Curso Gratuito : https://university.mongodb.com/ • NPM e Modulos - https://www.npmjs.com/ • Express - http://expressjs.com/ •
- 55. Guia SASS • Repositoriodo Gulp no github • https://github.com/gulpjs • Travismaynard - Get started with Gulp • https://travismaynard.com/writing/getting- started-with-gulp • Repositório do Sass no github • https://github.com/sass/sass • Sass guide • http://sass-lang.com/guide
- 56. Guia AngularJS • AprendaAngularJS com estes 5 Exemplos Práticos: - http://javascriptbrasil.com/2013/10/23/aprenda-angularjs-com-estes-5-exemplos- praticos/ • Guia Definitivo para se aprender AngularJS em um dia: - http://javascriptbrasil.com/2013/10/18/guia-definitivo-para-aprender-angularjs-em- um-dia/ • Tutorial de um CRUD Básico: http://www.youtube.com/watch?v=iCQ3qic_nGg • Lista de muitos e muitos recursos, vídeos e tutoriais: https://github.com/jmcunningham/AngularJS-Learning • Tutorial Oficial do AngularJS: http://docs.angularjs.org/tutorial • AngularJS Guide: http://docs.angularjs.org/guide/overview • Diversos tutoriais de varias features do AngularJS: https://egghead.io/technologies/angularjs • Design Patterns and Best Practices : http://trochette.github.io/Angular-Design- Patterns-Best-Practices/#/intro
- 57.