Лучший способ выучить javascript

Лучший способ изучения JavaScript

Russian (Pусский) translation by Anton L (you can also view the original English article)

Изучение чего-то нового всегда является немного пугающим занятием. Для меня самая большая проблема во время обучения новому навыку — это то что я не знаю, чего я ещё действительно не знаю. В связи с этим, лучше составить план обучение, интересующего вас предмета. Вот об этом и будет данный пост: здесь вы найдёте схему, путеводитель, план действий по изучению JavaScript! Вам не придётся беспокоится о поиске надёжных ресурсов и пытаться решить для себя что же учить дальше. Вся нужная информация находится здесь. Просто продолжайте читать эту статью шаг за шагом.

Задание 0: поймите, что такое JavaScript и чем он не является

Перед тем, как приступить к изучению, потратьте минуту, чтобы понять чем является JavaScript и что он делает.

JavaScript это не jQuery, Flash или Java. Это отдельный язык программирования.

JavaScript — это язык браузера (на сегодняшний день, необязательно лишь браузера). Его главное назначение — добавить интерактивности статическим страницам. В браузере, он не заменяет PHP или Ruby. Он даже не заменяет HTML или CSS; вы будете использовать его в сочетании, вместе с этими языками. Также его не так проблематично учить, как вы возможно думаете или слышали где-либо.

Ещё одно небольшое примечание: вероятно, вам приходилось слышать о jQuery, самой популярной JavaScript библиотеке. Или вам довелось слышать о других известных JavaScript фреймворках, таких как Mootools, YUI, Dojo, и так далее. Какое они имеют отношение к JavaScript? Думайте о них, как о коллекциях JavaScript инструментов и функций; используя данные библиотеки, вы всё также пишете на JavaScript, на JavaScript с неким уровнем абстракции. Тем самым вы экономите большое количество усилий и времени.

Вероятно вам даже приходилось слышать, что изучение этого языка стоит начать именно с jQuery (или любой другой библиотеки), и только потом учить обычный JavaScript. Я не согласен с такой точкой зрения. Сначала стоит освоиться с JavaScript, а уже после использовать библиотеки. Таким образом у вас будет уверенное понимание того что вы делаете; в итоге качество вашего JavaScript кода будет гораздо лучше.

Задание 1: пройдите курсы на Codecademy.com

Codecademy появился относительно недавно, создатели сайта утверждают следующее — “самый простой способ научиться программировать”. Вам нужно будет в этом убедиться! На данный момент на сайте имеется всего два курса: “Начинаем изучать программирование” и “JavaScript быстрый старт.” Это отличный способ окунуться в воды JavaScript. Упражнения очень похожи на Try Ruby, вы пройдёте короткие уроки, при этом программируя в браузере и наблюдая за финальным результатом. Во время учебного процесса, зарабатывая очки и получая новые достижения.

Если вы уже знакомы с другим языком программирования, пожалуй неплохой идеей будет начать с курса “JavaScript быстрый старт”; если же до этого вы не писали код (за исключением HTML и CSS), в таком случае “Начинаем изучать программирование” придётся, как нельзя кстати. Codecademy бесплатный, но вам нужно будет зарегистрироваться.

Задание 2: скринкасты на appendTo

Ребята с appendTo сделали потрясающую серию скринкастов, специально для начинающих. Если вы хотите изучить JavaScript правильным (и лёгким) способом, обязательно обратите внимание на данные уроки. Видео уроки всегда являются большим плюсом во время процесса обучения.

«Поднимите свои навыки владения JavaScript на следующий уровень с нашим новым учебным курсом. Никакой регистрации. Никаких уловок. Мы не шутим!»

Задание 3: прочитайте стоящее введение в JavaScript

После того как вы закончите курсы на Codecademy, вам следует приступить к более подробному введению в JavaScript — введению, которое познакомит вас со всеми типами, операторами, конструкциями и так далее.

Ниже представлен набор хороших книг, в которых вы найдёте подробное введение в JavaScript:

