REST API

REST API (представительский интерфейс передачи состояний) – это стандарт взаимодействия программ и сервисов через HTTP-запросы, играющий важную роль в веб-разработке.

Основные концепции:

Ресурсы и URL: REST API оперирует понятием "ресурсов" (данные или функции), каждый из которых идентифицируется уникальным URL.

HTTP-методы: Взаимодействие с ресурсами осуществляется стандартными методами: GET для получения данных, POST для создания, PUT для обновления и DELETE для удаления.

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

Преимущества REST API:

Универсальность: Может использоваться в любых приложениях, способных отправлять HTTP-запросы.

Простота использования: Интуитивно понятен благодаря стандартным HTTP-методам.

Масштабируемость: Отсутствие сохранения состояния сервером обеспечивает лучшую масштабируемость.

REST API облегчает интеграцию различных веб-сервисов и приложений, предлагая гибкость и эффективность в создании веб-решений.

#restapi #api

Сериализация в JavaScript

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

const user = {
  name: "Иван",
  age: 30
};

JSON.stringify(user);
// Результат: '{"name":"Иван","age":30}'

Зачем нужна сериализация?

- Передавать данные между клиентом (браузером) и сервером.

- Сохранять состояние объекта в базе данных или файле.

- Поддерживать формат, совместимый с множеством языков программирования и платформ.

Десериализация

Это обратный процесс, при котором строка в формате JSON преобразуется обратно в объект JavaScript. Для этого используется метод

JSON.parse(serializedUser);
// Воссоздаем объект: { name: "Иван", age: 30 }

#JavaScript

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

Если у кого-то есть премиум, то можно проголосовать😎

Сегодня встал рано чтобы добить курс по html. С 7 утра на ногах. Нужно уже восстанавливать режим👌🏻

https://news.1rj.ru/str/reactify_IT?boost

Элементы section, aside, и article

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

Элемент section:

Этот элемент используется для группирования смыслового содержания на веб-странице. Каждый section должен сосредотачиваться на отдельной теме или группе тем, которые логически связаны между собой.

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

Элемент aside:

Этот элемент предназначен для контента, который косвенно связан с основным содержимым страницы. Это может быть боковая панель, объявления, группа ссылок на похожие темы и так далее.

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

Элемент article:

Элемент article используется для обертывания независимого, самодостаточного контента, который можно перенести в другой контекст, не потеряв смысл. Это может быть статья, блог-пост, комментарий, форумное сообщение и т.д.

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

#html

Способы преобразования строки в число в JavaScript

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

1️⃣ parseInt()

Функция parseInt() анализирует строку и возвращает целое число. Она принимает два аргумента: строку для преобразования и основание системы счисления (опционально, по умолчанию 10).

let str = "123";
let num = parseInt(str, 10); // 123

2️⃣ parseFloat()

Функция parseFloat() анализирует строку и возвращает число с плавающей точкой. Она отличается от parseInt() тем, что может обрабатывать дробные числа.

let str = "123.45";
let num = parseFloat(str); // 123.45

3️⃣ Унарный плюс (+)

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

let str = "123";
let num = +str; // 123

let floatStr = "123.45";
let floatNum = +floatStr; // 123.45

4️⃣ Number()

Функция Number() преобразует значение к числовому типу. Если значение не может быть преобразовано в число, она вернет NaN.

let str = "123";
let num = Number(str); // 123

let notANumber = "abc";
let result = Number(notANumber); // NaN

5️⃣ Оператор двойного тильды (~~)

Оператор двойного тильды ~~ является битовым оператором, который эффективно усекает дробную часть числа, аналогично Math.floor(), но быстрее. Он полезен, когда вам нужно преобразовать строку в целое число.

let str = "123.45";
let num = ~~str; // 123

6️⃣ Умножение на 1

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

let str = "123";
let num = str * 1; // 123

let floatStr = "123.45";
let floatNum = floatStr * 1; // 123.45

