Результаты поиска по запросу: html
Technical skills марафон
Автор: Редакция ITVDN
Подтверди свои навыки и выиграй подписку ITVDN на 3 месяца!
C 10 до 20 ноября 2017 года на ITVDN проходит большой марафон среди начинающих программистов.
Задача участников марафона - успешно (на 100%) и с максимальными баллами выполнить все задания практикума по одной или нескольким технологиям - JavaScript, SQL, C# или HTML. Победителей и призов будет много!
Условия акции:
В период с 10 по 20 ноября 2017 года проверь свои знания, выполнив все задания на Тренажере ITVDN по одной или нескольким технологиям. Чем больше технологий ты знаешь, тем больше призов можешь выиграть.
Соревнование проводится в 5 номинациях:
JavaScript
SQL
HTML, CSS
C# Starter
С# Essential
Призы победителям
В каждой номинации будет разыграна 1 подписка ITVDN на 3 месяца и 5 подписок на месяц.
В пакете подписки полный доступ ко всем видео курсам, представленным в Каталоге ITVDN.
В розыгрыше примут участие те, кто выполнит все задания соответствующего практикума на 100%.
Супер-приз - фирменная футболка и брендированная дженга ITVDN – достанется тому, кто за время акции пройдет все практикумы с максимальными баллами.
Определение и награждение победителей
Победители будут определены с помощью сервиса random.org. Трансляцию розыгрыша смотрите в прямом эфире на нашем YouTube канале 21 ноября в 17:00.
Итоги акции будут опубликованы на нашем сайте 21 ноября 2017 года после 18:00.
Изучай ASP.NET MVC бесплатно!
Автор: Ирина Музыка
Подарок от ITVDN – видео курс ASP.NET MVC Fundamentals с 12 по 19 января 2017 года доступен бесплатно для всех зарегистрированных пользователей ITVDN.
ASP.NET MVC – это технология Microsoft, предназначенная для разработки современных веб приложений.
Курс ASP.NET MVC Fundamentals рассчитан на С#/.NET и web-разработчиков, у которых есть базовые знания по C#, HTML, CSS и JavaScript. Знание ASP.NET существенно ускорит изучение ASP.NET MVC.
Курс записан Дмитрием Охрименко - Сертифицированным тренером и разработчиком Microsoft, лучшим профессионалом года в номинации IT Education (Ukrainian IT Awards 2015). Курс состоит из 10 уроков.
Темы, которые изучаются в курсе:
Введение в ASP.NET MVC
Маршрутизация и области
Представления и компоновки
Контроллеры и действия
Вспомогательные методы и HTML формы
Модель
Привязка модели и валидация
Фильтры и авторизация
AJAX
Поиск и устранение уязвимостей
Для наилучшего результата используйте все возможности нашего ресурса:
Смотрите видео уроки.
Скачайте учебные материалы и работайте с практическими примерами урока.
Выполняйте все задания к каждому уроку.
Проверяйте, как усвоен материал, проходя тестирование после каждого урока.
Для получения электронного сертификата, пройдите тестирование по всему курсу.
Перейти к видео курсу ASP.NET MVC Fundamentals
Для получения полного бесплатного доступа к курсу Вы должны быть зарегистрированным пользователем ITVDN.
Новый видео курс — HTML5 & CSS3 Стартовый
Автор: Редакция ITVDN
Здравствуйте!
На ITVDN опубликован новый видео курс — “HTML5 & CSS3 Стартовый”! Из-за войны, которую рф развязала против Украины, в феврале работа над новыми уроками была приостановлена, но сейчас мы возобновляем все бизнес процессы и новый курс уже доступен в полном объеме. Он содержит фундаментальные знания языков вёрстки HTML5 & CSS3 и поможет ввести новичков в мир верстания веб-сайтов и разработки клиентской стороны веб-приложений (FrontEnd).
В основе работы любого веб-сайта находится демонстрация текста, изображений и другого контента в окне специальной программы – веб-браузера. С помощью языка HTML создается начальная разметка (каркас) каждой интернет-страницы. Затем использование CSS преображает сайт, настраивая способ отображения элементов и придавая ему привлекательный, эффектный внешний вид. Изучение этих языков является основой для обучения любого верстальщика и веб-разработчика.
На курсе «HTML5 & CSS3 Стартовый» вы познакомитесь с основными конструкциями и принципами использования этих базовых языков работы веб-сайтов. Вы познакомитесь с тем, что такое HTML-тэги и как их использовать, с особенностью того, как устроена структура любого сайта, что такое блоки, как формируется текст и отображаются картинки. Узнаете, как работать с таблицами и списками, их правила вложенности, узнаете правила размещения блоков и способы работы с путями для файлов.
Автор курса — Виталий Мазяр, FrontEnd Developer, тренер–консультант CyberBionic Systematics, сертифицированный специалист Microsoft, автор видео курсов на ITVDN. В записанных видео уроках он делится техниками эффективного использования HTML5 & CSS3, опираясь на собственный опыт и лучшие практики.
Структура курса:
Введение в HTML.
Типы элементов и атрибуты.
Введение в CSS.
Определение размеров блоков.
Работа с отступами, свойство margin.
Работа с текстом и видимостью элементов.
Верстка с использованием Flexbox.
Комбинирование селекторов.
Работа с фоном, свойство background.
Семантическая вёрстка.
Чему вы научитесь на данном курсе:
Понимать основы использования базовых конструкций языка разметки HTML и языка стилей CSS.
Создавать простые одностраничные сайты.
Реализовывать главное меню сайта.
Понимать основы адаптивной и кроссбраузерной разработки сайтов.
Создавать блок социальных сетей.
Создавать карточки товара и подобные им информационные блоки.
Реализовывать верстку сайта с использованием модуля Flexbox.
Предварительные требования
Данный курс подходит для новичков, которые ни разу не программировали. Для старта обучения потребуется компьютер/ноутбук и стабильный доступ к интернету.
Смотрите первый урок в свободном доступе. Если у вас есть активная подписка, курс доступен для вас в полном объеме.
CoffeeScript
Автор: Владимир Виноградов
CoffeeScript - это язык программирования, который транслируется в JavaScript. CoffeeScript добавляет синтаксический сахар похожим образом с Ruby, Python и Haskell для того, чтобы улучшить чтение кода и уменьшить его размер. В среднем, для выполнения одинаковых действий на CoffeeScript нужно в 2 раза меньше строк, чем для JavaScript. Целевой аудиторией курса являются верстальщики и web-разработчики. Для успешного прохождения нужны знания языка разметки страниц HTML и CSS, и владение базовым уровнем JavaScript. Пройдя курс, Вы сможете уверенно понимать код CoffeeScript, освоите написания модулей на CoffeeScript и компиляцию в JavaScript код.
Свойство CSS3 box-shadow
Автор: Валерия Прокопенко
Введение
С приходом CSS3 в мир веб-разработки множества модных новинок, отображать потрясающий анимационный эффект стало доступным с помощью нескольких строчек кода. Сегодня мы рассмотрим одно из свойств CSS3 box-shadow и с его помощью научимся создавать такой элемент управления, как кнопка. Особенностью такого подхода является то, что компоненты на странице выглядят объемными и привлекательными, чем обращают на себя внимание пользователя.
Для начала создадим 3 слоя, которые и будут выступать в роли наших кнопок и опишем для них стили:
<!DOCTYPE html>
<html>
<head>
<title>Box-Shadowtitle>
<style type="text/css">
body {
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
}
.button {
width: 80px;
height: 80px;
margin: 30px;
display: inline-block;
cursor: pointer;
background: green;
}
.left {
border-radius: 50%;
}
.center {
border-radius: 20%;
}
.right {
border-radius: 50%;
}
style>
head>
<body>
<div class="button left">div>
<div class="button center">div>
<div class="button right">div>
body>
html>
В результате получим три зеленые кнопочки на фоне, который мы применили к телу нашего документа.
Теперь можно начать работу с box-shadow, но для начала познакомимся с его возможностями. Итак, данное свойство добавляет тень к нужному элементу, причем указав его параметры через запятую, можно применить несколько теней к одному компоненту и при их наложении первая в списке будет выше, а вторая ниже. Значение inset выводит тень внутрь элемента, но этот параметр не является обязательным.
Вооружившись знаниями о данном свойстве, можно приступить к созданию наших кнопок. Для начала изменим фон элементов на такой же, как у тела нашего документа. Теперь указываем параметры для box-shadow: первый отвечает за смешение по горизонтали, второй – по вертикали, третий - за радиус размытия, четвертый определяет цвет. Также используем значение inset, с помощью которого делаем внутреннюю верхнюю тень белой, а внутреннюю нижнюю - черной, при этом устанавливаем для них прозрачность, чтобы они не выглядели грубо.
<!DOCTYPE html>
<html>
<head>
<title>Box-Shadowtitle>
<style type="text/css">
body {
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
}
.button {
display: inline-block;
cursor: pointer;
margin: 30px;
width: 80px;
height: 80px;
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
box-shadow: 0 4px 22px rgba(0,0,0, 0.25), inset 0 3px 0 rgba(255,255,255, 0.5), 0 3px 0 rgba(0,0,0, 0.1), inset 0 0 22px rgba(0,0,0, 0.1);
}
.left {
border-radius: 50%;
}
.center {
border-radius: 20%;
}
.right {
border-radius: 50%;
}
style>
head>
<body>
<div class="button left">div>
<div class="button center">div>
<div class="button right">div>
body>
html>
В результате мы получили объемные формы, теперь сымитируем эффект нажатия при наведении на кнопку, для этого используем псевдокласс :hover и в нем опишем внутренние тени элементов, причем верхняя должна быть черной, а нижняя – белой, и не забываем установить прозрачность для данных элементов.
<!DOCTYPE html>
<html>
<head>
<title>Box-Shadowtitle>
<style type="text/css">
body {
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
}
.button {
display: inline-block;
cursor: pointer;
margin: 30px;
width: 80px;
height: 80px;
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
box-shadow: 0 4px 22px rgba(0,0,0, 0.25), inset 0 3px 0 rgba(255,255,255, 0.5), 0 3px 0 rgba(0,0,0, 0.1), inset 0 0 22px rgba(0,0,0, 0.1);
}
.left {
border-radius: 50%;
}
.center {
border-radius: 20%;
}
.right {
border-radius: 50%;
}
.button:hover {
box-shadow: inset 0 0 22px rgba(0,0,0,0.2), 0 3px 0 rgba(255,255,255,0.4),inset 0 3px 0 rgba(0,0,0,0.1), inset 0 0 22px rgba(0,0,0,0.1);
}
style>
head>
<body>
<div class="button left">div>
<div class="button center">div>
<div class="button right">div>
body>
html>
Следующее, что мы сделаем – это добавим иконки для наших кнопок, для этого мы используем псевдокласс :after и, чтобы усилить эффект вдавленности элемента при наведении, мы будем смещать картинки на 3% от начально положения.
<!DOCTYPE html>
<html>
<head>
<title>Box-Shadowtitle>
<style type="text/css">
body {
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
}
.button {
display: inline-block;
cursor: pointer;
margin: 30px;
width: 80px;
height: 80px;
background: url(http://palma-ceramic.ru/images/newcatalog/1945.jpg);
box-shadow: 0 4px 22px rgba(0,0,0, 0.25), inset 0 3px 0 rgba(255,255,255, 0.5), 0 3px 0 rgba(0,0,0, 0.1), inset 0 0 22px rgba(0,0,0, 0.1);
-moz-box-shadow: 0 4px 22px rgba(0,0,0, 0.25), inset 0 3px 0 rgba(255,255,255, 0.5), 0 3px 0 rgba(0,0,0, 0.1), inset 0 0 22px rgba(0,0,0, 0.1);
-webkit-box-shadow: 0 4px 22px rgba(0,0,0, 0.25), inset 0 3px 0 rgba(255,255,255, 0.5), 0 3px 0 rgba(0,0,0, 0.1), inset 0 0 22px rgba(0,0,0, 0.1);
}
.left {
border-radius: 50%;
}
.center {
border-radius: 20%;
}
.right {
border-radius: 50%;
}
.button:hover {
box-shadow: inset 0 0 22px rgba(0,0,0,0.2), 0 3px 0 rgba(255,255,255,0.4),inset 0 3px 0 rgba(0,0,0,0.1), inset 0 0 22px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0 0 22px rgba(0,0,0,0.2), 0 3px 0 rgba(255,255,255,0.4),inset 0 3px 0 rgba(0,0,0,0.1), inset 0 0 22px rgba(0,0,0,0.1);
-webkit-box-shadow: inset 0 0 22px rgba(0,0,0,0.2), 0 3px 0 rgba(255,255,255,0.4),inset 0 3px 0 rgba(0,0,0,0.1), inset 0 0 22px rgba(0,0,0,0.1);
}
.button::after {
content: '';
width: 80px;
height: 80px;
display: block;
opacity: 0.7;
}
.left::after {
background: url(http://www.defaulticon.com/sites/default/files/styles/icon-front-page-32x32-preview/public/field/image/MD-previous.png?itok=Myj2aYPA);
background-repeat: no-repeat;
background-position: 50%;
}
.center::after {
background: url(http://www.defaulticon.com/sites/default/files/styles/icon-front-page-32x32-preview/public/field/image/MD-play.png?itok=iQrN1tL3);
background-repeat: no-repeat;
background-position: 50%;
}
.right::after {
background: url(http://www.defaulticon.com/sites/default/files/styles/icon-front-page-32x32-preview/public/field/image/MD-next.png?itok=LBqF9Nod);
background-repeat: no-repeat;
background-position: 50%;
}
.button:hover::after {
background-position: center 53%;
}
style>
head>
<body>
<div class="button left">div>
<div class="button center">div>
<div class="button right">div>
body>
html>
Как видим, CSS3 делает жизнь разработчика намного проще, предоставляя множество интересных и простых в использовании плюшек.
Основы AngularJS на практике
Автор: Редакция ITVDN
Введение
AngularJS – фреймворк-библиотека Javascript, разработанная для создания одностраничных приложений на основе MVC (Model-View-Controller) шаблона.
Будем осваивать данную технологию на практике.
Создадим HTML страничку со стандартной структурой. Далее нам нужно преобразовать ее в одностраничное приложение. Для этого подключим AngularJS к своей странице, добавив в
тег с данным кодом:
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">
script>
Следующим шагом мы явно укажем на то, что наша страница является AngularJS приложением. Нужно добавить ng-app директиву, которой мы обозначим корневой элемент приложения. Зачастую таким элементом выступает тег или же тег . Добавим эту директиву к :
<!DOCTYPE html>
<html ng-app="">
<head>
<title>title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">
script>
head>
<body>
body>
html>
Проверим, все ли работает, добавив небольшое выражение для подсчета произведения чисел 123 и 45. В AngularJs все выражения записываются в двойных скобках. Добавим в параграф со следующим содержимым:
<p>Результат произведение чисел 123 и 45 равен : {{ 123 * 45 }}p>
Запустим в браузере:
Теперь у нас есть готовый шаблон приложения, который мы будем использовать во всех последующих примерах.
AngularJS позволяет разработчику легко взаимодействовать с пользовательским вводом. Для этого есть соответствующая директива ng-model, которая связывает значения HTML элементов контроля (teaxtarea, input etc.) с приложением. Использовать эти данные поможет директива ng-bind, добавив эти данные во View (элемент MVC) и отобразив их на странице.
Применим полученные знания на практике. В созданный ранее шаблон добавим поле для ввода <input> с директивой ng-model и параграф для вывода данных c директивой ng-bind.
Код странички:
<!DOCTYPE html>
<html ng-app="">
<head>
<title>title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">
script>
head>
<body>
<p>Ввведте свое имя:p>
<input type="text" ng-model="yourName">
<p>Здравствуй, <span ng-bind="yourName">span>p>
body>
html>
Откроем в браузере:
Теперь попробуйте ввести свое имя в поле для ввода.
Давайте добавим в данный пример дефолтное значение имени, к примеру Анна. Сделаем это, конечно же, с помощью директивы ng-init, которая позволяет инициализировать любую переменную AngularJS приложения.
В строку добавим директиву ng-init.
<input type="text" ng-model="yourName" ng-init="yourName='Aнна'">
Посмотрим изменения в браузере:
Теперь мы имеем значение по дефолту – Анна, но все так же можем изменять его:
Вывод данных в этом примере можно сделать еще одним способом, а именно, использовав выражение. Заменим на {{yourName}}.
<p>Здравствуй, {{ yourName }}p>
Открыв страницу, мы не увидим абсолютно никаких изменений, а все потому, что выражения в AngularJS связывают данные со страничкой точно так же, как и ng-bind директива.
Как упоминалось в статье ранее, AngularJS строит приложения на основе MVC. Часть модель – представление (Model - View) определяется с помощью директивы ng-app. Контроллер в свою очередь определяется директивой ng-controller.
Рассмотрим пример с использованием контроллера страницы.
Создадим страничку со списком гостей, которых Вы пригласите на свой день рождения.
К созданному ранее шаблону добавим контроллер, а так же установим имя для приложения. В тег внесем следующие изменения:
<html ng-app="firstApp" ng-controller="firstController">
Далее добавим с типом text для введения имени гостя и еще один с типом submit для добавления гостя в список. Также добавим
с полем для вывода списка и чекбоксом с типом checkbox для того, чтобы можно было удалять тех, кто не придет на ваш праздник. В данный
добавим директиву ng-repeat, отвечающую за повторение данных в обозначенном контейнере.
<!DOCTYPE html>
<html>
<head>
<title>title>
<meta type="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">script>
head>
<body ng-app="firsApp" ng-controller="firstController">
<h2>Мои гости:h2>
<form ng-submit="addGuest()">
<input type="text" ng-model="guestsInput" size="50" placeholder="Введите имя гостя">
<input type="submit" value="Добавить гостя">
form>
br>
<div ng-repeat="guest in listOfGests">
<input type="checkbox" ng-model="guest.come"> <span ng-bind="guest.guestName">span>
div>
<p><button ng-click="remove()">Удалить гостя button>p>
body>
html>
Осталось добавить скрипт, который будет содержать функции для работы с элементами нашего приложения. Замечу, что все функции будут расположены в контроллере приложения.
Скопируйте и добавьте после закрывающегося тега параграфа с кнопкой
<p><button ng-click="remove()">Удалить гостя button>p>
следующий код:
<script>
var app = angular.module('firsApp', []);
app.controller('firstController', function($scope) {
$scope.listOfGests = [{guestName:'Я любимый', come:false}];
var countOfGuests = 1;
$scope.addGuest = function() {
$scope.listOfGests.push({guestName:$scope.guestsInput, come:false});
$scope.guestsInput = "";
countOfGuests++;
checkNumberOfGuests();
};
$scope.remove = function() {
var oldGuests = $scope.listOfGests;
$scope.listOfGests = [];
angular.forEach(oldGuests, function(guest) {
if (!guest.come) $scope.listOfGests.push(guest);
countOfGuests--;
});
checkNumberOfGuests()
};
function checkNumberOfGuests(){
if(countOfGuests <= 2){
alert("Маленькая вечеринка тоже не плохо! Не печалься! Лучших друзей не бывает много!");
}else if(countOfGuests >= 9){
alert("Праздник?! ВЕЧЕРИНИЩЕ!");
}else{
alert("Узкий круг самых близких, это всегда хорошо!");
}
} script>
В данном коде у нас есть три функции: добавление и удаление гостя и проверка количества гостей.
В функции добавления мы берем введенные данные guestsInput и добавляем их в лист listOfGests. Устанавливаем значение чекбокса в false (в нашем случае, это значит, что человек придет / если значение true, то есть галочка стоит - значит не придет), после чего очищаем поле ввода. Далее увеличиваем счетчик гостей и вызываем функцию проверки их количества.
В функции удаления мы берем список гостей listOfGests и проверяем значение чекбокса каждого гостя, определяя, кто придет, а кто нет. Удаляем тех, кто отмечен галочкой (не пойдет) и уменьшаем счетчик элементов.
Функция проверки количества гостей очень проста, поэтому подробнее мы ее разбирать не будем.
Давайте откроем пример в браузере и поработаем с ним:
Добавим несколько гостей:
С изменением количества гостей содержимое оповещений будет меняться.
Когда вы добавите больше 9 друзей, тогда увидите такое оповещение:
Поздравляем, вот Вы и создали свое первое одностраничное приложение с помощью AngularJS!
Новый видео курс — Верстка страниц с использованием Gulp
Автор: Редакция ITVDN
Дорогие друзья, на ITVDN опубликован новый видео курс, посвященный изучению Gulp — популярного таск-менеджера для автоматизации рутинных задач!
Gulp позволяет автоматизировать и ускорить выполнение множества рутинных задач разработки, с которыми каждый день приходится сталкиваться при создании веб-сайта (минификация, тестирование, объединение файлов и т. д.).
Данный курс поможет вам изучить возможности применения Gulp, начиная от основ использования и базовых правил, заканчивая рассмотрением более сложных структур. Проходя уроки, вы шаг за шагом познакомитесь со всеми возможностями Gulp API. Вы пройдете через весь процесс создания страницы: от создания репозитория для хранения проекта, через создание gulpfile.js для структуры проекта, подготовку макета сайта в Figma, обеспечение структуры страницы в html, добавление стилей к существующей странице и скриптов в проект, к итоговому результату – упаковке проекта и выполнения деплоя на сервисе Netlify.
По прохождению курса вы будете разбираться в основах работы тасков и их создании, а также узнаете возможности библиотек, которые работают с GulpJs. Если вы еще не знакомы с GulpJs, или хотите больше разобраться в работе тех или иных методов, данный курс поможет вам в этом.
Автор курса — Сластен Максим, FrontEnd Developer. В записанных видео уроках он делится техниками эффективного использования Gulp, опираясь на собственный опыт и лучшие практики.
Структура курса:
Установка Gulp. Настройка рабочего окружения.
Свойства и возможности Gulp.
Подготовка gulpfile.js.
Создание страницы.
Упаковка и деплой.
Чему вы научитесь на данном курсе:
Понимать и уметь применять особенности Gulp в полном цикле разработки лендинга.
Устанавливать Gulp, выполнять настройку рабочего окружения и создавать таски для проверки корректности установки и отсутствия ошибок.
Понимать особенности 4-й версии Gulp, ее отличия от 3-й версии, понимать разновидности Gulp файлов и особенности Gulp API.
Применять существующие Gulp-плагины, понимать особенности их подключения и настройки в тасках для разных задач. Использовать плагины для работы с HTML, с PUG, плагины для обработки JS и графики
Предварительные требования
Для понимания материала данного курса необходимы знания языков верстки HTML & CSS, а также базовое владение языком JavaScript..
Смотрите первый урок в свободном доступе. Если у вас есть активная подписка, курс доступен для вас в полном объеме.
JavaScript fwdays'20 (отменено)
Автор: Редакция ITVDN
Обязательно ли использовать JSX в работе с React? Как написать абстрактные классы компонентов в Vue.js? Как развернуть приложение на Angular? Знакомые вопросы?
Уверены, что волнующие вопросы возникают как у разработчика начинающего, так и в прокачанного senior.
А представь, целый день обсуждений твоих любимых стеков, кейсов, технологий в одном месте! Именно это ждет тебя на JavaScript fwdays'20 conf, 14 марта 2020 в Киеве.
Программа готова. Среди спикеров:
Sebastien Chopin (Nuxt.js) - автор Nuxt.js и член Vue.js комьюнити, работает с JavaScript последние 13 лет.
Martin Splitt (Google) - работает в компании Google над Search & web ecosystems на позиции Trends Analyst / Developer Advocate, контрибьютит в опенсорс и работает с новейшими технологиями.
Chen Hui Jing (Self-taught designer and developer) - дизайнер и разработчица-самоучка, проживающая в Сингапуре, с непомерной любовью к CSS.
Наталия Теплухина (GitLab) - Vue.js Core Team Member, работает Senior Frontend Engineer в компании GitLab. Спикерка на конференциях, пишет статьи на различные темы, связанные с Vue.js. Получила звание Google Developer Expert с веб-технологий.
Sara Vieira (CodeSandbox) - разработчица в @codesandbox, GraphQL и Open Source энтузиастка.
Юрий Артюх (Riverco.de) - основатель в Riverco.de frontend agency, длительное время был html / css coder, теперь страсть к анимации и WebGL.
Вадим Макеев (HTML Academy) - пепелсбей в HTML Academy, руководитель сообщества Веб-стандарты, ведущий и продюсер одноименного подкаста, организатор Web Standards Days.
Илля Климов (JavaScript.Ninja) - Senior Frontend Engineer y GitLab, более 12 лет с JavaScript во всех его проявлениях, основатель учебного ресурса JavaScript.Ninja.
Кроме этого, в кооперации с Zlit, придумали новый альтернативный комьюнити стейдж Code Block - о коде и разговоры.
Поэтому приглашаем активных разработчиков принять участие и поделится своими знаниями со всеми.
А на Afterparty сделаем еще несколько дискуссионных сессий на нетехничнеские темы с BeerJS.
Каждый найдет для себя интересную тему для обсуждения в компании единомышленников. Поэтому не медли и покупай билет на JavaScript fwdays'20 со скидкой 10% по промо коду 6994FAB910
Билеты: http://bit.ly/2q3oorg
Создание базового функционала блога на Symfony 4
Автор: Никита Шкарубо
<p>Symfony — один из самых популярных PHP фреймворков, который использует паттерн Model-View-Controller и используется для веб-разработке. Symfony дает возможность ускорить разработку и управление веб-приложениями, позволяет легко решать рутинные задачи веб-программиста. Имеет поддержку множества баз данных (MySQL, PostgreSQL, SQLite или любая другая PDO-совместимая СУБД). Во время вебинара мы создадим базовый функционал блога - создание записей и комментариев. У вас будет возможность добавлять, удалять и изменять записи и комментарии. Мы напишем приложение, базовый блог.</p>
<p><strong>Используемые технологии</strong>: HTML, PHP, MySQL.</p>
<p><strong>Используемые</strong><strong> компоненты</strong><strong> Symfony:</strong> Flex, Profiler, Web Server, Symfony Form, Doctrine 2, Twig, Router.</p>
<p>Предварительные требования: Углубленные знания в PHP, ООП в PHP, знания MYSQL, знания HTML, знания основ HTTP протокола.</p>
<p><strong>План вебинара:</strong></p>
<ol>
<li>Установка Symfony 4</li>
<li>Создание сущностей и связи сущностей</li>
<li>Создание Контроллера и маршрута</li>
<li>Создание формы для записей и комментариев</li>
<li>Создание HTML страницы с использованием Bootstrap</li>
<li>Тестирование нашего приложения</li>
</ol>
<p><strong>Целевая аудитория: </strong></p>
<p>PHP программисты, IT-студенты, инженеры.</p>
Неделя скидок на FrontEnd
Автор: Редакция ITVDN
Привет, друзья, у нас хорошие новости – на ITVDN неделя больших скидок на самое востребованное направление IT обучения – фронтенд!
FrontEnd разработчик – это специальность, в которой многие находят своё призвание – как люди, способные к точным наукам, так и творческие натуры с образным мышлением, которым нравится заниматься искусством и создавать нечто красивое и радующее глаз.
Именно поэтому фронтенд столь популярен и востребован среди новичков – он совмещает в себе кодинг и творчество, имеет низкий порог вхождения, а также является прекрасным выбором для тех, кто не силен в математике.
Если вы хотите научиться создавать современные веб-сайты, не упустите момент - с 14 по 21 июля скидки до 50% на все специальности по FrontEnd! Это отличный повод как для новичков в веб-разработке, так и для тех, кто хочет систематизировать и углубить свои знания.
Акционные цены:
Frontend Developer — 52 USD (104.99) — 44 видео курса на 7 мес.
JavaScript Developer — 31 USD (44.99) — 10 видео курсов на 3 мес.
Верстальщик сайтов — 36 USD (59.99) — 24 видео курса на 4 мес.
React Developer — 36 USD (59.99) — 16 видео курсов на 4 мес.
Angular Developer — 36 USD (59.99) — 10 видео курсов на 4 мес.
Но будьте внимательны, программа обучения по некоторым специальностям предполагает определенные базовые знания. Подробнее об этом в описании каждого пакета подписки.
Кстати, подарочные сертификаты во время акции также можно приобрести по супер цене!
Пакет подписки “FrontEnd разработчик”
Уровень обучения: с нуля.
FrontEnd разработчик — IT-специалист, который создает пользовательскую логику веб-сайтов. Его главные инструменты — язык JavaScript и один из фреймворков: Angular, React либо Vue.js. Также, он умеет верстать сайты при помощи HTML & CSS.
Пакет по специальности FrontEnd разработчик включает: доступ к 44 видео курсам на 7 месяцев, д/з, курсовые проекты, тесты и сертификаты по изученным технологиям, практикум навыков, онлайн консультация, диплом по специальности.
Вы изучите: языки HTML, CSS и JavaScript, Git, один из фреймворков на выбор — Angular (+ язык TypeScript), React, Vue.js и другие инструменты.
Скидка на специальность FrontEnd Developer – 50%! Не упустите такую возможность.
Подробнее
Пакет подписки JavaScript разработчик
Уровень обучения: с нуля, но полезен также тем, кто занимается BackEnd разработкой и тестированием ПО.
JavaScript разработчик — программист, который может использовать язык JavaScript для различных задач: создание пользовательской логики веб-сайтов (FrontEnd), разработка серверной стороны веб-приложений (BackEnd), проведение тестирования ПО.
Пакет по специальности JavaScript разработчик включает: доступ к 10 видео курсам на 3 месяца, д/з, курсовые проекты, тесты и сертификаты по изученным технологиям, практикум навыков, онлайн консультация, диплом по специальности.
Вы изучите: язык JavaScript с нуля до углублённого уровня, Git.
Подробнее
Пакет подписки Верстальщик
Уровень обучения: с нуля.
Верстальщик — это IT-специалист, занимающийся вёрсткой интернет-страниц. Он принимает от дизайнера макет страницы и при помощи языков вёрстки HTML и CSS преобразовывает его в полноценный веб-сайт, а базовые навыки JavaScript использует для внедрения минимального функционала.
Пакет по специальности Верстальщик включает: доступ к 24 видео курсам на 4 месяца, д/з, курсовые проекты, тесты и сертификаты по изученным технологиям, практикум навыков, онлайн консультация, диплом по специальности.
Вы изучите: HTML, CSS, FlexBox & Grid вёрстка, Bootstrap 4, основы Git, основы JavaScript.
Подробнее
Пакет подписки React разработчик
Уровень обучения: для тех, кто знает HTML, CSS, JavaScript и при этом желает изучить современные инструменты FrontEnd разработки.
React Developer — IT-специалист, который разрабатывает пользовательские интерфейсы (UI) при помощи популярнейшей библиотеки React от разработчиков Facebook.
Пакет по специальности React разработчик включает: доступ к 16 видео курсам на 4 месяца, д/з, курсовые проекты, тесты и сертификаты по изученным технологиям, практикум навыков, онлайн консультация, диплом по специальности.
Вы изучите фреймворк React с нуля до углублённого уровня.
Подробнее
Пакет подписки “Angular разработчик”
Уровень обучения: для тех, кто знает HTML, CSS, JavaScript и при этом желает изучить современные инструменты FrontEnd разработки.
Angular Developer — разработчик FrontEnd, который в качестве фреймворка использует Angular от компании Google для написания эффективных одностраничных приложений (SPA) с единым интерфейсом.
Пакет по специальности Angular разработчик включает: доступ к 10 видео курсам на 4 месяца, д/з, курсовые проекты, тесты и сертификаты по изученным технологиям, практикум навыков, онлайн консультация, диплом по специальности.
Вы изучите фреймворк Angular с нуля до углублённого уровня.
Подробнее