• Повторное введение в JavaScript (JS учебник) — это введение на официальном сайте Mozilla Developers Network, подробно описывает тонкости языка JavaScript. Тут вы найдёте много информации и примеров кода.
• Выразительный Javascript — бесплатная книга написана Marijn Haverbeke, также вы можете приобрести печатное издание на Amazon. Книга предоставляет больше информации нежели введение на MDN, она покрывает не только сам язык JavaScript, но и описывает такие тонкости и аспекты, как стиль вашего кода и использование JavaScript в браузере. Слово “выразительный” в названии отнюдь не преувеличение.
• Getting Good with JavaScript — Да, да, это моя собственная книга, но есть и другая причина почему я включил её в этот список. Она сильно отличается от других введения, которые я перечислил до этого; в ней я описал только те вещи, которые понадобятся вам, если вы хотите начать программировать, как можно скорее. Также к ней идёт шесть часов скринкастов, так что если вам нравятся скринкасты, не проходите мимо. (И да, это платная книга)

Задание 4: установите и разберитесь с принципами работы Firebug (или инструментами разработчика)

Как только вы начнёте работать с JavaScript в браузере, вам следует установить Firebug и ознакомиться с его функционалом. Firebug — это плагин для Firefox, поможет вам во время работы над созданием веб-страниц и их отладке: думайте о нём, как о хирургическом ноже веб-разработчика. Не пользуетесь Firefox? Предпочитаете Safari или Chrome? Нет проблем: для вас есть встроенные инструменты разработчика, очень похожие на Firebug.

На Mac вы сможете открыть панель инструментов разработчика, нажав Option + Command + I , на Windows или Linux нажмите Control + Shift + I .

Можно многому научиться, всего-навсего, открыв инструменты разработчика на вашем любимом веб-сайте и изучить, как он устроен и работает. Вот пара ресурсов, которые помогут вам освоится с инструментами разработчика:

Задание 5: прочитайте книгу

На этом этапе вы должны быть хорошо знакомы с основами. Однако, вам предстоит ещё многому научиться. В то время как, я мог-бы порекомендовать вам огромный список платных книг, я назову лишь четыре из них, все они отличного качества и содержат много полезной информации, найти вы их сможете где угодно:

Первые две книги являются подробным руководством, с ними вы сможете пополнить знания, которые вы получили после прочтения введения, познакомитесь с более глубокими темами и концепциями, конечно в некоторых местах будет встречаться уже известная вам информация, но не стоит переживать, её будет не так много.

(Обратите внимание: в то время как все книги доступны на Amazon, я оставил ссылки на сайт издателя, там вы найдёте пробные главы, для ознакомления.)

• Профессиональный JavaScript для веб-разработчиков — написана Nicolas C. Zakas, в этой книге есть всё необходимое. Если вам приходилось читать работы Zakas’а прежде, должно быть вы знаете, что он довольно тщательно подходит к освящению вопросов в своих произведениях. Помимо языка JavaScript, книга помогает понять особенностями JS в браузере.
• JavaScript 24-hour Trainer — эта замечательная книга была написана Jeremy McPeak, работы Jeremy также можно найти на Tuts+. Это не только лишь книга: а также DVD с 4-мя часами видео-туториалов. Здесь вы найдёте 42 видео-урока, автор разберёт все аспекты языка, начиная от синтаксиса, заканчивая гайдлайнами и оптимизацией кода.

В то время как эти книги являются отличным источником информации относительно языка JavaScript и особенностях его использования в браузере, вам всё ещё нужно многое изучить. В них освящается некоторая информация о паттернах (шаблонах) и техниках применения JavaScript, однако ниже вы можете найти, две книги написанные специально об этом.

• JavaScript Шаблоны — от автора Stoyan Stefanov. Я только что закончил читать эту книгу и теперь сильно сожалею, что не сделал этого раньше. После её прочтения вы узнаете, как организовать JavaScript код, очень важный навык, которым обладают не все JavaScript программисты.
• JavaScript: Сильные стороны — написана Douglas Crockford. Эта маленькая книга объяснит, что хорошо, а что нет в языке JavaScript.

