Выбери свой путь: от HTML-вёрстки до Angular enterprise. Каждый курс — это живые проекты и код-ревью.
Семантическая вёрстка, Flexbox, Grid, адаптивный дизайн, анимации CSS и BEM методология.
ES6+, async/await, промисы, DOM, события, работа с API, паттерны проектирования.
Типизация, дженерики, декораторы, utility types, интеграция с React и Node.js.
Hooks, Context, Redux Toolkit, React Router, Next.js, тестирование с Vitest.
Composition API, Pinia, Vue Router, Nuxt 3, SSR/SSG, производительность.
RxJS, NgRx, Standalone Components, Signals, Angular Universal, архитектура.
1 import { useState } from 'react' 2 3 // Интерактивный счётчик 4 const Counter = () => { 5 const [count, setCount] = useState(0) 6 7 return ( 8 <div className="counter"> 9 <h2>Счёт: {count}</h2> 10 <button onClick={() => 11 setCount(c => c + 1)}> 12 + 13 </button> 14 </div> 15 ) 16 }
1 <script setup> 2 import { ref, computed } from 'vue' 3 4 const count = ref(0) 5 const doubled = computed(() 6 => count.value * 2) 7 8 const inc = () => 9 count.value++ 10 </script> 11 12 <template> 13 <p>{{ count }} × 2 = {{ doubled }}</p> 14 <button @click="inc">+</button> 15 </template>
1 // Строгая типизация 2 interface User { 3 id: number 4 name: string 5 role: 'admin' | 'student' 6 } 7 8 type ApiResponse<T> = { 9 data: T 10 status: 'ok' | 'error' 11 } 12 13 async function fetchUser( 14 id: number 15 ): Promise<ApiResponse<User>> { 16 const res = await fetch(`/api/users/${id}`) 17 return res.json() 18 }
1 import { Component, signal } 2 from '@angular/core' 3 4 @Component({ 5 selector: 'app-counter', 6 standalone: true, 7 template: ` 8 <p>{{ count() }}</p> 9 <button (click)="inc()">+</button> 10 ` 11 }) 12 export class CounterComponent { 13 count = signal(0) 14 inc() { 15 this.count.update(v => v+1) 16 } 17 }
Кнопки изменяют реактивное состояние
Выбери цвет — интерфейс обновится