💻 АЙТИ ЧЕЛЛЕНДЖ: первые шаги к доходу

3️⃣0️⃣ дней подряд я буду вливаться в IT:

учёба, практика, код,🥶

создание проектов,💪

и главное — первые попытки выйти на доход.🔥

❌ В конце — ДЕНЬ X.
Это не просто финал, а момент проверки: получилось ли за месяц хотя бы попробовать заработать первые деньги в IT.

Я не жду лёгких денег. Но хочу проверить: реально ли с нуля за 30 дней выйти на первые доходы в программировании.

🔥 Попробую — и посмотрим, что из этого выйдет.

🔑 Основная идея

Git нужен, чтобы несколько человек могли работать над одним проектом, не затирая изменения друг друга. Каждый работает в своей ветке, а потом изменения объединяются в основную (обычно main или master).

🛠 Как работать в команде с Git

Склонировать репозиторий

git clone <ссылка-на-репозиторий>
cd <папка-проекта>

Создать свою ветку (под задачу/фичу/исправление):

git checkout -b feature/моя-фича

Сделать изменения и закоммитить

git add .
git commit -m "Добавил мою фичу"

Отправить ветку на сервер (GitHub/GitLab)

git push origin feature/моя-фича

Создать Pull Request (PR)

На GitHub/GitLab открываешь PR из своей ветки в main.

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

Обновлять свою ветку (чтобы не было отставания от основной):

git checkout main
git pull origin main
git checkout feature/моя-фича
git merge main

👥 Полезные правила для команды

Одна ветка = одна задача.

Коммить и пушь почаще.

Делай код-ревью коллег.

Конфликты (если два человека меняли один и тот же участок кода) решаются вручную перед слиянием.

Ну что, просыпаемся после долгой спячки? 😴
Пора снова вкататься в IT, разгонять мозги кодом и, конечно, не забывать про наши любимые мемасики 💻😂

📁 Идеальная структура папок во Frontend-проекте (React Edition) ⚡️

Если у тебя в проекте всё свалено в одну кучу — самое время навести порядок 😎
Вот пример чистой, продуманной структуры:

my-react-app/ 
│
├── 📁 public/
│   └── index.html
│
├── 📁 src/
│   ├── 📁 assets/          # картинки, иконки, шрифты, фоновые фото
│   │   └── logo.png
│   │
│   ├── 📁 components/      # переиспользуемые компоненты (Navbar, Button, Card и т.д.)
│   │   ├── Navbar.jsx
│   │   └── Footer.jsx
│   │
│   ├── 📁 pages/           # страницы (для роутера)
│   │   ├── Home.jsx
│   │   ├── About.jsx
│   │   └── Contact.jsx
│   │
│   ├── 📁 hooks/           # кастомные хуки (например, useTheme, useFetch)
│   │   └── useTheme.js
│   │
│   ├── 📁 utils/           # вспомогательные функции
│   │   └── formatDate.js
│   │
│   ├── 📁 styles/          # отдельные css-файлы (если не используешь tailwind)
│   │   └── global.css
│   │
│   ├── App.jsx             # главный компонент приложения
│   ├── main.jsx            # точка входа (ReactDOM.render)
│   └── router.jsx          # (опционально) отдельный файл для маршрутов
│
├── package.json
└── vite.config.js          # если используешь Vite

🧠 Совет: держи код чистым — и проект станет в 2 раза приятнее развивать.

Всем добрый день!
Сегодня разберём первый урок на LeetCode во вкладке 30 Days of JavaScript.

🧠 Задание:
Создай функцию createHelloWorld, которая всегда возвращает строку "Hello World".

💬 Пример:

const f = createHelloWorld();
f(); // "Hello World"
f(1, 2, 3); // "Hello World"

✅ Решение (через стрелочную функцию):

/**
 * @return {Function}
 */
const createHelloWorld = () => {
  return function() {
    return "Hello World";
  };
};

const f = createHelloWorld();
console.log(f('1,2,3')); // "Hello World"

**📖 Объяснение:**
createHelloWorld возвращает другую функцию.
Когда ты вызываешь f = createHelloWorld(), переменная f становится функцией, которая всегда возвращает "Hello World", независимо от переданных аргументов.

f(); // "Hello World"
f(999); // "Hello World"

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

Вторая задания LeetCode во вкладке 30 Days of JavaScript.

🧠 Задание:
Создай функцию createCounter, которая принимает число n и возвращает другую функцию.
Каждый раз при вызове этой функции значение должно увеличиваться на 1.

💬 Пример:

const counter = createCounter(10);
console.log(counter()); // 10
console.log(counter()); // 11
console.log(counter()); // 12

✅ Решение:

var createCounter = function(n) {
  return function() {
    return n++;
  };
};

📖 Объяснение:
Функция createCounter создаёт замыкание — внутреннюю функцию, которая “помнит” значение n.
Каждый раз при вызове counter() она:

возвращает текущее значение n;

увеличивает его на 1.

Таким образом, при каждом вызове значение растёт:

10
11
12

————————————————
💡 Интересный факт:
Счётчик не растёт бесконечно сам по себе — он изменяется только тогда, когда ты вызываешь counter().
Это отличный пример того, как в JavaScript работают замыкания и сохранение состояния между вызовами.

Привет хотел рассказать. 💻 Как работает интернет изнутри — от запроса в браузере до загрузки сайта.

