Appearance
Примеры технологий и применение
Фронтенд:
HTML
: Язык разметки для структуры страницы.CSS
: Язык стилей для оформления страницы.JavaScript
: Язык программирования для интерактивности и управления DOM.JavaScript-фреймворки
:React:
Фреймворк, основанный на компонентах. Популярен благодаря своей гибкости и производительности.Angular:
Комплексный фреймворк, разработанный Google. Предлагает строгую структуру и много встроенных функций.Vue.js:
Прогрессивный фреймворк, легкий в изучении и использовании. Хорошо подходит для небольших и средних проектов.Svelte:
Компилятор, преобразующий код в чистый JavaScript во время сборки, что приводит к высокой производительности.
TypeScript:
Надстройка над JavaScript, добавляющая статическую типизацию. Помогает предотвратить ошибки и улучшает читаемость кода.CSS препроцессоры:
Sass:
Добавляет переменные, миксины и другие функции в CSS.Less:
Аналогичен Sass.Stylus:
Еще один CSS препроцессор.
Библиотеки компонентов:
Material UI (React):
Библиотека компонентов, основанная на Material Design.Ant Design (React):
Библиотека компонентов, популярная в Китае.Vuetify (Vue.js):
Библиотека компонентов, основанная на Material Design.Bootstrap:
Популярный CSS-фреймворк для создания адаптивных макетов.
Бэкенд:
Python:
Django:
Высокоуровневый веб-фреймворк, предоставляет ORM, шаблонизатор и другие инструменты для быстрой разработки веб-приложений.Flask:
Микрофреймворк, более гибкий и минималистичный, чем Django. Подходит для небольших и средних проектов.FastAPI:
Современный, высокопроизводительный веб-фреймворк, основанный на ASGI.
Node.js (JavaScript):
Express.js:
Минималистичный веб-фреймворк.NestJS:
Фреймворк для создания масштабируемых серверных приложений, использующий TypeScript и архитектуру, вдохновленную Angular.
PHP:
Laravel:
Популярный PHP-фреймворк с элегантным синтаксисом.Symfony:
Мощный PHP-фреймворк, используемый во многих крупных проектах.
Java:
Spring Framework:
Комплексный фреймворк для разработки Java-приложений.
Базы данных:
Relational (SQL):
MySQL:
Популярная реляционная база данных.PostgreSQL:
Более продвинутая реляционная база данных.SQL Server:
Реляционная база данных от Microsoft.
NoSQL:
MongoDB:
Документоориентированная база данных.Redis:
In-memory key-value store.Cassandra:
Распределенная база данных.
Веб-серверы:
Nginx:
Высокопроизводительный веб-сервер и обратный прокси.Apache:
Популярный веб-сервер.
Взаимодействие фронтенда и бэкенда
Связующие технологии для взаимодействия фронтенда и бэкенда:
REST API
- Фронтенд отправляет HTTP-запросы на сервер (GET, POST, PUT, DELETE).
- Бэкенд возвращает данные в формате JSON или XML.
- Пример:
- Клиент отправляет запрос
GET /api/products
. - Бэкенд возвращает список товаров в JSON.
- Клиент отправляет запрос
GraphQL
- Альтернативный способ взаимодействия. Клиент запрашивает только те данные, которые ему нужны.
- Бэкенд предоставляет единый эндпоинт, через который можно гибко формировать запросы.
WebSocket
- Для реализации двустороннего взаимодействия (например, чаты, онлайн-игры).
- Фронт и бэк поддерживают постоянное соединение, чтобы мгновенно обмениваться данными.
Serverless
- Логика бэкенда вынесена в "функции" (например, AWS Lambda), которые вызываются только при запросе.
- Фронтенд обращается к этим функциям через API.
Middleware
- Иногда между фронтендом и бэкендом добавляется промежуточный слой (например, для кеширования, авторизации или обработки данных).