Задание 6: создайте что-нибудь

Во время изучения описанных выше книг, вы вероятно внимательно следовали примерам: пытались разобраться, как тот или иной кусок кода работает и пытались настроить его под свои нужды. Теперь же пришло время написать свою программу и создать что-нибудь.

Что же вы можете создать? Вы можете сделать всё что угодно, но вот вам несколько идей:

• Фотогаллерея: показывает набор фото-миниатюр, а также основное фото. Когда пользователь нажимает на миниатюру, ему показывается большая версия миниатюра (не сама картинка миниатюры), заменяя текущее основное фото. Приятным бонусом будет, если вы расположите поверх миниатюры заголовок с alt текстом, или создадите бесконечную цикл, на тот случай, если пользователь не нажимал на картинки в течении одной минуты.
• To-do List: Возможно эта задача кажется вам непростой; но я не прошу сделать полнофункциональное to-do приложение. Просто сделайте поле для текста, рядом разместите кнопку; когда пользователь нажимает кнопку, введённый в поле текст становится пунктом в списке ниже. При нажатии на пункт в списке он должен удаляться. Звучит довольно просто, но есть несколько проблем, которые стоит решить, при реализации данной программы и над которыми вам, как начинающему, будет неплохо подумать.
• Анимированный блок: работа над анимацией всегда была занятием не из легких, однако в данной задаче вам необязательно создавать сложные эффекты. Добавьте div с текстом внутри и несколькими кнопками выше. Одна кнопка будет менять ширину, другая высоту, следующая кнопка будет менять фон блока. Самое главное, чтобы изменения происходили плавно, допустим, за одну секунду. Всегда помните — Google ваш друг, особенно если до этого вам не доводилось работать с анимациями в JavaScript.

Я уверен у вас есть и другие идеи, которые могут стать интересными проектами и неплохой практикой. Конечно вам придётся выйти из зоны комфорта — это единственный способ научиться чему-то новому.

Также обратите внимание на JavaScript категорию, здесь на Tuts+, где вы найдёте огромный список туториалов, неважно новичок вы или профессиональный разработчик.

Задание 6: начните изучать JavaScript библиотеку

Если вы следовали всем заданиям в этой статье, на данном этапе вы скорее всего понимаете, что существуют определённые вещи, которые не будут работать как предполагается в каждом браузере, или задачи, которые очень сложно реализовать. Сложности вызывают: проекты требующие частого взаимодействия с DOM, AJAX и само-собой анимации. Тут-то нам и помогут JavaScript библиотеки.

Как я и говорил ранее, JavaScript библиотеки, призваны упростить работу над сложными задачами. Тем самым, пришло самое время взглянуть на одну из них. Выбор действительно огромен, решения с какой начать эксперементировать, я оставлю за вами. Будь-то jQuery или Mootools, YUI или Dojo, на сайте с описанием вы найдёте всё что нужно. Если вы чувствуете необходимость, воспользуйтесь одной из библиотек.

Самые популярные библиотеки

Всем известно, что выбор доступных JavaScript библиотек огромен, для начала я предлагаю вам остановиться на одной из самых распространённых.

Задание 8: следите за активностью профессиональных разработчиков

В интернете можно найти множество гениальных JavaScript разработчиков, которые каждый день создают что-то новое и интересное, что-то, что вы бы не хотели пропустить. К счастью наш, всегда бодрствующий, редактор Siddharth, создал список ”33 Разработчика на которых вы должны подписаться, будучи JavaScript зависимым.» Отложите все ваши текущие дела и подпишитесь на этих разработчиков. Я требую этого!

