OMM Flashcards
What are some features of javascript
- Functional programming -> Immutablility, like evaluation of functions
- Dynamic typing (No static types)
- First-class functions -> Function is a like variable (e.g. callbacks)
- Huge ecosystem
How can you debug java script applications
- Browser console
- Page inspector
What is the difference in defining functions with keyword and with arrow functions
- () => {} - Can’t be bind to names - Anonymous
- function bla(): Bind to a name
When are fat arrow function used
E.g. callbacks
How does object destructuring works?
- let {foo, bar, baz}= obj; -> same like var foo = obj.foo
- Spread operator … copies other keys of the object into new object with name: let{foo, …rest} = obj; rest.bar == obj.bar;
What are standard prototype array functions?
- Map: Change every element
- Reduce: Aggregate, Accumulate
- Foreach: Iterate
- Filter: Filter
- Find: Returns object -> Array
- FindFirst: Just first ones -> First
Shorten the following code: var array = new array(3)
let arr = [2,3,4];
Shorten following code: if foo: return bar; else: return null
return foo ? bar : null
What is a promise?
- Wrapper for async code
- Promise that a response arrives at some time
- If completes: Resolved / fulfilled
- If fails: Rejected
- Can be chained with .then or .catch
What are the keywords async & await?
- Making functions async wraps the function into a promise
- Await waits for a promise and pauses it at the position till the promise resolves
Describe the difference between let and var and const
- Let is mutable and can be reassigned
- Var is old method for every variable
- Const value is mutable but not the assignment
What is the result of
[ 1, 2, 3, 4 ].map((a) => a * a).reduce((a, b) => a + b)
- [1, 4, 9, 16].reduce((a, b) => a + b)
- 30
Why will this fail:
function () {
const value = await fetch('http://httpbin.org/get');
.then((res) => res.json());
return value;
}no async on function delcaration
What are main components of a HTTP request?
- request line: get / put
- header: content-type, accept-type
- body: body
- response: status, header, body
What are some common http codes
- 1xx Informational
- 2xx Success
- 3xx Redirect
- 4xx Client error
- 5xx Server error
What are common http methods
- GET
- POST
- PUT
- DELETE
For what stands AJAX?
Asynchronous JavaScript and XML
What are the advantages of using JSON?
- No fixed schema
- Human readable
- Easily convertible to JS
- More dynamic
What are the advantages of using XML?
- Fixed schema
- Namespace
What is the XMLHTTPRequest?
- API to transfer data between client, server
- Not used anymore
What does fetch in JS?
- Simplifying ajax requests
- Use promises for resolving
What are differences between XHR and fetch
- XHR
- Event-callback based
- Create object
- Open URL
- Attach readystatechange
- Send
- Fetch
- Promise based
- Inside javascript function
How are Web APIs often secured?
- Rate limits - requests per user
- Scope of each user
- Access token
What is the difference between authorization vs authentication
- Authentication: Who am I?
- Authorization: What am I allowed to do?
What are different ways to ensure authentication?
- Basic authentication: Username + Password
- pro: quick and easy
- con: Security issue
- Personal access token
- Pro: Security improvement
- OAuth Token
- Pro: Security (lifespan, exchanged regularly)
- Con: More complicated to implement
What is Same Origin Policy?
- Tried to hamper cross site scripting
- Blocks ajax requests from other origins as defined in allowed origins
What does asynchronous actually mean?
That it doesn’t block the whole program
What is the difference between get and post?
- Post alters something, e.g. create user
- Get just gets information, e.g. get user list
How do you avoid SOP(Same Origin Policy) issues?
- Define cross origins
- JSON with padding
- Reverse proxies
Why do we need an eventloop?
- Because javascript is single threaded
- But somehow we need to execute code “at the same time”
- E.g. callbacks, promises, etc.
What are the different event loops?
- Main loop: Executes sequential code
- Message loop: Waites for enqueued messages
- Rendering: Calculates stylesheet, results layout, paints webpage
What types are in javascript?
- undefined
- number
- string
- boolean
- Object
- symbol
- any
How can we check types?
- Typeof
- Instanceof
What is typescript?
- Superset of javascript
- JS with type annotations
Benefits of Typescript
- More concise / accurate code
- More developer control
- Static checking
Why does it make sense to keep JS single threaded?
- Because browser is single threaded as well
- Don’t consume too much resources of user
How does JS convert from int to float?
Point after the number
Explain the difference between imperative and declarative?
- Imperative: Specify how to do something
- Declarative: Specify what should be done
Explain the MVC model
- Model: Data structure / model
- View: Everything user sees
- Controller: How things work / Behaviour
What is the goal of web components?
Having re-usable code
What are the main concepts of web components?
- Custom Elements
- HTML Import
- Templates
- Shadow DOM
What are advantages of web components?
- More declarative
- More readable
- Separation of concerns
- Re-Usable
- Encapsulation
What is a polyfill?
Polyfill is a script which implements a workaround for things which are not implemented
What does the shadow DOM?
- Includes DOM Elements into rendering but not in main document
- Hides implementation details -> Encapsulatin
Which of these are imperative and which are declarative?
- HTML: Declarative
- JavaScript: Both
- Java: Imperative
- SQL: Declarative
- Typescript: Both
What is a polyfill for?
Workaround for functions which are not implemented in the browser
What is a polyfill for?
Workaround for functions which are not implemented in the browser
What is React.js?
Javscript framework for building web applications
What is JSX for?
Using HTML tags inside of javascript functions / classes
What is reconcillation in React?
- Compares differences
- Just calculates differences and updates
What is conditional rendering?
Check condition and return different things based on how the condition evaluates
What are the two phases within react?
- Render phase: Computation of differences
- Commit phase: Commit to Dom -> Lifecycle functions execution
What are React Hooks?
Helper function to use state or side effects in functional components
What are functional components?
Components declared with only using a function, not class and therefore no bindings possible
Which argument do you need in create react app for using typescript?
--typescript
What is the underlying function in JSX/TSX sytanxt create an HTML tag in a component?
React.createElement()
What function do you need to render a component in ReactDOM?
ReactDOM.render()
How to change states in a React component. Name two approaches?
- Hooks, use setter method from useState hook
- Class components: this.setState({…this.state, firstname:firstname})
What is the reconiliation in React? Explain in one sentence.
Phase to compute diff of changes in DOM for next render phase
What are the two phases in React Fiber?
- Render Phase: Renders all components
- Commit phase: Commits all differnces and updates DOM
What is the naming convention to handle events in React?
Camel case
What is the attribute to evoke a button click event?
onClick
Why do we need props? Explain in one sentence
pass/inject attributes to child components
What is nodejs?
- Backend server based on javascript
- Built on chromes runtime environment v8
What are advantages of node?
- non-blocking I/O
- scalability
- web-apps can act as standalone web server
- large ecosystem of open source libraries
How do you import local and how do you import installed modules?
require('express')
- require('./local_express')
What is express?
NodeJS web-application framework
What are characteristics of express?
- minimalistic
- easy-to-use api
- template engine
- many middleware function
What is middleware?
- Function that sits between request and responses
- E.g. parsing into json, logging
What is express static?
Static files like HTML, images in static folder
Where does nodejs run client or server?
- Can be both
- Server for serving html files for example
- Client for getting data from external apis for example
How do you generate a package script
npm init
How do you save a module?
npm -s or yarn add
What does the body-parser middleware do?
Parses the body from incoming HTTP requeste
Is every route a middleware too
yes
Is every route a middleware too
yes
Describe authorization and authentication
- Authentication: Who am I
- Authorization: What am I allowed to do?
Are the following error message authentication or authorization?
- Permission to URL denied to User FF
- Comments are disabled for this video:
- This site is marked as private by its owner
- Sorry this action requires to be logged in
- Permission to URL denied to User FF: Authorization
- Comments are disabled for this video: Nothing of both
- This site is marked as private by its owner: Authentication / Maybe both
- Sorry this action requires to be logged in: Authentication
What are different mechanisms for login
- Access tokens e.g. API key
- Cookies
- Third party like OAuth
- Basic Auth
What is the traditional Authentication way?
- Session tokens
- Basic Auth
What is the modern way of Authentication?
- JWT
- Encrypts user id, roles, etc into a token
- Client sends it on each request
Why do web applications need databases
- Persist data
- Structure, organize data
- Keep data after restart
Does Authentication usually come before authorization
- Yes login before checking of access rights
Proof who you are, before checking what you can do
What is the benefit of JWT over Session tokens?
- All information is included in JWT token
- No looking up with session table
- JWT expires
What is the canonical way of auth in node js?
Base Auth
Which parameters are common for a find / update monk query
identifier of object
Is Monk client or server
Client
What are some general constraints in rest
- HTTP communication protocol
- Client / Server architecture
- Data structure (json, xml)
- Stateless - Each request all info
- Cache - Responses must be cacheable
- Layered System - Server can be clients
What are CRUD methods?
- All methods which interact with data on the web
- Create
- Read
- Update
- Delete
What are HTTP methods
- GET
- POST
- PUT
- DELETE
- PATH
- OPTION
What is the difference of idempotent and safe
- Safe: Changes data
- Idempotent: If I repeat it x times is still the same happening (not return value / functionality)
Which methods are not idempotent?
- POST
- PATCH
Which methods are not safe?
- post
- delete
- patch
- put
What is so special about an idempotent endpoint?
You can expect the same behavior for every call
Which groups of http status codes?
- 1 - informal
- 2 - success
- 3 - redirect
- 4 - client error
- 5 - server error
What is the key abstraction for REST?
Standardized internet protocols like HTTP / URI
What are query parameters appropriate for?
- To give parameter to the API
- e.g. filter songs
- e.g. search songs
How do we get Media input?
- With HTML 5 possible without further plugins
- WebRTC
What is the method for getting video?
navigator.mediaDevices.getUserMedia(constraints).then(successCallback).catch(errorCallback)
What are web sockets?
- Messaging protocol based on TCP
- Lightweight
What is the basic idea of websockets
- TCP based
- Bidirectional
- Full-duplex
What a drawbacks of websockets?
- Poor browser support
- Complex handling
- Massive memory consumption
What are strategies for infrastructure updates?
- Blue / Green
- Both versions are deployed
- Switch traffic on new container
- Ramped
- Ramping up new version
Pros cons of each infrastructure update strategy
- Blue / Green
- Pro: Assets are available instantly
- Cons: Double infrastructure needed
- Ramped
- Pro: less infrastructure
- Con: Assets na
What did you learn from the rise and fall of Docker Inc?
- Think about the balance of building a successful product and make profits
- Think about the developer community
Where should container as a service be placed in? IaaS>PaaS>FaaS>SaaS
IaaS
Are microservices always better than monolithic?
- Think about building your personal website with microservices
- Introduce complexity and managment
When do you want to choose microservices architecture?
- On Problems which are already complex
- Domain which can be splitt into microservice
- problems where different technological solution are neccessary to reacht the goal
