Продолжаем постигать JavaScript-фреймворки.
Angular - невероятно мощный JavaScript-фреймворк, который вам позволит создать веб или клиентское приложение любой сложности. С тех пор как он появился в 2009 году, десятки тысяч разработчиков ввели его в свой инструментарий.
Однако Angular, вместе с тем, не самый легкий для освоения фреймворк. Поэтому нет ничего удивительного, что зачастую для его изучения официальной документации оказывается мало. Вот еще 11 ресурсов, где абсолютно бесплатно можно получить навыки управления Angular JS.
Портал Ng Newsletter содержит тонны информации по Angular, но для новичка самая полезная - курс «from beginner to expert in 7 steps series». По правде говоря, экспертом на основе этого курса вы не станете, но пробелов в базовых вещах остаться не должно. Для экспертов - подпишитесь на их рассылки.
На Youtube вы без особого труда найдете видеоурок Дэна Уалина «AngularJS in 60 minutes». Под ссылкой спрятано PDF копия со слайдами и текстом. Будет полезно, кто не очень хорошо пока освоил английский язык.
Закончим на сегодня одним из лучших комплексных курсов по AngularJS, из тех, что вы сможете пройти, не потратив ни копейки. 5 разделов, 12 коротких видеоуроков и 27 соревновательных заданий. Выполните все - получите 6 памятных бейджиков отличия, которые всегда можно предъявить в качестве подтверждения прохождения курса.
Angular 4/6, полностью переработаное продолжение JavaScript фреймворка AngularJS. Переработанный с нуля специалистами Google, Angular 2/4/6 предоставляет рассширенные возможности для создания Single-page application, такие как, декларативные шаблоны, двухсторонний дата биндинг, поддержка TypeScript, и внедрение зависимостей. Вместо контроллеров, характерных для архитектуры MVC, Angular 2/4 теперь использует компоненты. Это обновление, подходит как для мобильных так и для веб разработчиков.
Аудитория: Руководство предназначено для разработчиков которые хотят изучить основы Angular 6 и его концепции программирования, а так же для всех кто ищет для себя “что-то новое”. Описывает компоненты Angular 6 с примерами.
Минимальные навыки: Базовые знания JavaSctipt. А так же, было бы хорошо знать смежные технологии HTML, CSS, AJAX, AngularJS и т.д.
Angular 6 – это платформа, которая упрощает разработку веб-приложений. Angular 6 сочетает в себе декларативные шаблоны, инъекцию зависимостей, комплексный end-to-end инструментарий и уже имплементированные best practice для решения любой сложности задач. Angular 6 позволяет создавать не только для веб-приложения но так же мобильные и десктопные программы.
Структура уроков Angular 2 на русском (tutorialspoint):
В этом уроке вы познакомитесь с Angular 4. Для начала вы узнаете, чем отличаются Angular 1, Angular 2 и Angular 4 и поймете, что стоит изучать.
В данном уроке вы узнаете, как создаются компоненты в Angular 4, и как они взаимодействуют друг с другом.
В этом уроке вы узнаете, как с помощью специального синтаксиса Angular 4 можно выводить динамически элементы в шаблоне.
Мы реализуем вывод элементов в шаблоне в зависимости от длины массива данных, заданных в typescript.
Также в данном уроке вы узнаете, как связывать компоненты параметрами, как передавать параметры из родительского компонента в дочерние.
В этом уроке вы узнаете про 2 сущности Angular 4 - сервисы и класс для работы с ajax запросами.
Вы увидите, как создаются сервисы, и как их нужно регистрировать. Далее мы расширим функционал сервиса, путем добавления в него класса HTTP, который позволит нам делать асинхронные запросы к удаленному серверу для получения списка пользователей.
После этого мы выведем в шаблон все данные, и вы так же увидите какие есть тонкости этого процесса.
В этом уроке вы познакомитесь с таким понятием как директивы. Для начала вы научитесь добавлять обработку любых событий на элементах.
После этого вы увидите, как создаются и регистрируются свои собственные директивы. В ней мы будем слушать событие наведение мыши на элемент и добавлять класс, для красивого отображения элемента, но сделаем это самым эффективным способом от Angular 4, который кардинально отличается от обычной javascript реализации.
В этом уроке вы познакомитесь с понятием пайпов в Angular 4. Для начала вы увидите синтаксис по применению стандартных пайпов, например, для изменения регистра текста.
Для этого нам потребуется еще разобрать понятие “2 way data binding” с использованием Angular Model.
В этом заключительном уроке вы узнаете, как с помощью Angular 4 можно создавать разные страницы.
Мы создадим 2 роута - для главной страницы и для страницы настроек. Далее мы создадим 2 компонента, но уже не самостоятельно, а с помощью инструмента Angular CLI, для того, чтобы ускорить процесс.
После этого мы создадим навигационную панель, для моментального переключения страниц.
В конце урока вы увидите, как связать страницу настроек и главную страницу - на странице настроек мы будем менять количество загружаемых пользователей, и при переходе на главную страницу с сервера будет подтягиваться необходимое количество.
Приветствую Вас, друзья, в новом цикле уроков, посвященных знакомству с JS фреймворком AngularJS и изучению основ работы с ним. Собственно, данный цикл будет называться просто - Уроки AngularJS (на русском языке). Для чего нужен данный фреймворк и какова сфера его применения?
Если перед вами стоит задача написать сайт или веб-приложение, где все или почти все работает без перезагрузки страницы, т.е. с использованием AJAX запросов, тогда, вполне возможно, вам стоит посмотреть в сторону JS фреймворков.
Конечно же, можно все то же самое сделать и с помощью библиотеки jQuery или даже на чистом JS. Однако, такой код может быть гораздо более сложен и запутан, его поддержка и последующее расширение могут быть довольно проблематичны, по сравнению с кодом, написанными с помощью фреймворка, предлагающем ясную и чистую структуру кода на основе MVC шаблона (Model-View-Controller) или, быть может немного точнее - MVVM (Model View – View Model).
Хотя здесь на самом деле возможна и обратная картина, поэтому идеализировать фреймворк и воспринимать его как абсолют - также не нужно. Абсолютно идеальных вещей не бывает, везде есть свои плюсы и свои минусы.
Стоит понимать, что JS фреймворки, в частности AngularJS, имеют вполне конкретную сферу применения: создание одностраничных приложений (SPA - Single Page Application). Поэтому лепить его куда ни попадя - не очень хорошая практика. Хотя бы потому, что могут возникнуть проблемы с банальной индексацией ключевого контента поисковыми роботами. Хороший вариант сферы применения JS фреймворков - админская часть сайта. В целом, AngularJS - это фреймворк для веб-приложений, а не сайтов.
Из каких фреймворков выбирать и какой выбрать? JS фреймворков на самом деле множество. Наиболее известны, к примеру: Ember.js, Backbone.js, Knockout. Все они в той или иной мере похожи и, по сути, выполняют одинаковые задачи. AngularJS на сегодняшний день является, пожалуй, одним из наиболее популярных JS фреймворков. Он имеет относительно неплохую документацию со множеством примеров. К тому же, это фреймворк от мирового лидера - компании Google, что уже может свидетельствовать в пользу его выбора.
В уроках AngularJS мы шаг за шагом попробуем изучить его основы, его наиболее полезные и часто используемые возможности. Ну и как итог изучения, попробуем написать несложное, но полноценное веб-приложение на AngularJS. Уверен, что мы добьемся быстрого освоения AngularJS!
Описание курса: Приветствую Вас, друзья, в новом цикле уроков, посвященных знакомству с JS фреймворком AngularJS и изучению основ работы с ним. Собственно, данный цикл будет называться просто - Уроки AngularJS (на русском языке). Для чего нужен данный фреймворк и какова сфера его применения?
Большая подборка полезных ресурсов, которая поможет вам построить план изучения Angular 2.
В этой книге Ари объясняет лучшие практики, которые нужно использовать при разработке на Angular2. Здесь вы найдете реальные примеры с исходным кодом, поясняющие, что и как работает.
Если у вас есть храбрость и стремление к самостоятельному изучению, то официальный сайт Angular &mdash это лучшее место, чтобы начать. Для сравнения, можете ознакомиться с другими ресурсами в этом посте для более легкого ознакомления с разработкой на Angular2.
Кажется, что Egghead - это один из немногих обучающих ресурсов, которые детально охватывает разработку приложений на Angular2. На момент написания этой статьи, Egghead предлагает 29 разных Angular2 скринкастов, и только 3 из них - платные. Целых 26 бесплатных скринкастов по Angular2 на Egghead.
Стоит начать изучение темы с большим количеством бесплатного материала. Ознакомьтесь со страницей Angular2 на Egghead для просмотра скринкастов, охватывающих основы.
Ни для кого не секрет, что на YouTube много мусора. Но там много и невероятного материала. Главное знать, как его найти. Сообщество Angular2 собрали отличные видеоуроки для изучения Angular 2 с нуля.
Если вы предпочитаете визуальное обучение и не хотите платить, ищите видеоуроки на YouTube.
Вот несколько интересных видео для начала:
Если ни один из этих ресурсов не подходит, я рекомендую обратиться к списку рекомендованных ресурсов. Мой любимый - Angular2 Learning , разделенный на книги/видео и темы/предметы, типа аутентификации и маршрутизации.
Страница на GitHub, поддерживаемая Джеффом Каннингемом , содержит много обучающих ресурсов по Angular2. Она была создана для Angular 1.x, но затем изменила направление на Angular2.
Еще один бесплатный рекомендованный список - Angular Education , расположенный на GitHub. Этот список разбит на темы, содержащие ссылки на видео и статьи. Он часто обновляется, включая книжные новинки, типаAngular2 in Action , издание которой запланировано на 2017 год.
Еще один сайт, который стоит посетить - Angular2.com . Это хранилище обучающих ресурсов: статей, учебников и видео. В то время как этот сайт служит рекомендованным пунктом из списка, Learn Angular2.com публикуют свои уроки.
Текстовый контент периодически обновляется, поэтому проверяйте источники.