Всегда можно найти ещё больше информации, если вам её недостаточно. На данном веб-сайте регулярно появляются новые посты о JavaScript, так что, оставайтесь с нами. Кроме этого, обратите внимание на JavaScript Show — подкаст о новинках в мире JavaScript. А также, я настоятельно советую подписаться на e-mail рассылку JavaScript Weekly.

Заключение

Спасибо, что прочитал эту статью! Надеюсь, данный путеводитель поможет вам стать фанатом JavaScript. Если вы знакомы с JavaScript не понаслышке, можно порекомендовать другие ресурсы в комментариях ниже.

Источник

Как выучить JavaScript с нуля?

В этой статье вы узнаете, как быстро и просто выучить JavaScript самостоятельно. Что учить в первую очередь, какие навыки нужны для получения работы. Получите обзор бесплатных курсов по языку Java Script и много другой полезной информации.

Содержание статьи:

Где используют язык JavaScript и для чего?

Java Script (Ява или Джава скрипт или сокращенно JS) – один из самых популярных языков программирования в мире. Чаще всего на нем создают интерактивные элементы на сайтах, с помощью которых сайты «оживают», начинают реагировать на действия пользователей. Примеры таких элементов:

Виджеты и многое другое.

Однако данный язык востребован не только в создании сайтов. Его используют для разработки прикладных программ, например, браузеров, приложений для SMART-телевизоров, фитнес-трекеров, умных часов, приставок, в макросах для офисных программ. Подробно о сфере применения Джава скрипт можно прочитать в описании профессии JavaScript-разработчика.

Зачем учить JavaScript? Преимущества языка для новичков

• Специалисты отмечают, что данный язык достаточно простой для новичков.
• Самостоятельно изучить основы JavaScript можно за 3-4 месяца. После этого вам будет проще осваивать другие языки, в частности, PHP.
• Ява скрипт имеет широкое применение и популярность в интернете. Выучив его, вы сможете зарабатывать на создании и доработке скриптов для сайтов.
• Он содержит все фундаментальные вещи: алгоритмы, объектно-ориентированную модель и структуры данных.
• Писать программы на Джава скрипт можно в любой текстовом редакторе, даже Блокноте.

Актуальность и востребованность языка вряд ли будет снижаться в ближайшее время.

С чего начать изучение JavaScript и сколько времени это займет?

Как в любом языке, в JavaScript имеются определенные команды и правила их составления. Начать изучение этого языка можно со следующих вещей:

1. Структура кода (как составляется программа, с чего начинается, в какой последовательности задаются команды и т.д.).
2. Переменные (что это такое, для чего нужны, как задаются и используются в скриптах).
3. Типы данных, например: число, строка, логический тип, и преобразование типов.
4. Операторы, например, как производится сложение. Приоритет операторов (какие действия выполняются в первую очередь, какие – во вторую и т.д.). Бывают операторы сравнения, условные операторы, логические.
5. Выучить, как использовать циклы (что это такое, для чего нужны, как их задавать). Говоря простыми словами, циклы позволяют производить одну и ту же операцию несколько раз (пока не наступит условие, которое завершит цикл).
6. Функции.
7. Объекты и их свойства.
8. Прототипы, наследование.
9. Классы и наследование классов.
10. Интерфейсные события (обработка движения курсора, кликов мышки, нажатия кнопок на клавиатуре).
11. Программирование элементов интерфейса: кнопок, форм и других.
12. Выучить, как писать асинхронный код на JavaScript.
13. Отладка программ в браузере, написанных на JS.
14. Обработка ошибок.

Качество кода: как писать программу правильно, чтобы в ней было легко и просто ориентироваться как автору, так и другому разработчику.

Изучить основы можно самостоятельно, например, пользуясь самоучителем Learn.javascript.ru или Html5css.ru. На втором сайте курс интерактивный. Можно прямо в браузере смотреть пример кода и как он работает (какие события обрабатывает и как).

Выучить простейшие азы можно за срок от 2-3 недель до 1,5 месяцев в зависимости от времени, которое вы сможете уделять программированию каждый день. Далее вам потребуется более глубоко погружаться в предметную область, о чем поговорим ниже.

