![Archakov Blog](/img/default-banner.jpg)
- Видео 187
- Просмотров 6 674 006
Archakov Blog
Россия
Добавлен 12 июл 2015
Blog about programming in JavaScript, ReactJS, NodeJS
Vue 3 для начинающих / Разработка интернет-магазина Vue Sneakers
Наконец-то доделал курс по Vue 3 для начинающих, в котором мы будем разрабатывать полноценный проект Vue Sneakers (старый добрый React Sneakers, но улучшенный в плане дизайна, анимации и функционала) + хранить данные будем на бесплатном сервисе Mokky.
🧐 Для кого этот курс?
Курс предназначен для НАЧИНАЮЩИХ 👨🏻🎓, кто не знаком с Vue. Для ноченающех! Не для тру фронтенд девелоперов с опытом в 150 лет и познавших вселенную фронтенда, а для простых смертных.
Для тех, кто вообще не знаком с Vue и хочет понять, что это за фреймворк и как на нём создавать реальные приложения с передачей данных между компонентами, роутингом, запросами к бэкенду, а не просто тудушки.
В этом курсе мы не просто будем изу...
🧐 Для кого этот курс?
Курс предназначен для НАЧИНАЮЩИХ 👨🏻🎓, кто не знаком с Vue. Для ноченающех! Не для тру фронтенд девелоперов с опытом в 150 лет и познавших вселенную фронтенда, а для простых смертных.
Для тех, кто вообще не знаком с Vue и хочет понять, что это за фреймворк и как на нём создавать реальные приложения с передачей данных между компонентами, роутингом, запросами к бэкенду, а не просто тудушки.
В этом курсе мы не просто будем изу...
Просмотров: 131 017
Видео
Продвинутый Fullstack-курс разработки облачного хранилища на NextJS + NestJS (Middle / Senior)
Просмотров 52 тыс.Год назад
Наконец-то доделал курс по Vue 3 для начинающих, в котором мы будем разрабатывать полноценный проект Vue Sneakers (старый добрый React Sneakers, но улучшенный в плане дизайна, анимации и функционала) хранить данные будем на бесплатном сервисе Mokky. 🔗 Следите за обновлениями и информацией в: - Telegram-канале: t.me/archakov_im - VK: archakov_im - Личном блоге: archakov.im - GitHub: githu...
Прекрати использовать useMemo! Топ ошибок Junior/Middle/Senior React-разработчиков
Просмотров 25 тыс.Год назад
Излил там всю боль и показал на реальных примерах из предыдущих работ и нынешней, как неправильно юзают хук useMemo ⏰ Таймкоды: 00:00:00 Начало Плохие примеры: 00:00:31 Первый 00:02:18 Второй 00:03:58 Третий 00:04:53 Четвертый 00:05:21 Пятый 00:05:37 Шестой 00:06:12 Седьмой 00:07:37 Когда хорошо использовать useMemo / React.memo 00:09:30 Подводим итог Обязательно посмотрите эти два видео: useMe...
React Query за 10 минут! Быстрый курс
Просмотров 49 тыс.Год назад
В этом ролике я расскажу о том, что такое React Query, как делать запрос на бэкенд, пагинацию, отправку POST запроса (мутации) и расскажу про плюсы и минусы этой библиотеки. Всё это за 11 минут! ⏰ Таймкоды: 00:00:00 Начало 00:00:46 Пишем код с помощью Axios 00:02:47 Переписываем на React Query используя useQuery 00:04:50 Делаем пагинацию useState useQuery 00:06:00 Крутая фича с помощью refetchO...
Не делай такое с useState! Топ 5 ошибок junior React-разработчика
Просмотров 48 тыс.Год назад
Часто начинающие React-разработчики используют хук или неправильно или не по назначению. В этом видео мы попытаемся разобраться с самыми популярными ошибками/багами с использованием useState и научимся их исправлять. ⏰ Таймкоды: 00:00:00 Начало 00:00:58 useState setInterval/setTimeout 00:04:48 Работа со старым стейтом 00:08:08 Обращение к undefined внутри стейта 00:14:25 Не надо хранить в useSt...
React Intersection Observer (scroll + lazy-load картинок)
Просмотров 24 тыс.Год назад
Представьте, что вам нужно определить, что какой-то конкретный попал в область вашего экрана на 10% или 100%, после чего необходимо выполнить какое-то действие? Например, анимировать элемент. React Intersection Observer идеально справится с этой задачей! Нужно определить, что пользователь дошел до конечного скролла? Юзай Intersection Observer. Нужно сделать ленивую подгрузку картинок? Вперёд вм...
Разработай 6 проектов на ReactJS (для начинающих)
Просмотров 245 тыс.Год назад
В этом видео я тебе покажу как разработать 6 разных ReactJS проектов уровня Junior. Данное видео подойдёт для тех, кто только недавно познакомился с ReactJS и хочет добавить к себе в портфолио проекты. Видео по деплою: ruclips.net/video/-pJN9faoa8E/видео.html 📚 GitHub-репо: t.me/archakov_im/534 🔗 Следите за обновлениями и информацией в: - Telegram-канале: t.me/archakov_im - VK: archakov_...
React Native для начинающих за 2 часа [2022] ! Мобильное приложение на JavaScript
Просмотров 146 тыс.Год назад
В данном курсе ты научишься создавать реальное мобильное приложение с помощью React Native (JavaScript ReactJS) Курс идеально подойдёт для фронтенд-разработчиков, которые уже знакомы с ReactJS. 👨🏻💻 Что необходимо знать перед началом? 1. useState, useEffect, JSX, Props 2. Уметь работать с HTTP-запросами (axios/fetch) 3. Знать ReactJS не менее 3-5 месяцев 4. Знать JS не менее 5-6 месяцев 👀 Чему ...
Полный Full Stack курс ReactJS + NodeJS для начинающих за 4 часа! (MongoDB, Express, React, NodeJS)
Просмотров 383 тыс.Год назад
В этом видео ты научишься с нуля разрабатывать бэкенд на стэке MERN (MongoDB, Express, React, NodeJS) и подключать к фронтенду свой бэкенд. Также, к завершению урока ты научишься деплоить своё приложение на Heroku Vercel. Курс идеально подойдёт для новичков, которые впервые решили попробовать NodeJS. 👀 Чему ты научишься? 1. Разрабатывать свой бэкенд 2. Делать авторизацию и регистрацию backend f...
#27: 🍕 React Pizza v2 - Оптимизируем сборку JS-файла. Code Splitting, Tree Shaking, Reexport
Просмотров 31 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#26: 🍕 React Pizza v2 - Сохраняем пиццы в LocalStorage, грамотно структурируем папки проекта
Просмотров 20 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#25: 🍕 React Pizza v2 - Оптимизируем перерисовку компонентов с помощью useCallback и React.memo
Просмотров 15 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#24: 🍕 React Pizza v2 - TypeScript + Redux Toolkit
Просмотров 22 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#23: 🍕 React Pizza v2 - Типизация onClick, onChange и Event (TypeScript)
Просмотров 15 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#22: 🍕 React Pizza v2 - Типизируем пропсы (props) и хук useRef (TypeScript)
Просмотров 17 тыс.2 года назад
React Pizza V2 - Это обновлённый курс на 2022 год, одного из самых популярных курсов 🔥 по ReactJS для начинающих. Более подробней тут: www.notion.so/React-Pizza-v2-REMASTERED-655fa3a5ea4f4bce8faeee2f28a8fb22 Исходники доступны в Boosty или в моём Telegram-канале: t.me/archakov_im ❤️ Поддержка: - Boosty (исходники, макеты): boosty.to/archakov_blog - Донаты: www.donationalerts.com/r/archakov_blog...
#21: 🍕 React Pizza v2 - Используем TypeScript + ReactJS (практика)
Просмотров 20 тыс.2 года назад
#21: 🍕 React Pizza v2 - Используем TypeScript ReactJS (практика)
#20: 🍕 React Pizza v2 - Что такое TypeScript и зачем он нужен?
Просмотров 18 тыс.2 года назад
#20: 🍕 React Pizza v2 - Что такое TypeScript и зачем он нужен?
#19: 🍕 React Pizza v2 - Разбираемся подробней с роутером (useParams, useLocation, Outlet)
Просмотров 22 тыс.2 года назад
#19: 🍕 React Pizza v2 - Разбираемся подробней с роутером (useParams, useLocation, Outlet)
#18: 🍕 React Pizza v2 - Что такое ThunkAPI в RTK? Создаем селекторы
Просмотров 18 тыс.2 года назад
#18: 🍕 React Pizza v2 - Что такое ThunkAPI в RTK? Создаем селекторы
#17: 🍕 React Pizza v2 - Асинхронные экшены в RTK (createAsyncThunk), отлавливаем ошибки
Просмотров 32 тыс.2 года назад
#17: 🍕 React Pizza v2 - Асинхронные экшены в RTK (createAsyncThunk), отлавливаем ошибки
#16: 🍕 React Pizza v2 - Создаем Redux-логику для корзины, скрытие/показ popup-сортировки
Просмотров 44 тыс.2 года назад
#16: 🍕 React Pizza v2 - Создаем Redux-логику для корзины, скрытие/показ popup-сортировки
#15: 🍕 React Pizza v2 - Сохраняем параметры фильтрации в URL
Просмотров 33 тыс.2 года назад
#15: 🍕 React Pizza v2 - Сохраняем параметры фильтрации в URL
#14: 🍕 React Pizza v2 - Оптимизируем поиск с помощью Debounce, пагинация через Redux Toolkit
Просмотров 36 тыс.2 года назад
#14: 🍕 React Pizza v2 - Оптимизируем поиск с помощью Debounce, пагинация через Redux Toolkit
#13: 🍕 React Pizza v2 - Изучаем хуки useSelector, useDispatch, создаем свой Slice в Redux Toolkit
Просмотров 36 тыс.2 года назад
#13: 🍕 React Pizza v2 - Изучаем хуки useSelector, useDispatch, создаем свой Slice в Redux Toolkit
#12: 🍕 React Pizza v2 - Изучаем библиотеку Redux Toolkit
Просмотров 45 тыс.2 года назад
#12: 🍕 React Pizza v2 - Изучаем библиотеку Redux Toolkit
#11: 🍕 React Pizza v2 - Что такое контекст в React (useContext) и Props Drilling?
Просмотров 28 тыс.2 года назад
#11: 🍕 React Pizza v2 - Что такое контекст в React (useContext) и Props Drilling?
#10: 🍕 React Pizza v2 - Разрабатываем пагинацию и поиск пицц
Просмотров 47 тыс.2 года назад
#10: 🍕 React Pizza v2 - Разрабатываем пагинацию и поиск пицц
#9: 🍕 React Pizza v2 - Делаем функционал сортировки и фильтрации пицц
Просмотров 57 тыс.2 года назад
#9: 🍕 React Pizza v2 - Делаем функционал сортировки и фильтрации пицц
#8: 🍕 React Pizza v2 - Настраиваем адаптивную вёрстку, создаём страницу корзины
Просмотров 34 тыс.2 года назад
#8: 🍕 React Pizza v2 - Настраиваем адаптивную вёрстку, создаём страницу корзины
#7: 🍕 React Pizza v2 - Подключаем React Router v6, создаем компонент-скелетон
Просмотров 46 тыс.2 года назад
#7: 🍕 React Pizza v2 - Подключаем React Router v6, создаем компонент-скелетон
1:04:09 Когда спрашивают, нужна ли математика программисту :D
Блин контент вообще шикарный, все очень подробно и круто объясняешь спасибо тебе за это!!111111 Я только недели две как изучаю vue, поэтому есть некоторые вопросы, если вдруг у тебя будет время, ответь пожалуйста. Если сможешь в кратце ответь пожалуйста на следующий вопрос, повторюсь что я только недавно начал изучать vue, может совсем глупым покажется вопрос. И так внимание вопрос - Зачем создавать ресурс /favorites если можно просто добавить к items поле isFavorite? И второй, можно ли было использовать pinia для добавления в нее items'ов и уже в pinia использовать actions для добавления в закладки корзину и тд? Спасибо за ответ, если вдруг найдешь время. Очень благодарен буду!!!!11111
Ужас, душнила, не может правильно сформулировать вопрос , когда понимает что сам своим вопросом заходит в тупик начинает переворачивать вопросы в свою пользу. А так очень достойные ответы можно почерпнуть знаний
1:00:42 Причина в другом. Строки в JavaScript основаны на Юникоде. И код символа Я больше, чем код символа А.
Спасибо
Спасибо
Спасибо тебе за видео, можешь подсказать как сайт расшифровал jwt токен бещ секретного ключа ??
setTimeOut( ) и setInterval( ) разве не асинхронные в JS? Почему ж нету - есть
Слишком медленный курс надо ускорить видео 🤣
в разработке колекции фото компонент Collection не может считать фото по индексу (Cannot read properties of undefined (reading '0'))- и так с каждым изображением, API не работает... хотя выводила его в консоль и там отображаются данные, также в конвертации валют увы API не подтягивало данных- но там скорее всего оно действительно устарело
Создание массива из 10 элементов: [...new Array(10)] - способ из видео Array(10).fill(null) - я такой вариант написал
Ашалеть как интересно!Бомбово обьясняешь!
Отличный контент,хорошо постарался,молодец!
3:12 Если любишь фронтенд, press F to pay respect
что за расширение Вы используете для перевода, подскажите, пожалуйста
1:14:50 у меня 8 фолсов, Card так же 4
у тебя баг с " - " в корзине. При нажатии на " - " у тебя totalPrice не пересчитывается! Продублировал код подщета totalPrice
Что в итоге делать с уроком если половины информации не хватает?
а если использую для запросов React Query от TanStack, надо ли все это в редаксе городить?
бэк я научился писать, а вот фронт дает прикуривать знатно. для меня магия - связка фронта и бэка. надеюсь не один такой
Подскажи название темы на vs code
Отличная подача! Отличный материал!
ссылки на картинки из pizzas.json не отображают почему то( хотя все как на видео
а как вы делаете в гитхабе что переключатесь между проектами
Ребята, добрый день. При клонировании и дальнейшем запуске npm start в VC будет выдавать ошибку. Что нужно сделать, когда Git Bashe here сделаете клонирование, вставив ссылку, не закрываем набираем следующей строчкой npm init -y, ниже в строчке пишем npm install, потом npm start - всё заработает. Всем удачи) Арчакову, спасибо за то, что он делает)))
У кого не устанавливается либа clsx, просто пропишите принудительную установку npm install --force clsx
Пасиба ...
Да это просто праздник какойто!! Огромный человеческий респект!
А обязательно ли удалять
Ну что ж, вот и я завершил этот курс) После 15 урока было немного сложно, но как видите прорвался до конца) Спасибо тебе Арчаков за эти уроки, очень много полезного узнал для себя, хорошие практики, особенно интересны были темы связанные с Redux'ом и TS'ом . Теперь эти два стека я планирую хорошо изучать и после этого буду сам практиковаться создавая свои пет-проекты. В курсе конечно были небольшие минусы, такой как например 15 урок, но зато ты сам учишься разбираться с ошибками) Особенно понравилось что ты рассказываешь как друг, с юморком и как можно проще своими словами, а не монотонно что-то говоришь из Википедии. Курс в 2024 году еще полностью актуален, разве что в качестве сборщика я использовал Vite, т.к. он быстрее Webpack'а. В общем спасибо за курс, и удачи тебе и каналу!
Спасибо, было интересно посмотреть, интересные задачи
Поржал за Круга в конце) И интересно было, что творится в EnjoyPro ) спасибо
куча недосказано например про Procfile , у меня не запускается бэк на хероку
зачем useRef использовать для хранения true/false? Почему не useState? useRef использовали для ссылок - теперь каша...
что-то дохера воды. Как то стало нифига не понятно.. делаем так, а не не так. Нада отак. Но тут не все правельно. Переделуем. И видео по 1.5 часа потом
Объясните мне блять нахуя оно мне надо если я могу идентично написать но без vue на чистом php? просто объясните мне нахуя все так усложнать?
Раз**б так-то
🥰
Спасибо за твои труды и классную, доходчивую подачу. Посмотрел с удовольствием. пошел смотреть твоим другоие видео)
Может кто-то сталкивался: Мокапи не возвращает пустой массив, а возвращает "Not found" из-за чего приложение ломается. Например, это происходит после того как в поиск ввести запрос, который не будет отображать пиццы. По идее должен быть возвращён пустой массив и в приложении просто ничего не отобразиться, а в моём случае отображается 404 и приложение ломается.
Какие звуки я издаю после просмотра видео 54:00 :D
спасибо, очень помог!)
качественная работа подписка + лайк
Думал зайду посмотрю как работать с реактом, а по факту ещё нужно учить твою документацию к sass , которая нахрен мне не нужна.
Я все посмотрел!!!! Ну ты просто Боженька!!!!!
Тип с именем Ян столкнулся с ошибкой: имя долдно содержать минимум 3 символа
ждём подобное видео про ангуляр
Сколько водыыыыыыыыыыыыыыыыыыыыы
спасибо учитель😊
Добрый день. Подскажите пожалуйста как работать с пагинацией MOKKY dev? При попытке отобразить meta запроса появляются ошибки, Unhandled error during execution of render function