Ждём тебя в четверг, 18 мая, на бесплатном вебинаре SaintCode Bootcamp 😇

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

❓А чем вообще отличаются форматы ❓

⚡️Классический формат — это три месяца хардкорного погружения во фронтенд. Ты занимаешься полную пятидневку в буткемпе в Петербурге или онлайн. Преподаватель всегда доступен в рабочее время, а по ситуации — и в выходные дни. Подходит людям, которые твёрдо решили стать программистами, не хотят терять время впустую и могут позволить себе отказаться от всех дел на три месяца. Следующий поток начнётся 13 июня.

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

Вебинар проведут Женя Гриценко (основатель школы SaintCode Bootcamp, карьерный консультант) и Данил Данилов (фулстек-разработчик, преподаватель в нашей школе). Другие гости: выпускники буткемпа, которые уже устроились на работу.

🕖 Начало в 18:00 (МСК), четверг, 18 мая. Каждый участник получит в подарок подробную дорожную карту для самостоятельного изучения фронтенда. Регистрируйся на сайте — https://saintcode.ru/webinar_one?utm_source=telegram_nondirect&utm_medium=post&utm_campaign=organic_social&utm_content=webinar1805

⚡️Бесплатный вебинар SaintCode Bootcamp начнётся через 10 минут ⚡️

Основная тема — сравнение классического буткемпа и нашего нового продукта, вечернего курса.

Но ты можешь приходить с любыми вопросами и получить ответы вживую, даже если не собираешься учиться у нас 👌

Ждём тебя в Zoom — https://zoom.us/j/91883548187?pwd=Rk00QjlHUVZxTWk5T1VOQndPNHcxQT09

Хочешь обучаться программированию, но пока не знаешь где и в каком формате? 🤓

Посмотри запись последнего вебинара SaintCode Bootcamp — его провели основатель школы Женя Гриценко и преподаватель Данил Данилов.

Ребята рассказали, чем отличается буткемп от нового вечернего курса, какие проблемы возникают у новичков и как не растерять мотивацию по пути к своей цели 💪

👉 Видео на Youtube — youtu.be/tvW7fvD2-0s 👈

Помнишь сравнение строк в JavaScript? 😺

Давай проверим — укажи, что будет в консоли, если мы запустим этот код.

😅 Объяснение задачи:

Чтобы понять, как JS сравнивает строки, надо понимать два правила:

☝️Строки сравниваются посимвольно. Если первый символ первой строки больше или меньше первого символа второй строки — сравнение заканчивается. Если они одинаковы, то сравнение продолжается по следующим символам и заканчивается на том месте, где символы отличаются друг от друга.

☝️Символы сравниваются по таблице юникода, а не по алфавиту. Например, новички часто не могут понять, почему заглавная буква меньше строчной. Но если взглянуть на таблицу юникода в десятичной системе, у заглавной «Д» код 1044, а у строчной «д» — 1076. И так со всеми буквами во всех языках — код строчной буквы по юникоду больше заглавной.

В нашей задаче первые два символа одинаковые. Код «д», третьего символа в первом слове — 1076. Код «т», третьего символа во втором слове — 1090. JavaScript сравнивает коды и выясняет, что «т» больше «д».

На этом сравнение завершено — получается, что «Кот» больше, чем «Кодер», несмотря на то, что в последнем больше символов.

«Да что за CORS такой?», — часто злятся наши студенты, когда начинаются проекты с обращением к сторонним API. Давай разбираться 👌

CORS (Cross-Origin Resource Sharing) — это механизм, который контролирует использование ресурсов между источниками. CORS встроен во все современные браузеры, он защищает клиентскую сторону от утечки данных и вредоносного кода.

Ошибка появляется в консоли, когда ты пытаешься обратиться с одного URL на другой. Клиент и сервер обмениваются заголовками, твой браузер не видит заголовков CORS и блокирует действие.

