Презентация тык.

Ссылки на материаллы по React и Vue.

Vue:

• Интерактивный туториал по Vue.

• Документация Vue.

React:

• Документация React.

• Guide React(eng video)

• Русский гайд - старенький, но хороший

Бандлеры

Бандлер — это инструмент, который объединяет (собирает) все ваши JS, CSS, изображения и другие ресурсы в один или несколько оптимизированных файлов для загрузки на веб-странице.

Основные понятия бандлера:

• Entry (точка входа) — откуда начинается сборка.

• Output (выход) — куда сохраняется итоговый файл.

• Loaders — преобразуют различные типы файлов.

• Plugins — расширяют функциональность (минификация, оптимизация, генерация HTML).

Помимо этого бандлеры преобразуют ts в js.

enum Role {
  Admin,
  User,
  Guest,
}
interface Person {
  name: string;
  age: number;
  role: Role;
}

function isAdmin(person: Person): person is Person {
  return person.role === Role.Admin;
}

function greet(person: Person): string {
  if (isAdmin(person)) {
    return `Hello Admin ${person.name}`;
  } else {
    return `Hello ${person.name}`;
  }
}
const user: Person = {
  name: "Alice",
  age: 30,
  role: Role.Admin,
};

В такой JS:

var Role;
(function (Role) {
  Role[(Role["Admin"] = 0)] = "Admin";
  Role[(Role["User"] = 1)] = "User";
  Role[(Role["Guest"] = 2)] = "Guest";
})(Role || (Role = 0));

function isAdmin(person) {
  return person.role === Role.Admin;
}

function greet(person) {
  if (isAdmin(person)) {
    return "Hello Admin" + person.name;
  } else {
    return "Hello" + person.name;
  }
}
var user = {
  name: "Alice",
  age: 30,
  role: Role.Admin,
};