Skip to content

Sumários

Jump to bottom
Miguel Gamboa edited this page Nov 26, 2020 · 51 revisions

Aulas

Livro de Referência:

Lesson 01 - Apresentação

06-10-2020

  • Apresentação da disciplina de Programação na Internet -- PI
  • Regras de avaliação
  • Bibliografia
  • Documentação suplementar: nodeschool.io
  • Evolução histórica do Javascript desde o seu aparecimento em 1995 com o objectivo inicial de uma linguagem de scripting para o browser até à sua execução no ambiente Node.js
  • Papel da linguagem Javascript como: alto nível (e.g. Java, C, etc) e intermédia (e.g. bytecodes, IL).
  • SLIDES: pi-52d-aula01.pdf

Lesson 02 - Scopes, Tipos

08-10-2020

  • Análise das características da linguagem de programação Javascript como: dinâmica, untyped, e interpretada.
  • Duck Typing
  • Dinâmica -- Adicionar e remover propriedades em Tempo de Execução:
    • obj.nova_prop -- adicionar uma propriedade que não existe
    • delete obj.prop -- remover uma propriedades existente
  • Ambiente de desenvolvimento:
    • Modo use strict
    • ESLint -- Javascript linter
    • Editor e.g. Visual Code, Notepad, InteliJ, etc.
  • Scopes:
    • let e const – variáveis que NÃO podem ser usadas fora do bloco em que foram declaradas. Temporal Dead Zone
    • var - scope da função onde é declarada. Recomendação de NÃO usar.
  • Sistema de tipos EcmaScript edição 6: Object e Primitivos (todos os outros que não são Object)
  • Tipos Primitivos: Undefined, Null, Boolean, Number, String.
  • operador typeof e instanceof
  • Objecto Literal: { prop1: valor1, prop: valor2, …}
  • propriedades são membros de um objecto que armazenam valores.
  • SLIDES: pi-52d-aula02.pdf

Lesson 03 - Funções, Objectos e Prototype

09-10-2020

  • Node.js:
    • = AVE + gestão de dependencias (bibliotecas)
    • = V8 + NPM package manager
  • V8 JavaScript Engine projecto open-source de uma máquina virtual da Google, parte integrante do Browser Chrome, lançado em 2008.
  • V8 como um Ambiente Virtual de Execução com as mesmas características de outros ambientes como JVM, ou CLR.
  • Os componentes são distribuídos em código fonte JavaScript, podendo o JavaScript ter também uma perspectiva de linguagem intermédia como target de compiladores de linguagens como o TypeScript, Python, entre outras.
  • Uma propriedade que armazena uma função é um método
  • Função Construtora --- tem uma propriedade explícita prototype.
  • Objecto ––– constructor –––> função Construtora (código) ––– prototype –––> objecto Protótipo.
  • O protótipo tem a semântica do padrão de desenho Prototype
  • O protótipo serve de “modelo” à criação de novos objectos
  • Exemplos de actualização do prototype e reflexo nos objectos com esse prototype
  • Properties Lookup (o objecto tem precedência sobre o protótipo)
    • Primeiro procura no objecto uma propriedade com o nome igual
    • Caso não encontre, então procura no prototype uma propriedade com esse nome
  • Funções são first-class objects -- as funções têm todas funcionalidades que tem qualquer outro objecto JavaScript:
    • Podem ser atribuídas a variáveis
    • Podem ser passadas por parâmetro
    • Podem ter propriedades definidas pelo programador (campos ou métodos)
  • Funções têm uma capacidade adicional sobre os objectos que é poderem ser invocadas.,
  • Introspecção sobre objectos em Javascript (comparação com Reflexão via .Net ou Java):
    • Enumeração sobre nomes das propriedades de um objecto – for(let key in objRef)
    • Aceder a uma propriedade com nome dado por uma expressão: obj[exp]
    • Chamar um método com nome dado por uma expressão: obj[exp]()

Lesson 04 - Constructor, Prototype e Class

13-10-2020

  • Função Construtora
  • Chamada realizada com o operador prefixo new
  • O construtor retorna implicitamente o novo objecto (this) a não ser que haja retorno explícito
  • Associação de método de instância por via do Prototype
    • e.g. Point.prototype.module = function() {return Math.sqrt(this.x*this.x + this.y*this.y)}
  • Definição equivalente com class em ECMAScript 6
  • Os métodos correspondem a proprieades not enumerable <=>:
Object.defineProperty(Point.prototype, 'module', {
    value: function() {
        return Math.sqrt(this.x*this.x + this.y*this.y)
    }
})
  • Enumerar propriedades visíveis: for(let propName in obj)
  • Enumerar todas as propriedades: for(let propName of Object.getOwnPropertyNames(obj))