Для изучения JavaScript пригодится знание HTML и CSS. Если вы еще не знаете эти технологии, то освоить их можно на бесплатном курсе в Нетологии. На нем расскажут, что такое HTML-теги, для чего они нужны и покажут основные теги и их атрибуты.

В какой последовательности можно учить язык JavaScript?

1. Изучите основы языка. Список того, что нужно знать, описан выше. Все это можно выучить самостоятельно, пользуясь бесплатным учебником Learn.javascript.ru. Он написан на русском языке просто и понятно.

Если вам нужен наставник, то можно пойти на курсы. Например:

• Курс по frontend-разработке в Нетологии – включает изучение JavaScript и других технологий, применяемых в разработке сайтов.
• Курс по JavaScript в Geekbrains – включает не только обучение, но и стражировку в компаниях-партнерах, например, Майл.ру.

Fullstack-разработчик на JavaScript в Skillbox – посвящен исключительно одному языку программирования и позволяет изучить его на хорошем уровне с нуля.

2. Изучите библиотеки, например, jQuery и React. Это наборы готовых решений, которые можно использовать для ускорения работы. Нет смысла писать все скрипты с нуля, когда есть множество готовых решений.

3. Будет полезно изучить Node.JS – это технология расширяет область применения Джава-скрипт. Например, при помощи Node.JS можно создавать приложения и полноценные программы для ПК.

4. Освойте фрймворки, например, Angular и Vue.js. Фреймворк – это некая основа, фундамент, на котором можно создавать различные программы. Он включает набор готовых решений, на базе которых можно быстрее собрать ИТ-продукты (лендинг, сайт, интернет-магазин, приложение).

Например, фреймворк Angular используется для создания одностраничных приложений, Vue.js – для создания пользовательских интерфейсов.

5. Научитесь использовать системы контроля версий. Самая популярная из них — это GIT. О нем поговорим ниже.

6. Учитесь писать грамотный и правильно структурированный код.

Что такое GIT и для чего он нужен?

GIT – это система контроля версий. Она позволяет команде разработчиком совместно работать над кодом и при необходимости возвращаться к версиям программ, созданным ранее. Также GIT синхронизирует работу с сайтом, сохраняет и обновляет изменения в файлах со скриптами.

Эта система позволяет избегать ошибок и систематизировать работу над программным кодом. При необходимости можно быстро откатить изменения, если в программе нашлись баги (ошибки).

Бесплатные курсы и материалы для новичков

В этой части статьи на Kadrof.ru вы найдете видео, а также ссылки на обзоры бесплатных уроков и мастер-классов, которые помогут выучить JS с нуля. Вы сможете использовать их для самообучения.

1. Полный курс по Java Script для новичков. За 6 часов в этом видео простым и понятным языком описываются основы языка:

2. Что такое Node.JS: история создания, простейшие скрипты и основные возможности. Видео с канала Разработка от Яндекса продолжительностью 3 часа:

3. Еще один бесплатный урок по Node.JS, который можно посмотреть в том числе начинающим разработчикам:

4. Полный курс по React. Примеры и практика для новичков:

Также вы можете посмотреть бесплатные видео уроки, собранные в группе Клуб фриланеров, в том числе:

Где учиться программировать на JavaScript?

Можно учиться самостоятельно по бесплатным урокам, которые есть в сети интернет. Этот вариант подойдет людям, которые уже сталкивались с веб-разработкой, имеют какой-либо опыт или сильное желание учиться. Выше в статье мы собрали ссылки на такие уроки, посмотрите их. Если вы решили учить JavaScript самостоятельно, постарайтесь системно подходить к освоению знаний.

Можно пойти на курсы, где вас научат программировать на Джава-скрипт с нуля, помогут с практикой и стажировками. Если вы решите пойти на курсы, то вначале рекомендую какие-то основы изучить самостоятельно, написать простейшие скрипты, чтобы в процессе обучения задавать больше вопросов и глубже освоить программу.