#JavaScript #string #number

Как у вас прошел первый рабочий день в году?

У меня он начался с раннего подъема в 6:00 и похода в тренажерный зал, после него уже сел работать, еще бросил кофе💪

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

В первый день восстановил режим, потерянный 3 месяца назад😅
Все, теперь становлюсь опять супер продуктивным.

Курс по HTML добавил в Reactify Academy. Осталось настроить до конца платформу. Вот вот появится "Убийца платных курсов"🤞😁

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

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

Всем привет! Мало кто знает, что у нас еще есть чат. Если у вас возникли вопросы, проблемы, вы можете писать туда.

Разрешено общение не только на технические темы. Если вам есть, чем поделиться то смело пишите. Если вы хотите поболтать, обсудить что-нибудь - пишите.

Если у вас есть предложения, советы по контенту - пишите.

Reactify Community

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

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

#programming #patterns

Что такое ECMAScript?

ECMAScript, часто сокращенно ES, является стандартом, на котором основан JavaScript. Это спецификация, определяющая стандарты для скриптовых языков, включая синтаксис, типы данных, операторы, объекты и методы.

История и Развитие

🔹1997 год, ECMAScript 1: Первая версия стандарта, выпущенная после того, как Netscape передала JavaScript в Ecma International для стандартизации.

🔹1998-2000 годы: Выпуск ES2 и ES3, привносящие некоторые улучшения и нововведения.

🔹ES4: Предлагалось множество изменений, но в итоге эта версия так и не была принята из-за разногласий между членами комитета.

🔹2009 год, ECMAScript 5 (ES5): Ввел строгий режим ('use strict'), а также некоторые улучшения в объектной модели и API.

🔹2015 год, ECMAScript 2015 (ES6): Один из самых значительных выпусков, внесший классы, модули, стрелочные функции, шаблонные строки, и многое другое. Эта версия часто называется ES6.

🔹После 2015 года: Переход к ежегодному циклу выпуска, с добавлением новых функций в каждой версии (ES2016, ES2017, и т.д.).

Значение для JavaScript

1️⃣ Стандартизация: ECMAScript обеспечивает стандартизацию JavaScript, что важно для обеспечения совместимости кода на различных платформах и браузерах.

2️⃣ Современные возможности: Новые версии ECMAScript вводят улучшения и новые возможности, которые делают JavaScript более мощным, гибким и удобным в использовании.

3️⃣ Совместимость: Благодаря стандартизации ECMAScript, разработчики могут быть уверены, что их код будет работать в разных средах исполнения.

#ecmanoscript

Важность практики

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

Этот процесс можно сравнить с эволюцией. Хотя я не создавал полноценный фреймворк, я разработал набор удобных функций и методов, аналогичных тем, которые используются в фреймворках. Это не было чем-то столь масштабным, как React или Vue, ведь эти фреймворки разрабатываются большими командами опытных разработчиков. Но мои разработки представляли собой некое подобие фреймворка, скромное, но важное достижение для меня.

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

https://academy.reactify.ru/

Готовность на 99%

Тестирую доступность, как выглядит для гостя/ученика.

Думаю завтра открою доступ. Переживаю, что курс не достаточно хороший😬 Синдром самозванца называется?😅

Буду дорабатывать постоянно, доводить до совершенства, жду обратную связь

Лучше заходить с компьютера

React Новостям БЫТЬ!

Но пока что — раз в месяц. Я подумал, что для того чтобы добавить Redux/Router в приложение, не нужно сначала писать курс по этой технологии.

Всё-таки, "React Новости" — это, прежде всего, практика. Так что через неделю начну записывать новое видео.

Reactify Academy запуск

Официально Академия запущенна для всех желающих. На данный момент там есть один курс по HTML. Я буду активно расширять и добавлять курсы. Так же буду добавлять мини курсы/статьи. Будет интересно.