У новичков чаще всего происходит при использовании метода fetch для обращения к стороннему API. Например, ты хочешь обратиться к бесплатному API с прогнозом погоды и забрать у него актуальные данные. Ошибка может возникать и когда вставляешь в теги <img>, <video> и другие контент из внешнего источника, а не из директории проекта — но здесь сосредоточимся на fetch.

Предположим, полный адрес твоей локальной среды разработки в строке браузера выглядит как “http://localhost:3000” или “http://localhost:5500”. Ты хочешь обратиться через fetch к “https://super-api.net”. У вас не совпадают хосты (localhost и super-api.net), протоколы (http и https) и порты (http на 80, https на 443). Комбо: как раз все три причины, почему CORS может быть недоволен твоим запросом.

Самое простое решение проблемы для fetch — передать в параметрах метода заголовок запроса Access-Allow-Control-Origin: *. Таким образом ты разрешаешь все запросы. Но «звёздочку» желательно использовать только в учебных целях. С оговорками она подходит и если ты просто получаешь данные, твоё приложение не требует аутентификации или авторизации, источник доверенный (рабочий или учебный сервер).

Если хочешь углубиться в CORS, можешь прописать в заголовке адрес сервера с протоколом и портом, либо запустить локальный прокси-сервер. Но когда работаешь в команде, у тебя обычно есть доступ к бэкендерам. Оптимальное решение в коммерческой практике — это попросить коллег установить на сервере заголовки со списком доступных ответов 🙌

У новичков часто возникают ситуации, когда в конце или в середине проекта приходится всё переписывать заново 😰

Но это нормально — пока ты учишься, кривой код неизбежен. Наверняка на предыдущей работе у тебя тоже не всё получалось сразу 🤷‍♂️ Не падай духом и не ленись улучшать свои веб-приложения, даже если для этого придётся начинать практически с нуля.

Когда твой проект лежит на GitHub или подобной платформе — не перезаливай новую версию отдельно, а подробно опиши изменения в коммитах. Это займёт больше времени, зато ты покажешь своё умение работать над ошибками. Работодатели любят, когда можно посмотреть прогресс разработчика наглядно, чтобы понять, какой код ты писал раньше и как прокачался с тех пор 💪

Привет! 👋 Лето близко, но наверняка ты задумываешься, как провести его с пользой 💪 У тебя ещё есть время, чтобы попасть на один из наших курсов и стать фронтенд-разработчиком 🤓

👉 13 июня стартует следующий поток буткемпа. Это интенсивный трёхмесячный курс, где ты занимаешься каждый день — в школе в центре Петербурга или онлайн из любого удобного места. Записывайся — https://saintcode.ru/?utm_source=telegram_direct&utm_medium=post&utm_campaign=organic_social&utm_content=lastcalljune2023

👉 15 июня стартует первый поток вечернего онлайн-курса. Это новый продукт: за основу мы взяли программу буткемпа, только идёт этот курс 9 месяцев. Здесь ты учишься онлайн и можешь стать веб-разработчиком, продолжая работать на основной работе. Записывайся — https://saintcode.ru/eveningcourse/?utm_source=telegram_direct&utm_medium=post&utm_campaign=organic_social&utm_content=lastcalljune2023

Помнишь, как работает оператор typeof в JavaScript?

Давай проверим — укажи, какое значение вернётся в консоль, если мы запустим этот код 👩‍💻

Люди интересуются буткемпом и спрашивают: «А гарантируете ли вы трудоустройство?». Мы отвечаем: нет, не гарантируем.

Более того — компании, которые дают такие обещания, бросают слова на ветер 👎

Первая проблема в том, что никто не может отвечать за результат твоего обучения. Все приходят с разным бэкграундом, с разной мотивацией и обучаются тоже по-разному. Кто-то выполняет только основные задания и идёт отдыхать, а кто-то подхватывает нашу одержимость программированием и кодит буквально 24/7. Как думаешь, у кого больше шансов найти работу?

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