Lesson 08 - calling convention

  • As funções são declaradas como literais que criam um valor função. 3 formas:
    • função com nome e.g. function foo() {}
    • função sem nome e.g. function () {} (função anónima)
    • arrow function e.g. () => {} (função anónima)
  • Uma função tem uma propriedade name que guarda o nome declarado na função.
  • Funções anónimas têm a propriedade name igual "" string vazia.
  • O nome da variável que refere uma função != da propriedade name dessa função
  • Todas as funções recebem dois parâmetros implícitos: this e arguments
  • arguments é uma colecção com o mesmo comportamento de array mas sem os seus métodos.
  • O número de argumentos, não tem que coincidir com o número de parâmetros
  • 4 formas de chamar uma função:
    • Como uma função (sem target) => this igual a undefined
    • Como um método de instância -- this igual ao target e.g. target.methodName()
    • Como construtor -- this igual ao objecto criado e.g. new funcName()
    • com apply() ou call()
  • Função Construtora
  • Chamada realizada com o operador prefixo new
  • O operador new altera o significado do this que refere o objecto criado;
  • O construtor retorna implicitamente o novo objecto (this) a não ser que haja retorno explícito;

Closure:

  • Por cada chamada a uma função é criado um novo conjunto de variáveis com o contexto dessa função;
  • As funções internas têm acesso às variáveis locais (parâmetros, ou não);
  • NESTE caso, o ciclo de vida das variáveis externas é prolongado (apenas se for usada a função interna).

Lesson 09 - Node.js

  • package.json
  • npm init
  • npm install <pkg> --save -- download módulo <pkg> e actualiza package.json
  • repositório local node_modules -- Adicionar ao .gitignore
  • npm install -- download das bibliotecas especificadas em package.json
  • CommonJS -- definição do formato dos módulos.
  • require(‘nome’) -- incorpora um módulo Node na forma de um objecto.
  • module.exports
  • fs = require('fs') -- módulo file system
  • Exemplos de utilização da API síncrona de sync-request:
    • req('GET', 'http://example.com').getBody().toString()
  • Node.js: Google's V8 JavaScript engine + event loop + low-level I/O API;
  • Event Loop para executar operações (na forma de callbacks) quando um evento ocorre.
  • Felix Geisendörfer: “everything runs in parallel except your code.”
  • Vários callbacks podem responder a um mesmo evento, mas só um é executado em cada instante – sequencialmente.
  • Os callbacks NÃO são interrompidos por outros callbacks, nem correm em paralelo com outros callbacks.
  • Do ponto de vista da linguagem JavaScript o Node.js oferece um ambiente single-threaded.
  • Todas as operações de IO do Node.js podem ser executadas emsimultaneo e.g. ler ficheiros; peidos HTTP,….
  • As operações de IO usam técnicas non-blocking.

github.com/maxogden/art-of-node

Lesson 10 - Sync versus Async

  • Distinção entre modelo de chamada síncrono versus assíncrono. Exemplos.
  • Exemplificação em Node Js de uma sequência de pedidos Http de forma Síncrona versus Assíncrona através dos módulos sync-request vs request.
  • Idiomatic Node.js callback convention -- (err, data) => void
  • Características do modelo de callback do node.js:
    • (err, data) => void
    • O callback é o último parâmetro passado a um método assíncrono.
    • Idioma: if(err) return cb(err)
    • Em caso de sucesso: cb(null, data)

github.com/maxogden/art-of-node

Lesson 12 - Developing asynchronous API

  • Revisão do modelo Assíncrono baseado em Callback
  • Menção a outras formas de utilização de um modelo de chamada assíncrono (tratado na UC de Programação Concorrente):
    • Promises
    • async/await
  • Características do modelo de callback do node.js:
    • (err, data) => void
    • O callback é o último parâmetro passado a um método assíncrono.
    • Idioma: if(err) return cb(err)
    • Em caso de sucesso: cb(null, data)
  • Implementação de uma API assíncrona baseada em callback
  • Retornar o tamanho do ficheiro e outra função que calcula o somatório dos ficheiros.

Lesson 13 - Web App and Enterprise Applications

  • Martin Fowler “Enterprise applications are about the display, manipulation, and storage of large amounts of often complex data and the support or automation of business processes with that data” [Fowler, 2003].
  • Simplistic view: 📂 --> Data Layer --> Domain --> UI --> 👤
  • 3 Layers or Tiers
  • Exemplo: BD SQL --> JDBC --> Model + Services --> HTML + CSS + Css --> 🌐
  • vinyl -- Desenho de uma aplicação Web para gestão de listas de bandas favoritas por utilizador.
  • vinyl:
Last.fm API     ---> urllib ---> lastfm \
                                         ---> vinyl ---> UI
users.json File ---> fs     ---> users  /
  • lastfm - Análise da fontes de dados Last.fm API
  • users - Desenho do formato de dados para armazenar utilizadores e suas bandas favoritas

Lesson 14 - Service

  • vinyl -- obter o top das músicas das bandas favoritas de um utilizador.
  • Implementação dos módulos da aplicação vinyl: 1. lastfm, 2. users e 3. vinyl:
    1. lastfm -- getTopTracks(artist, cb)
    2. users -- function getUser(username, cb)
    3. vinyl -- function getTopTracks(username, limit, cb)
  • Documentação da API com JSDoc

Lesson 17 - Unit tests, coverage and mocks

  • JavaScript Testing Frameworks: nodeunit, mocha, jest, etc
  • Using jest:
    1. npm install --save-dev jest
    2. npm install --save-dev @types/jest -- To provide full typing and e.g. intellisense in VS Code
    3. jest --init -- Generate a basic configuration file
    4. npm run test calls jest to run tests
    5. jest --coverage to check code coverage
  • Code Coverage
  • Testing Asynchronous Code
  • Mock - simulated objects that mimic the behavior of real objects.
  • Implementing a mock for urllib
    1. jest.mock('urllib')
    2. urllib.request.mockImplementationOnce(function ....)

Lesson 18 - App Web and routing

  • URIs, Resources and Representation
  • Schemes, e.g. scheme http://-- protocolo http
  • App WEB: HTTP Server; Routing; Representation (e.g. HTML, Json, CSV, other; aka Views)
  • Request Methods: GET, POST, PUT, DELETE.
  • Idempotent property defined by RFC 7231.
  • PUT <versus> POST
  • Designing routes for vinyl web application:
GET    /vinyl/users/<username>          => getUser()
GET    /vinyl/users                     => getUsers()
DELETE /vinyl/users/<username>          => removeUser()
PUT    /vinyl/users/<username>          => addUser()   // unique usernames
POST   /vinyl/users/<username>/artists  => addArtist() // allows repetitions
  • const server = http.createServer((req, res) => ...) - instance of HTTP server.
  • server.listen(8000) - run and listen on port.
  • res.writeHead(statusCode[, statusMessage][, headers])
  • res.write(chunk) - sends a chunk of the response body.
  • res.end([data]) - signals that response headers and body have been sent

Lesson 20 - App Web and routing

  • Some headers: Host; content-type; content-length;
  • Internet Media Types e.g. text/xhtml, image/png, application/json, etc (RFC2046)
  • HTTP status codes
  • Inconsistent responses:
    • Uncomplete HTTP response
    • Absence of content-type
  • Vinyl web app
  • Implement routes-vinyl
  • Handling errors and distinguishing between errors on server or client side
  • Parsing route parameters and query string
  • Modules url and querystring

Lesson 21 - App Web and Integration Tests

  • Solving the TPC8
  • Highlight the difference between changing the Resource versus its Representation
  • Distinguish between Unit and Integration tests.
  • Mention different alternatives and approaches for integration tests of a web API.
  • E.g. Postman, frisby js
  • Validate responses status codes and JSON content.
  • expect(handler, [...args])
  • handler: status, header and json
  • Ensure that Web API server is running before starting tests.
  • beforeAll(() => server = fork('./index', ... )

Lesson 22 - Express

  • Routing : app.METHOD(PATH, HANDLER)
    • app is an instance of express.
    • METHOD is an HTTP request method, in lowercase.
    • PATH is a path on the server.
    • HANDLER is the function executed when the route is matched.
  • HANDLER - handling middleware function - function(req, resp, next)
  • app.use(PATH, HANDLER) - for any method.
  • app.use(HANDLER) - for any method and any path.
  • route parameters - /path/:param1/
  • req.params - route parameters specified in path
  • req.query - query string parameters
  • resp.send() -- includes call to end() and content-type as HTML
  • resp.json() -- serializes (JSON.stringify) to JSON and content-type as JSON.
  • Error Handler -- added at the end of the pipeline by default.
  • Error Handler custom - function(err, req, resp, next)
  • Composing pipelines through express.Router:
    • A router object is an isolated instance of middleware and routes. You can think of it as a “mini-application,” capable only of performing middleware and routing functions. Every Express application has a built-in app router.

Lesson 23 - Lab 8 - Implementing Vinyl web app and integration tests

  • POST passing parameters in HTTP body rather than in query-string
  • Using express body-parser middleware
  • app.use(bodyParser.json()) for application/json
  • app.use(bodyParser.multipart({ extended: false })) for application/x-www-form-urlencoded
Clone this wiki locally