Хочу еще раз отметить, платформу разрабатывал не я. Это готовый шаблон/конструктор. Открытый проект, которым пользуются различные учебные заведения. Написание своего сайта для курсов задача сложная. Для нее нужна как минимум команда. Я же развернул на своем сервере и настроил уже готовую платформу, добавив в нее изменения, плагины, настройки, темы и тд.

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

Все курсы в Академии будут бесплатными. Помимо курсов будут различные ивенты, соревнования, экзамены и тесты. Это и многое другое будем внедрять постепенно. Там много всего интересного в теории можно добавить.

Жду предложения, советы, найденные ошибки от вас. Но в самом курсе, функциональности. За интерфейс и верстку я не отвечаю.

#academy

Награды

Так же самые активные будут получать награды. В каждом курсе будут значки и сертификаты за прохождение.

Кто первый получит Сапфировый значок, я проведу экзамен по HTML!

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

Будет много наград, в том числе:

- личные созвоны
- менторинг
- тестирование

И многое другое

#academy

React Signals

Совсем недавно перешел на рабочем проекте с Redux на Signals. Первое впечатление - Очень удобно и легко.

Что мне понравилось?

1️⃣ Легко освоить. React Signals отличаются простотой как в освоении, так и в использовании, особенно по сравнению с Redux. Redux требует понимания сложных концепций, таких как редьюсеры, миддлвары и хранилище (store), в то время как Signals предлагает более прямолинейный и декларативный подход.

2️⃣ Меньше кода. Redux часто критикуют за "шаблонность" и избыточность кода. Для каждого действия необходимо создавать отдельные редьюсеры и экшены, что может привести к увеличению объема кода. Signals же позволяют управлять состоянием напрямую, без необходимости в дополнительных конструкциях, что уменьшает количество кода и повышает его читаемость.

3️⃣ Оптимизация. Signals обеспечивают более эффективное обновление состояния. В Redux, изменение в хранилище может привести к перерисовке всех подключенных компонентов, даже если изменение их не касается. Signals позволяют компонентам подписываться только на те изменения состояния, которые им реально необходимы

4️⃣ Гибкая архитектура. Signals позволяют создавать более модульные и гибкие архитектуры приложений. В Redux, глобальное хранилище означает, что все состояние приложения централизовано, что может быть не всегда оптимально для больших и сложных приложений. Signals же позволяют локально управлять состоянием в контексте отдельных компонентов, что обеспечивает более гранулярный контроль и упрощает масштабирование приложений.

5️⃣ Управление побочными эффектами. В Redux для управления побочными эффектами часто используется дополнительный инструмент, такой как Redux-Saga или Redux-Thunk. Это усложняет архитектуру и увеличивает сложность кода. В случае с Signals, управление побочными эффектами может быть более интегрированным и простым, что упрощает создание и поддержку сложных приложений.

Ставлю жирный лайк Signals. А вы использовали в своих проектах?

#react #signals #state

Reactify Teams

Приблизительно к концу месяца начнется разработка совместного проекта в командах. А сейчас начинается подготовка.

Этапы:

1️⃣ Сбор заявок. Заполнение формы для участия в проекте.

2️⃣ Отбор. Просмотр заявок. Проведение небольших собеседований.

3️⃣ Формирование команды. Создание чата, знакомство участников. Подключение всех участников к Yandex Tracker, GitHub и другим сервисам/инструментам

4️⃣ Выбор проекта. Совместно выбираем идею для проекта

5️⃣ Распределение ролей. Решаем кто какую часть будет разрабатывать и тд.

6️⃣ Подготовка проекта. Настраиваем репозитории, конфигурации проектов, выбираем стек технологий, структуру проектов, архитектуру, инструменты, дизайн и тд

7️⃣ Начала разработки.

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

Это тестовые команды. Если все пройдет хорошо, то в начале февраля начнется сбор еще 1-2, а может и больше команд.

#teams