Так что гарантии трудоустройства — это миф. Вот как мы помогаем приблизиться к первой работе в IT:

👌 Не завышаем ожидания. Работу найти непросто, после курса наши выпускники тратят в среднем по 2–3 месяца, чтобы устроиться. Зарплаты совсем ещё зелёных джунов от 100 тыс. — большая редкость, на начальном этапе нужно работать ради опыта, с оплатой в районе 40–60 тыс. руб.

👌 Помогаем после окончания курса. Да, целая неделя программы посвящена карьерной подготовке: поиску вакансий, написанию резюме и сопроводительных писем, прохождению собесов. Но ты можешь обратиться за советом и после выпуска, а некоторых сильных студентов мы рекомендуем дружественным компаниям, если они ищут джунов.

👌 Даём возможность выполнить первый коммерческий проект. У нас есть веб-студия при школе, где новички решают реальные задачи под присмотром более опытных разрабов и получают первые деньги за код. Опять же, всех мы взять не можем — надо проявить себя во время обучения.

Хочешь, чтобы всё было прозрачно и без уловок? Оставь заявку и стань программистом вместе с SaintCode Bootcamp — https://saintcode.ru/?utm_source=telegram_nondirect&utm_medium=post&utm_campaign=organic_social&utm_content=noguarantee 💚

Освежим знания о разметке HTML? 👨‍🏫

Посмотри на картинку и ответь, какой из перечисленных элементов является строчным.

Только начинаешь смотреть в сторону первого языка программирования? 👀

Попробуй JavaScript — он довольно дружелюбный к новичкам, с сильным сообществом и множеством бесплатных материалов для изучения 🔥

Один из таких бесплатных продуктов — подготовительная программа SaintCode Bootcamp, которая плавно погрузит тебя в основы JS. Она рассчитана примерно на 20 часов времени и написана опытным практикующим программистом.

Главное отличие нашей программы в том, что ты не пытаешься сходу осваивать сложные концепции, а сразу начинаешь кодить в консоли браузера. Тебе даже не нужно знать вёрстку HTML/CSS — она при прохождении подготовительной программы не понадобится.

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

Посмотреть подготовительную программу — https://saintcode.ru/podgotovitelnaya-programma-po-javanoscript ✅

Давай разберём базовые способы хранения данных в браузере — новички часто путаются в этих технологиях, а работодатели любят задавать вопрос про разницу между ними на интервью 🤓

👉 Запомни важный момент, который касается всех способов: Cookies, Local Storage и Session Storage хранят данные на стороне клиента в формате «ключ-значение» и оба этих параметра могут быть только строками.

👉 Ещё одна интересная деталь: локальное и сессионное хранилище относятся к встроенному в браузер API Web Storage — это просто два варианта его реализации.

Теперь по отдельности о каждом из них:

🔧 Куки хранятся в браузере и устанавливаются сервером через заголовок Set-Cookie. То есть клиент и сервер обмениваются заголовками и данные остаются с обеих сторон — это главное отличие технологии от локального и сессионного хранилища.

Чаще всего куки используются, чтобы хранить данные об авторизации пользователя, иногда они отслеживают действия на сайте.

Срок хранения устанавливается вручную — это может быть одна конкретная сессия, неделя или месяц.

Ёмкость куки для одного домена небольшая — всего 4 КБ. Доступность не зависит от вкладки или окна.

🔧 Локальное хранилище может хранить данные только на стороне клиента, они никогда не попадут на сервер.

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

Формально у Local Storage нет срока хранения, но при переполнении современные браузеры сами очищают его.

Ёмкость локального хранилища довольно большая — 5 МБ. Доступность не зависит от вкладки или окна.

🔧 Сессионное хранилище тоже занимает до 5 МБ. Оно работает примерно так же, как и локальное — но только в пределах одной сессии и одной вкладки. То есть если ты закроешь вкладку или перезапустишь браузер, данные не сохранятся. Простой пример — это сохранённые поля в форме в рамках одной сессии пользователя.

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