Бесплатный курс по программе
Frontend development
Набор закрыт, но ты можешь оставить заявку
Оставь свои контактные данные и мы напишем тебе как только набор откроется
Нажимая на кнопку «Отправить», я даю свое согласие на обработку моих персональных данных
Почему Frontend development
- Высокий спросВ мире все более растет потребность в создании пользовательских интерфейсов для веб-сайтов и приложений, что делает фронтенд-разработку высоко востребованной профессией
- Гибкая траекторияЗнание фронтенд-разработки может также служить хорошей отправной точкой для расширения навыков в других областях веб-разработки, таких как full-stack разработка или дизайн
- РазнообразиеФронтенд-разработка предлагает широкий спектр проектов, от небольших лендингов до сложных веб-приложений, что позволяет разнообразить вашу работу и навыки
- Большое сообщество и поддержкаПрохождение курса позволит вам встретиться с единомышленниками, расширить профессиональную сеть контактов и обменяться опытом с другими студентами и преподавателями
Что ждет на курсе
-
Лекции и вебинары2-3 раза в неделю
С 16:00 по мск -
Домашка и практикаСделаешь проект, который можно положить в портфолио -
Эксперты и кураторыПолучишь навыки и обратную связь от сотрудников Neoflex -
IT-комьюнитиОбменяешься знаниями, опытом и поддержкой
Программа обучения
Расскажем про базовые принципы работы команд, системы менеджмента и автоматизации, софт и хард скиллы
Обсудим, как работать с Figma и как обсуждать макет с дизайнером
Узнаем, что нового в HTML 5, разберем, как работать с CSS3 и SCSS
Узнаем, что такое и для чего нужен TypeScript, рассмотрим отличия JS от TS, обсудим преимущества и недостатки TypeScript, а также, как провести установку TypeScript
Рассмотрим жизненный цикл компонента, React Hooks и функциональные компоненты (оптимизация и избегание лишнего ререндеринга), изучим Redux хранилище состояния компонента
Узнаем, как писать бэк на JS с Express, изучим, для чего нужны мок-серверы, рассмотрим процесс проксирования
Узнаем, что нужно учитывать при настройке Webpack и добавлении плагина Typescript, научимся настраивать дев сервер и проксирование, освоим добавление плагина для SVG, познакомимся с Module Federation
Познакомимся с понятиями микрофронтов и модульности, узнаем, как работает Yarn workspace и NX
Познакомимся с оптимизацией React и библиотеками (React hook form, Redux form), изучим MobX и Zustand, освоим UI Kit и клиентские UI Kit со storybook
Изучим React Query как альтернативу Redux, освоим другие библиотеки
Изучим Styled components, освоим CSS modules
Разберем, что такое Accessibility и зачем учитывать доступность, освоим основные инструменты анализа доступности интерфейса
Узнаем, что такое куки, изучим хранение и работу токенов, освоим Cors и XSS
Что нужно для участия
- TypeScriptОбладаешь базовыми знаниями TypeScript и можешь использовать их в работеНавыки вёрсткиЗнаешь основы HTML и основы объявления CSS стилейSpring-приложенияЗнаешь способы конфигурации Spring-приложенияОсновы JSЗнаешь и понимаешь основы JS: Операторы, типы данных, асинхронность и т.д.REST APIПонимаешь принципы применения, а также стандарты и методыReact/Vue/AngularПонимание принципов работы, основных концепций и библиотекПроверьте себя
Пройдите короткий тест из 5 вопросов, которые помогут оценить
ваши знания по направлениюКакой результат выведет следующий код? console.log(0.1 + 0.2 === 0.3)Из-за особенностей IEEE 754 сумма 0.1 + 0.2 даёт 0.30000000000000004, а не 0.3.Из-за особенностей IEEE 754 сумма 0.1 + 0.2 даёт 0.30000000000000004, а не 0.3.Из-за особенностей IEEE 754 сумма 0.1 + 0.2 даёт 0.30000000000000004, а не 0.3.Из-за особенностей IEEE 754 сумма 0.1 + 0.2 даёт 0.30000000000000004, а не 0.3.Какое CSS-свойство используется для создания многострочного текстового обрезания с троеточием?Для корректного обрезания строки необходимо использовать overflow: hidden, white-space: nowrap и text-overflow: ellipsis.Для корректного обрезания строки необходимо использовать overflow: hidden, white-space: nowrap и text-overflow: ellipsis.Для корректного обрезания строки необходимо использовать overflow: hidden, white-space: nowrap и text-overflow: ellipsis.Для корректного обрезания строки необходимо использовать overflow: hidden, white-space: nowrap и text-overflow: ellipsis.Что вернёт следующий код? console.log([ ] + { })Пустой массив [ ] приводится к пустой строке "", а { } к строке "[object Object]", поэтому результат "[object Object]".Пустой массив [ ] приводится к пустой строке "", а { } к строке "[object Object]", поэтому результат "[object Object]".Пустой массив [ ] приводится к пустой строке "", а { } к строке "[object Object]", поэтому результат "[object Object]".Пустой массив [ ] приводится к пустой строке "", а { } к строке "[object Object]", поэтому результат "[object Object]".Какой результат будет у console.log("5" - - "2")?"5" и "2" преобразуются в числа, а двойной минус - - превращается в +, поэтому 5 + 2 = 7."5" и "2" преобразуются в числа, а двойной минус - - превращается в +, поэтому 5 + 2 = 7."5" и "2" преобразуются в числа, а двойной минус - - превращается в +, поэтому 5 + 2 = 7."5" и "2" преобразуются в числа, а двойной минус - - превращается в +, поэтому 5 + 2 = 7.Какое значение имеет z-index у элемента по умолчанию?По умолчанию z-index имеет значение auto, что означает, что порядок определяется позицией элемента в дереве рендеринга.По умолчанию z-index имеет значение auto, что означает, что порядок определяется позицией элемента в дереве рендеринга.По умолчанию z-index имеет значение auto, что означает, что порядок определяется позицией элемента в дереве рендеринга.По умолчанию z-index имеет значение auto, что означает, что порядок определяется позицией элемента в дереве рендеринга.
Neo-венький / НЕОкрепшие познанияПривет новичкам! Кажется, кто-то еще в са-а-амом начале пути. Ух, как мы тебе завидуем – столько всего предстоит узнать! А чтобы понимать, на что ориентироваться и с чего начать – ознакомься с материалами на странице интересующего тебя направления.
Neo-любитель / Еще НЕОбузданные знанияТы явно где-то нечто читал или слышал – а это уже что-то! Так держать! Но не останавливайся и углубляй свои еще необузданные познания, чтобы стать нашим студентом!
Neo-с-опытом / НЕОпознанный субъектТест наполовину пройден – успех наполовину в кармане. Мы уже не можем причислить тебя к новичкам, но и еще не можем к знатокам. Скажем одно – ты на верном пути, продолжай изучать!
Neo-почти готовенький / НЕОтразимый!Еще чуть-чуть! Это было неотразимо! Ты почти готов к настоящим вступительным испытаниям. Скорее исправляй пробелы в знаниях и ждем твоей заявки!
Neo-отличник / НЕОспариваемый успехОго! А вот и ты, наш идеальный студент! Видим, что ты готовился. Желаем такого же успеха на вступительных испытаниях и будем рады видеть в числе наших студентов!Материалы для самоподготовки- Справочник по HTML тегам и CSS свойствам (ссылка)
- Б. Фрэйн «HTML5 и CSS Разработка сайтов для любых браузеров и устройств»
- Резиг, Бибо, Марас «Секреты JavaScript ниндзя»
- М. Хавербеке «Выразительный JavaScript. Современное веб-программирование»
- Д. Седерхольм «HTML5 For Web Designers / CSS3 For Web Designers (A Book Apart)»
- Работа с Git (ссылка)
- БЭМ (ссылка)
- Основы HTML5. Полный курс (ссылка)
- Основы CSS3. Полный курс (ссылка)
- ES6 (ссылка)
- ES6 and Typescript Tutorial (ссылка)
- React & TypeScript — курс для начинающих (ссылка)
- React TypeScript полный курс 2021. Props, Events, Router, Hooks, Requests (ссылка)
- REST API (ссылка)
- React JS фундаментальный курс от А до Я (ссылка)
- Beginner's Tutorial for React JavaScript Library [2022] (ссылка)
- Security: CORS (ссылка)
- Онлайн учебник по JavaScript (сcылка)
Остались вопросы?
Нажимая на кнопку «Отправить», я даю свое согласие на обработку моих персональных данных127015, г. Москва, ул. Вятская, д. 35, стр. 4, 1 подъезд, 2 этажПереходи в наш Telegram bot. С его помощью ты можешь подать заявку на обучение и узнать больше об Учебном Центре.