shershen08

Course title: Frontend and API Performance

Course covering on all technologies for modern web development with focus on performance.

Author: Mikhail Kuznetcov

Lessons:

1. Introduction to web performance

• Course intro | CRP | Web vitals | Tools

shershen08

/**************
Lecture 1
/**************/

/**************
Lecture 2
/**************/

/**************
Lecture 3

shershen08

#!/bin/sh
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")

case `uname` in
    *CYGWIN*) basedir=`cygpath -w "$basedir"`;;
esac

if [ -z "$NODE_PATH" ]; then
  export NODE_PATH="<some_path>common/cli/node_modules:<some_path>common/node_modules:<some_path>node_modules:<some_path>/node_modules:<some_path>node_modules:/Users/node_modules:/node_modules:<some_path>Library/pnpm/global/5/.pnpm/node_modules"
else

shershen08

• Random Aerial Airport Views - https://randomairport.onrender.com/
• LOCATION FINDER: Discover the optimal location to meet with your remote team - https://www.surfoffice.com/location-finder

shershen08

Vuex (~Redux), 2017
-----
- общее дерево стейта
Actions
Mutations

Actions -> Mutations

Component -> Mutations

shershen08

## Варианты:
 - повторить известное приложение или из предложенного списка (например игру или IG или что то еще)     -  UI/UX
 - задачи из рабочего проекта (часть страниц сущ приложения / новое приложение) -  ..
 - pet-project (Saas, geo-chat)                                                 -  UI/UX
 - новая технология (gRPC, websockets, ...)                                     -  ...


##Этапы:
 - введение

shershen08

// fetch('https://jsonplaceholder.typicode.com/posts/1')
//   .then(response => response.json())
//   .then(json => console.log(json))


// fetch('https://jsonplaceholder.typicode.com/todos/1')

// fetch('https://jsonplaceholder.typicode.com/todos/1', {
//   headers: {},
//   method: 'POST',

shershen08

Создать Vue приложение с даннýми
links: [/* any url */]
● Сделатþ компонент my-link, которýй полуùает
свойство url и вýводит ÿлемент
<a href="...">...</a>
● Напиúите в ùат / приúлите ссýлку

https://codesandbox.io/s/nifty-dream-22vqf3?file=/src/App.vue

shershen08

Form generator plugin to use for Vue projects

This one - had too few users and the last update 5 months ago If any bugs we’re on our own https://github.com/zhorton34/vuejs-form#readme

Same for this one + Some formio server is mentioned but might be complex to implement and support https://github.com/formio/vue#readme

shershen08

const add = (a,b) => a + b

const result = add(2, 2)

console.log(add(2, 2))
console.log(result)



// Number