💻 Как работает интернет изнутри

Ты открываешь браузер. Пишешь:
google.com
и нажимаешь Enter.
Простое действие, да?
Но за ним — цепочка технологий, работающих быстрее, чем ты моргнёшь.

🔹 DNS — телефонная книга интернета
Браузеру нужно понять, где находится “google.com”.
Он обращается к DNS — системе, которая переводит имя сайта в IP-адрес:
google.com → 142.250.187.78

🔹 Запрос уходит в путешествие
Теперь браузер знает, куда идти.
Он создаёт HTTP-запрос и отправляет его по маршрутизаторам, серверам и кабелям — даже под океаном 🌊
Каждый сервер просто передаёт пакет дальше, пока тот не доберётся до цели.

🔹 Сервер отвечает
Когда запрос доходит до сервера Google, тот собирает страницу (HTML, CSS, JS) и отправляет её обратно.

🔹 Браузер строит сайт
HTML задаёт структуру,
CSS делает красиво,
JS добавляет жизнь.
И всё это рендерится прямо у тебя на экране.

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

Сейчас я расскажу о создании Яндекса✍️

🇷🇺 Как появился Яндекс

Год основания: 1997
Основатели: Аркадий Волож и Илья Сегалович.

Но всё началось гораздо раньше.

🧠 1980-е — идея поисковой системы

Аркадий Волож и Илья Сегалович работали вместе в компании «Аркадия», которая занималась обработкой больших текстов и поиском информации по смыслу.
Они придумали технологию, способную понимать морфологию русского языка — то есть искать слова по смыслу, а не только по буквам. Например, находить “бег”, “бежал”, “бегать” как одно и то же слово.

Эта технология позже стала основой Яндекса.

🚀 1997 — запуск Yandex.ru

В июне 1997 года запустился сайт yandex.ru — название расшифровывалось как Yet Another iNDEXer (ещё один индексатор).
Тогда в России уже существовали поисковики вроде Rambler, но Яндекс быстро стал отличаться качеством поиска. Он умел “понимать” русский язык лучше всех.

💼 2000-е — рост и инновации

В 2000-х Яндекс начал активно развиваться:

Запустили Яндекс.Карты, Яндекс.Почту, Яндекс.Новости.

Создали Яндекс.Директ — систему контекстной рекламы (аналог Google Ads).

Вышли на IPO (стали публичной компанией) в 2011 году на NASDAQ — и стали первой российской IT-компанией, котирующейся в США.

🧩 Что делает Яндекс уникальным

Собственные алгоритмы машинного обучения (например, MatrixNet, CatBoost).

Развитие искусственного интеллекта: Алиса, самоуправляемые машины, ЯндексGPT, Яндекс.Музыка и даже Яндекс.Еда.

У них целая экосистема сервисов, объединённых одним аккаунтом — как Google, только на русском рынке.

💬 Факт напоследок:

Яндекс до сих пор считается одной из немногих компаний в мире, которая смогла реально конкурировать с Google на своём рынке.
В России он долго держал более 50% рынка поиска.

Я ещё многое не рассказал и не показал, потому что эту компанию невозможно объяснить только текстом. Но я постарался кратко показать и объяснить, кто они такие.

💭 JavaScript или TypeScript — что выбрать?

JavaScript — это сердце фронтенда.
Он живой, динамичный и позволяет писать код как душе угодно.
Но эта свобода — и blessing, и curse одновременно.

JS прощает ошибки. Иногда слишком.
Один неверный тип — и привет, баги, undefined, NaN и прочие сюрпризы.

А вот TypeScript — как строгий наставник.
Он говорит: «Ты уверен, что user не null? А что это за тип?».
И не даст запустить проект, пока всё не будет под контролем.

🟡 JavaScript:

Прост в начале

Быстро запускается

Не требует настроек

🔵 TypeScript:

Помогает избежать ошибок ещё до запуска

Даёт автоподсказки и понятную структуру

Учит писать «чистый» код

⚖️ JS — свобода. TS — безопасность.
Но главное — они не враги.
TypeScript — это всего лишь JavaScript, но с бронёй.

🚀 Начни с JS, чтобы понять суть.
А когда почувствуешь уверенность — надень доспехи и переходи на TS.

HTML and CSS

🧱 Фаза 1: база и уверенность

С 26 октября начинаю укреплять основу — HTML, CSS и немного JS.
Хочу, чтобы верстка летела из головы без подсказок.

📅 Недели 1-2: чисто верстка.
Каждый день беру по маленькому макету с Figma или Codewell.
Тренирую flex, grid, адаптив и позиционирование.

🎯 Цель — собрать свой первый лендинг, возможно, портфолио.

Меньше теории, больше действий.

🔥 Зачем я это делаю?

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

Давайте поговорим об архитектуре фронтенда

🧱 Классическая архитектура (Без- Архитектуры)

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

📁 pages
Здесь лежат страницы приложения

📁 components
Содержит переиспользуемые компоненты, но со временем превращается в «свалку», где смешиваются разные части приложения. ✅

📁 api
Файлы для работы с сервером

📁 helpers
Вспомогательные функции, которые упрощают код.
Например: форматирование даты, работа с числами, проверка полей и т.п.

📁 store
Хранилище состояния приложения (например, Redux или Zustand).


📁 hooks
Папка с React-хуками

📁 assets
Здесь лежат изображения, иконки, шрифты и стили.