Persistent Bugger
Напишите функцию persistence, которая принимает положительный параметр num и возвращает его мультипликативную стойкость, то есть количество раз, которое нужно перемножить цифры в num, пока не получится одна цифра.
Пример:
👉 @seniorFront
Напишите функцию persistence, которая принимает положительный параметр num и возвращает его мультипликативную стойкость, то есть количество раз, которое нужно перемножить цифры в num, пока не получится одна цифра.
Пример:
39 --> 3 (because 3*9 = 27, 2*7 = 14, 1*4 = 4 )
999 --> 4 (because 9*9*9 = 729, 7*2*9 = 126, 1*2*6 = 12, 1*2 = 2)👉 @seniorFront
👍4❤1
Какие архитектурные решения для React вы знаете?
Существует несколько архитектурных решений и паттернов для построения React-проектов. Вот некоторые из них:
MVC (Model-View-Controller) — это традиционный архитектурный шаблон, который разделяет приложение на три основных компонента — модель, представление и контроллер. React можно использовать на уровне View для рендеринга пользовательского интерфейса, в то время как другие библиотеки или фреймворки могут быть использованы для уровней Model и Controller.
Flux — это архитектура приложений, представленная специально для приложений React. Он следует однонаправленному потоку данных, в котором данные передаются в одном направлении, что упрощает понимание и отладку изменений состояния приложения.
Atomic Design — не является специфичным для React, а представляет собой методологию проектирования, которая делит пользовательский интерфейс на более мелкие, многократно используемые компоненты. Он поощряет создание небольших, самодостаточных компонентов, которые могут быть скомпонованы для создания более сложных пользовательских интерфейсов.
Шаблон контейнера и компонента — отделяет представление (Component) от логики и управления состоянием (Container). Компоненты отвечают за рендеринг пользовательского интерфейса, в то время как контейнеры обрабатывают бизнес-логику и управление состоянием.
Feature-Sliced Design — Это современный архитектурный подход, используемый для организации и структурирования приложений React. Он направлен на решение проблем масштабируемости, удобства обслуживания и повторного использования путем разделения кодовой базы приложения на основе функций или модулей.
👉 @seniorFront
Существует несколько архитектурных решений и паттернов для построения React-проектов. Вот некоторые из них:
MVC (Model-View-Controller) — это традиционный архитектурный шаблон, который разделяет приложение на три основных компонента — модель, представление и контроллер. React можно использовать на уровне View для рендеринга пользовательского интерфейса, в то время как другие библиотеки или фреймворки могут быть использованы для уровней Model и Controller.
Flux — это архитектура приложений, представленная специально для приложений React. Он следует однонаправленному потоку данных, в котором данные передаются в одном направлении, что упрощает понимание и отладку изменений состояния приложения.
Atomic Design — не является специфичным для React, а представляет собой методологию проектирования, которая делит пользовательский интерфейс на более мелкие, многократно используемые компоненты. Он поощряет создание небольших, самодостаточных компонентов, которые могут быть скомпонованы для создания более сложных пользовательских интерфейсов.
Шаблон контейнера и компонента — отделяет представление (Component) от логики и управления состоянием (Container). Компоненты отвечают за рендеринг пользовательского интерфейса, в то время как контейнеры обрабатывают бизнес-логику и управление состоянием.
Feature-Sliced Design — Это современный архитектурный подход, используемый для организации и структурирования приложений React. Он направлен на решение проблем масштабируемости, удобства обслуживания и повторного использования путем разделения кодовой базы приложения на основе функций или модулей.
👉 @seniorFront
🔥14👍7❤4👎1😐1
Media is too big
VIEW IN TELEGRAM
👍8🔥2👎1😁1💯1
Простой саботаж в мире ПО
В кульминационный момент Второй мировой войны ЦРУ выпустило потрясающую книгу Simple Sabotage. В ней изложены различные способы, которыми диверсанты могут снижать продуктивность компании. Некоторые из этих советов не стареют, например, раздел «Общие помехи организациям и производству»:
1. Настаивайте на том, чтобы всё выполнялось через «каналы». Не допускайте того, чтобы для ускорения реализации решений выбирались кратчайшие пути.
2. Делайте «доклады». Говорите как можно чаще и пространнее. Иллюстрируйте свои «идеи» долгими историями из жизни и ссылайтесь на личный опыт. С готовностью делайте «патриотические» комментарии.
3. По возможности отправляйте все вопросы в комитеты для «более глубокого изучения и рассмотрения». Стремитесь собирать комитеты как можно больше, не менее чем из пяти членов.
4. Как можно чаще поднимайте вопросы о несущественных проблемах.
5. Спорьте о чётких формулировках в общении, протоколах, резолюциях.
6. Возвращайтесь к темам, по которым было принято решение на последнем совещании, и пытайтесь повторно открыть вопрос о целесообразности этого решения.
7. Советуйте «быть аккуратными». Будьте «разумны» и подталкивайте других участников совещаний к «разумности», к тому, чтобы они избегали спешки, которая может в будущем вызвать неудобства или сложности.
8. Беспокойтесь о правильности каждого решения, поднимайте вопрос о том, будет ли рассматриваемое действие относиться к юрисдикции группы или оно может вызвать конфликт с политикой какого-то более высокого эшелона.
👉 @seniorFront
В кульминационный момент Второй мировой войны ЦРУ выпустило потрясающую книгу Simple Sabotage. В ней изложены различные способы, которыми диверсанты могут снижать продуктивность компании. Некоторые из этих советов не стареют, например, раздел «Общие помехи организациям и производству»:
1. Настаивайте на том, чтобы всё выполнялось через «каналы». Не допускайте того, чтобы для ускорения реализации решений выбирались кратчайшие пути.
2. Делайте «доклады». Говорите как можно чаще и пространнее. Иллюстрируйте свои «идеи» долгими историями из жизни и ссылайтесь на личный опыт. С готовностью делайте «патриотические» комментарии.
3. По возможности отправляйте все вопросы в комитеты для «более глубокого изучения и рассмотрения». Стремитесь собирать комитеты как можно больше, не менее чем из пяти членов.
4. Как можно чаще поднимайте вопросы о несущественных проблемах.
5. Спорьте о чётких формулировках в общении, протоколах, резолюциях.
6. Возвращайтесь к темам, по которым было принято решение на последнем совещании, и пытайтесь повторно открыть вопрос о целесообразности этого решения.
7. Советуйте «быть аккуратными». Будьте «разумны» и подталкивайте других участников совещаний к «разумности», к тому, чтобы они избегали спешки, которая может в будущем вызвать неудобства или сложности.
8. Беспокойтесь о правильности каждого решения, поднимайте вопрос о том, будет ли рассматриваемое действие относиться к юрисдикции группы или оно может вызвать конфликт с политикой какого-то более высокого эшелона.
👉 @seniorFront
👍9😁4❤3😐3👎2💯1🤨1
This media is not supported in your browser
VIEW IN TELEGRAM
border animation on hover
Создано на HTML и CSS. Граница сделана при помощи псевдо-элементов.
👉 @seniorFront
Создано на HTML и CSS. Граница сделана при помощи псевдо-элементов.
👉 @seniorFront
🔥22👍3❤1
Какая из функций CSS transform используется для изменения размеров элемента?
Anonymous Quiz
8%
matrix()
7%
perspective()
85%
scale()
👍13
Media is too big
VIEW IN TELEGRAM
2024 Modern Buttons
В этом видео создаются кнопки с оригинальным эффектом при наведении. В JS создана логика изменения значений CSS переменных в зависимости от положения курсора пользователя.
👉 @seniorFront
В этом видео создаются кнопки с оригинальным эффектом при наведении. В JS создана логика изменения значений CSS переменных в зависимости от положения курсора пользователя.
👉 @seniorFront
🔥12👎2🤨2😐2👍1🤔1
This media is not supported in your browser
VIEW IN TELEGRAM
Threads ticket with Hologram Effect
Вёрстка реализована на HTML и CSS. Анимировано библиотекой gsap.
👉 @seniorFront
Вёрстка реализована на HTML и CSS. Анимировано библиотекой gsap.
👉 @seniorFront
👍5❤1🔥1
Пагинатор
Допишите класс PaginationHelper, который является “помощником” для организации пагинации (разбивка данных из массива на страницы для оптимизации загрузки).
Класс должен принимать массив любых данных (тип данных не имеет значения) и количество данных, отображаемых на одной странице.
Необходимо дописать 4 метода:
👉 @seniorFront
Допишите класс PaginationHelper, который является “помощником” для организации пагинации (разбивка данных из массива на страницы для оптимизации загрузки).
Класс должен принимать массив любых данных (тип данных не имеет значения) и количество данных, отображаемых на одной странице.
Необходимо дописать 4 метода:
.pageCount() - возвращает количество страниц.itemCount() - возвращает количество элементов.pageItemCount({page}) - возвращает количество элементов на странице под номером page .pageIndex({index}) - возвращает страницу, на которой располагается элемент с индексом index (номер страницы начинается с 0)👉 @seniorFront
👍7❤1👏1😐1
Что такое SSR (рендеринг на стороне сервера)?
Серверная визуализация (SSR) — это метод, используемый для рендеринга страниц на сервере и отправки полностью визуализированной страницы клиенту для отображения. Он позволяет серверу генерировать полную HTML-разметку веб-страницы, включая ее динамическое содержимое, и отправлять ее клиенту в качестве ответа на запрос.
При традиционном подходе к рендерингу на стороне клиента клиент получает минимальную HTML-страницу, а затем делает дополнительные запросы к серверу за данными и ресурсами, которые используются для рендеринга страницы на стороне клиента. Это может привести к замедлению начальной загрузки страницы и негативно повлиять на поисковую оптимизацию (SEO), поскольку поисковые роботы испытывают трудности с индексированием контента на основе JavaScript.
При использовании SSR сервер заботится о рендеринге веб-страницы, выполняя необходимый код JavaScript для создания окончательного HTML-кода. Это означает, что клиент получает полностью отрисованную страницу с сервера, что снижает потребность в дополнительных запросах ресурсов. SSR улучшает время начальной загрузки страницы и позволяет поисковым системам легко индексировать контент, что приводит к улучшению SEO.
SSR обычно используется в фреймворках и библиотеках, таких как Next.js для React и Nuxt.js для Vue.js, для обеспечения возможностей рендеринга на стороне сервера. Эти платформы обрабатывают логику рендеринга на стороне сервера, упрощая реализацию SSR.
👉 @seniorFront
Серверная визуализация (SSR) — это метод, используемый для рендеринга страниц на сервере и отправки полностью визуализированной страницы клиенту для отображения. Он позволяет серверу генерировать полную HTML-разметку веб-страницы, включая ее динамическое содержимое, и отправлять ее клиенту в качестве ответа на запрос.
При традиционном подходе к рендерингу на стороне клиента клиент получает минимальную HTML-страницу, а затем делает дополнительные запросы к серверу за данными и ресурсами, которые используются для рендеринга страницы на стороне клиента. Это может привести к замедлению начальной загрузки страницы и негативно повлиять на поисковую оптимизацию (SEO), поскольку поисковые роботы испытывают трудности с индексированием контента на основе JavaScript.
При использовании SSR сервер заботится о рендеринге веб-страницы, выполняя необходимый код JavaScript для создания окончательного HTML-кода. Это означает, что клиент получает полностью отрисованную страницу с сервера, что снижает потребность в дополнительных запросах ресурсов. SSR улучшает время начальной загрузки страницы и позволяет поисковым системам легко индексировать контент, что приводит к улучшению SEO.
SSR обычно используется в фреймворках и библиотеках, таких как Next.js для React и Nuxt.js для Vue.js, для обеспечения возможностей рендеринга на стороне сервера. Эти платформы обрабатывают логику рендеринга на стороне сервера, упрощая реализацию SSR.
👉 @seniorFront
👍10❤2
Техники обучения, которые вошли в мою рутину
Как и любому программисту, мне приходится учить большие объемы материала с целью повышения квалификации или прохождения интервью. Здесь я опишу способы, которые я использую для упорядочивания и запоминания материала.
Оглавление
Для меня все начинается с составления плана обучения. Это просто список тем, которые я хочу изучить. Он позволяет мне оценить время, требуемое для изучения; отсортировать темы; приоритизировать их; увидеть зависимости между ними.
Подготовка
На день для изучения выбираю две темы. Обычно я стараюсь перемежать теорию с более практической задачей. Это позволяет мне отдохнуть от теории и переключиться. Я беру именно несколько тем для изучения и когда осознаю, что поняла материал, переключаюсь на другую тему. Я не пытаюсь сразу выучить всё, чтоб "от зубов отскакивало", для этого нужно время, чтобы материал уложился в голове. Главная идея откладывания в том, чтобы дать это время.
Чтение и конспект
Во время чтения я подчеркиваю или выписываю ключевые слова. Я не выделяю определения, чтобы не превращать текст в цветное полотно. Также я переписываю основные идеи, определения, алгоритмы. Для этого я использую приложение Anki. В приложении можно создавать карточки, плагины позволяют делать ссылки на другие карточки
Майнд-мап
Если в анки я храню подробные конспекты, то для быстрой ориентации по материалу я использую майнд-мапы. Манд-мапа - это схема, в которой в центре выписывается основное понятие и от него расходятся линии к другим связанным понятиям. Для составления манд-мапы понадобится список ключевых слов, который был сделан во время чтения.
Повторение
Для повторения я не нашла ничего лучше, чем классическое интервальное повторение - сначала вечером, затем на следующий день, через 3 дня и через неделю. В дальнейшем стараюсь повторять раз в несколько месяцев. Для повторения я использую майнд-мапы. Мне проще отмечать дату в уголке на майнд-мапе.
👉 @seniorFront
Как и любому программисту, мне приходится учить большие объемы материала с целью повышения квалификации или прохождения интервью. Здесь я опишу способы, которые я использую для упорядочивания и запоминания материала.
Оглавление
Для меня все начинается с составления плана обучения. Это просто список тем, которые я хочу изучить. Он позволяет мне оценить время, требуемое для изучения; отсортировать темы; приоритизировать их; увидеть зависимости между ними.
Подготовка
На день для изучения выбираю две темы. Обычно я стараюсь перемежать теорию с более практической задачей. Это позволяет мне отдохнуть от теории и переключиться. Я беру именно несколько тем для изучения и когда осознаю, что поняла материал, переключаюсь на другую тему. Я не пытаюсь сразу выучить всё, чтоб "от зубов отскакивало", для этого нужно время, чтобы материал уложился в голове. Главная идея откладывания в том, чтобы дать это время.
Чтение и конспект
Во время чтения я подчеркиваю или выписываю ключевые слова. Я не выделяю определения, чтобы не превращать текст в цветное полотно. Также я переписываю основные идеи, определения, алгоритмы. Для этого я использую приложение Anki. В приложении можно создавать карточки, плагины позволяют делать ссылки на другие карточки
Майнд-мап
Если в анки я храню подробные конспекты, то для быстрой ориентации по материалу я использую майнд-мапы. Манд-мапа - это схема, в которой в центре выписывается основное понятие и от него расходятся линии к другим связанным понятиям. Для составления манд-мапы понадобится список ключевых слов, который был сделан во время чтения.
Повторение
Для повторения я не нашла ничего лучше, чем классическое интервальное повторение - сначала вечером, затем на следующий день, через 3 дня и через неделю. В дальнейшем стараюсь повторять раз в несколько месяцев. Для повторения я использую майнд-мапы. Мне проще отмечать дату в уголке на майнд-мапе.
👉 @seniorFront
🔥14❤6👍3🤔3👎1