Результати пошуку за запитом: 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 з нуля до поглибленого рівня.
Докладніше