Среди курсов можно выделить:

• Fullstack-разработчик на JavaScript в Skillbox –данный курс посвящен верстке сайтов и программированию на JS. Осваивается язык, фреймворк (один на выбор – Vue, React или Angular), серверные технологии (Node.js). После обучения вы сможете не только работать с сайтами, но и создавать приложения на JS.
• Курс по frontend-разработке в Нетологии. Уровень обучения – с нуля. Занятия проходят онлайн. Есть практика и диплом. Здесь вы освоите не только JS, но и библиотеку React, а также получите другие необходимые знания для работы front-end программистом. Если вы в дальнейшем хотите заниматься разработкой сайтов, этот курс для вас.

Обучение JavaScript в Geekbrains – здесь студенты проходят HTML, CSS, JavaScript, React, а также – основы баз данных и Node.js. Предусмотрена стажировка у партнеров.

Как быстро выучить JavaScript с нуля? Советы для новичков

1. Старайтесь системно подходить к обучению. Если осваиваете Ява скрипт самостоятельно, то начинайте с основ, затем переходите к более глубокому материалу. Параллельно учите теорию. Что такое алгоритмы, какие они бывают и т.д.
2. Постоянно практикуйтесь. Начинайте писать свои скрипты или переделывать или дорабатывать скрпиты других разработчиков (их можно найти в интернете). Старайтесь разобраться, как работает чужой код и как он сделан.
3. Сделайте свой сайт, например, на WordPress и добавляйте на него различные функции. Это будет хорошей практикой.
4. Если вам что-то не понятно, берите консультации программистов или заказывайте услугу code-review (проверку кода у опытного разработчика с комментариями, что нужно доработать, переделать и почему). Найти опытных разработчиков для code-review можно в каталоге веб-программистов на Kadrof.ru. Данная услуга стоит денег, поэтому заранее уточняйте у людей, которые согласятся проверить ваш код, сколько это будет стоить.
5. Много полезной информации можно найти на сайте Хабр Q&A. Там общаются разработчики и в том числе можно попросить совет (бесплатно).

На Kadrof.ru есть обзор сайтов для изучения языков программирования. Там вы найдете справочники и самоучители, которые помогут быстро освоить JavaScript.

Как наработать опыт и найти работу?

1. В ИТ сфере принято тестировать кандидатов на работу. Поэтому в первую очередь для получения работы необходимы знания. Просматривайте вакансии на HH.ru и обращайте внимание, какие требования предъявляются работодателями. Какие технологии и на каком уровне необходимо знать. Изучив материал, приходите на собеседования. Если вас взяли, отлично. Если нет, спросите, каких знаний и навыков вам не хватило для получения работы и постарайтесь их быстро выучить. Затем снова приходите на собеседование.
2. Ищите информацию о стажировках в крупных компаниях. Стажировка – отличный шанс получить опыт и затем работу. Подпишитесь на группу Клуб фрилансеров – в ней публикуется информация о стажировках и другие полезные новости для новичков.
3. Посетите веб-студии, которые работают в вашем городе. Возможно, где-то требуется Junior разработчик на JS и вас возьмут на испытательный срок.
4. Пока ищете работу, попробуйте подрабатывать на фрилансе, выполнять простые заказы на биржах или развивать собственный проект в интернете.
5. Не переживайте, если сразу не получается найти работу. В ИТ не всегда просто новичкам, но по мере накопления опыта искать хорошие вакансии станет проще. Все когда-то начинали и проходили начальный этап.

Общайтесь на форумах и сайтах для программистов. Вступайте в профильные группы в социальных сетях. Становитесь частью профессионального сообщества. Тогда найти работу станет проще.

Мы разобрались, как выучить JavaScript с нуля самостоятельно, что нужно осваивать в первую очередь и как быстро набрать опыт. Теперь вы готовы сделать первые шаги. Удачи вам в изучении JS и поиске работы!

Источник