- 282
- 128 340
learnprofi.online
Philippines
Приєднався 14 гру 2020
Уроки по C# , .NET и ReactJS, с согласия автора оригинального контента, размещенные на учебном портале Udemy.com.
Настройка интерфейса и логики создания новых контактов в компонентах на React
В первой части видео мы рассмотрим, как изменить внешний вид страницы на React, для управления контактами, разделив ее на два компонента: избранные контакты и остальные контакты.
Мы будем править компоненты на React, чтобы оптимизировать их стили и сделать интерфейс более компактным.
В процессе работы добавим дополнительные блоки и стилизации, чтобы улучшить расположение элементов и сделать его более удобным для пользователей.
Также добавим новые стили и отступы, чтобы визуально разграничить избранные и обычные контакты.
В завершение устраним небольшие визуальные недочеты, чтобы страница выглядела более профессионально.
Во второй части видео, мы обсудим настройку логики для создания нового контакта в нашем приложении.
Мы начнем с разработки компонента React, в котором можно будет добавлять новые контакты в список.
Сначала мы создадим метод для обработки добавления новых контактов, используя состояние React в классовом компоненте ContactIndex.
Мы также настроим этот компонент для правильного отображения сообщений об успехе или ошибках при добавлении контактов.
Для этого мы преобразуем компонент из функционального в классовый компонент и добавим методы для управления состоянием и отображением сообщений.
По ходу видео мы также исправим ошибки и улучшим код, чтобы приложение работало корректно.
Мы будем править компоненты на React, чтобы оптимизировать их стили и сделать интерфейс более компактным.
В процессе работы добавим дополнительные блоки и стилизации, чтобы улучшить расположение элементов и сделать его более удобным для пользователей.
Также добавим новые стили и отступы, чтобы визуально разграничить избранные и обычные контакты.
В завершение устраним небольшие визуальные недочеты, чтобы страница выглядела более профессионально.
Во второй части видео, мы обсудим настройку логики для создания нового контакта в нашем приложении.
Мы начнем с разработки компонента React, в котором можно будет добавлять новые контакты в список.
Сначала мы создадим метод для обработки добавления новых контактов, используя состояние React в классовом компоненте ContactIndex.
Мы также настроим этот компонент для правильного отображения сообщений об успехе или ошибках при добавлении контактов.
Для этого мы преобразуем компонент из функционального в классовый компонент и добавим методы для управления состоянием и отображением сообщений.
По ходу видео мы также исправим ошибки и улучшим код, чтобы приложение работало корректно.
Переглядів: 5
Відео
Ввод и валидация данных в React
В первой части видео мы продолжаем настройку логики для создания нового контакта в приложении. Мы подробно рассмотрим, как правильно обработать данные из формы ввода в компоненте и передать их в родительский компонент. Видео охватывает несколько важных шагов, включая создание объектов с данными контакта, обработку событий формы, инициализацию состояния и добавление нового контакта в список. Мы ...
Настройка передачи данных о пользователях в обработчике OnPost в Duende Identity Server
Переглядів 1921 годину тому
В этом видео мы рассмотрим, как настроить страницу регистрации с использованием Duende Identity Server в проекте ASP.NET Core. Мы подробно разберем настройку метода обработчика OnPost, проверку состояния модели, создание нового пользователя и назначение ролей. Также вы узнаете, как добавить Claims для пользователя и настроить автоматический вход в систему после регистрации. Основные моменты уро...
Настройка страницы регистрации пользователей в Duende Identity Server, часть вторая
Переглядів 2414 днів тому
В этом видео мы подробно рассмотрим процесс настройки страницы регистрации в ASP.NET Core, используя Duende Identity Server. Вы узнаете, как добавить необходимые поля ввода и кнопки, как внедрить зависимости, такие как UserManager, SignInManager и RoleManager, и как использовать их методы для обработки логики на странице. Мы также настроим привязку данных к ViewModel и обеспечим выбор роли поль...
Настройка страницы регистрации пользователей в Duende Identity Server, часть первая
Переглядів 3721 день тому
В этом видео мы рассмотрим, как добавить возможность регистрации новых пользователей в систему Duende Identity Server в веб-приложении на ASP.NET Core. Мы пройдем следующие шаги: 1. Запуск приложения и проверка корректного входа в систему для зарегистрированных пользователей. 2. Добавление ссылок и шаблона для страницы регистрации новых пользователей. 3. Создание папки и Razor-страницы для реги...
Роли пользователей в токенах и в OpenIdConnect и переходы по страницам в Duende Identity Server
Переглядів 11428 днів тому
В первой части видео мы разберем, как настроить использование информации о ролях пользователей, передаваемых в токене доступа, в основном веб-приложении на ASP.NET Core, используя Duende Identity Server. Мы рассмотрим следующие шаги: - Настройка сопоставления типа Claim с данными о роли текущего пользователя. - Изменения в файле Program.cs для конфигурации OpenIdConnect. - Проверка доступа к за...
Анализ содержимого Acces Token из Duende Identity Server, имя и роль пользователя в Access Token
Переглядів 48Місяць тому
В первой части видео рассматривается, как проверить наличие токена, передаваемого из Duende Identity Server, внутри вашего веб-приложения. Вы узнаете, как получать и обрабатывать токен в ASP.NET Core, используя метод HTTPContext.GetTokenAsync, и как анализировать его содержимое с помощью jwt.io. Мы рассмотрим следующие шаги: - Настройка AuthController для получения токена. - Изменение метода на...
Настройки аутентификации в веб проекте и API с Duende Identity Server
Переглядів 37Місяць тому
В этом видео мы рассмотрим, как добавить дополнительные настройки в решение перед запуском Duende Identity Server в тестовом режиме. Мы начнем с редактирования файлов конфигурации, таких как appsettings.json и LaunchSettings. Настроим ссылки на сервисы и добавим аутентификацию с использованием OpenID Connect. Также установим необходимые пакеты NuGet и настроим параметры для авторизации, включая...
Настройка страниц Login и Logout в Duende Identity Server
Переглядів 64Місяць тому
В этом видео мы продолжим работу над проектом с Duende Identity Server. Мы рассмотрим, как настроить страницы входа (Login) и выхода (Logout) в системе, заменяя устаревший функционал на более современные решения с использованием классов SignInManager, UserManager и других. Также мы рассмотрим, как добавить аутентификацию и авторизацию с помощью OpenID Connect, используя тестовый веб-проект. Вы ...
Подключение ресурсов, scopes, клиентов, инициализация пользователей и ролей в Duende Identity Server
Переглядів 54Місяць тому
В первой части видео, мы рассмотрим базовую настройку проекта с Duende Identity Server. Мы откроем файл Program.cs и добавим обработку специальных событий для корректной работы на стадии разработки. Затем добавим и настроим API-ресурсы, клиентов и области действия (Scopes) для Identity Server. Исправим ошибки в коде, связанные с определением объектов Clients и ApiScopes, и убедимся, что нет оши...
Настройка Клиента, его Scopes и других данных в Duende Identity Server
Переглядів 57Місяць тому
В этом видео мы продолжаем работать с Duende Identity Server и настраивать идентификацию пользователей. В частности, мы рассматриваем класс TestUsers, содержащий примеры данных (Claims) для выдуманных пользователей, и объясняем, как создать и управлять реальными пользователями, добавив их информацию в отдельную базу данных. Мы подготавливаем файл статического класса SD для хранения строковых ко...
Пример настройки интерфейса компонентов в ReactJS, с использованием иконок и стилей Bootsrap
Переглядів 302 місяці тому
В этом видео мы покажем, как стилизовать компоненты в React с использованием Bootstrap. Мы будем работать с компонентом React и добавим различные стили для вывода данных о контактах. Вот что вы узнаете в этом видео: 1.Стилизация основного блока: Узнаем, как добавить стилизацию для основного блока div с использованием классов из Bootstrap. 2.Добавление аватара: Научимся выводить стилизованный ав...
Пример настройки сохранения данных в состоянии, в родительском компоненте в React.
Переглядів 212 місяці тому
В этом видео мы покажем, как настроить управление данными с помощью состояний, и передачей этих данных от родительского компонента к дочернему компоненту в React. Мы рассмотрим, как добавлять состояния в корневой компонент и передавать их дочерним компонентам. В видео показан пример создания классового компонента для управления контактами, настройка начальных значений состояний и их инициализац...
Пример создания структуры страницы и интерфейса компонента для ввода данных в React
Переглядів 502 місяці тому
В первой части видео мы продолжаем разработку приложения для управления контактами на React. В этом уроке мы создадим основы интерфейсов для всех добавленных ранее компонентов. Вы увидите, как мы создаем визуальные элементы и настраиваем базовую структуру нашего проекта. Мы добавим стилизованные кнопки, создадим компоненты для работы с контактами и организуем их в проекте. Это видео идеально по...
Пример создания проекта и настройки структуры компонентов для проекта на React
Переглядів 282 місяці тому
В первой части этого видео мы шаг за шагом создадим новый проект на React.. Вы узнаете, как создать проект, настроить структуру файлов и папок, скопировать необходимые компоненты и стили из предыдущего проекта, а также настроить базовые компоненты. Основные темы, рассмотренные в первой части видео: 1.Создание нового проекта на React: - Создание новой папки для проекта и инициализация проекта с ...
Пример управления данными в состояниях в React
Переглядів 202 місяці тому
Пример управления данными в состояниях в React
Последовательное изменение состояний в React
Переглядів 153 місяці тому
Последовательное изменение состояний в React
Управление данными в состояниях (state) в React
Переглядів 233 місяці тому
Управление данными в состояниях (state) в React
Пример создания проекта и настройка обработки событий в React
Переглядів 363 місяці тому
Пример создания проекта и настройка обработки событий в React
Преобразование функциональных компонентов в классовые компоненты в React
Переглядів 453 місяці тому
Преобразование функциональных компонентов в классовые компоненты в React
Как использовать стрелочные функции в React для быстрой работы
Переглядів 433 місяці тому
Как использовать стрелочные функции в React для быстрой работы
Передача ссылок на компоненты и оптимизация структуры файлов и папок в проектах на React
Переглядів 354 місяці тому
Передача ссылок на компоненты и оптимизация структуры файлов и папок в проектах на React
Передача значений для свойств через props и установка внешних пакетов в React
Переглядів 454 місяці тому
Передача значений для свойств через props и установка внешних пакетов в React
Cоздание, экспорт и импорт компонентов в React
Переглядів 254 місяці тому
Cоздание, экспорт и импорт компонентов в React
Синтаксис переменных, свойств и элементов HTML в формате JSX в React
Переглядів 285 місяців тому
Синтаксис переменных, свойств и элементов HTML в формате JSX в React
Фильтрация для запросов в API на .NET
Переглядів 2515 місяців тому
Фильтрация для запросов в API на .NET
Использование стилей в компонентах Реакт
Переглядів 715 місяців тому
Использование стилей в компонентах Реакт
Создание компонентов в React и синтаксис в JSX
Переглядів 975 місяців тому
Создание компонентов в React и синтаксис в JSX
Функциональные и классовые компоненты в ReactJS
Переглядів 936 місяців тому
Функциональные и классовые компоненты в ReactJS
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
Курс Аутентификация и авторизация в ASP.NET Core, www.udemy.com/course/aspnet-core-net-7-authentication-ru/?referralCode=05720F5FF7267BE48DAD
спасибо большое
Как можно с вами связаться?
Привет, главной страницы канала есть ссылки на мой профиль на Udemy и LinkedIn. А что хотели то? Пишите прямо здесь если это не приватная инфа
@@learnprofionline на юдеми нельзя связаться. Может почту? :)
learnprofi собака gmail точка com
помогите
я не чего не понимаю
Легко, доступно понятно и рабочий вариант, лаконично
Спасибо, однако версия .NET 5 уже не первой свежести
Spasibo!
4:43. . . скажите пожалста почему у меня кнопка не выравнивается после этого кода ? <div class="col-6 text-right"> более того - подсказчик не видит text-right при вводе этой части кода
Читайте синтаксис bootsеrap на официальном сайте, возможно версия bootstrap в вашем проекте, отличается от версии в видео, это курс не дизайну UI, это курс по ASP.NET MVC
@@learnprofionline да. . . все дело в версии
1:35 . .. _db = db; получаем ссылку для ПОЛЯ а не СВОЙСТВА
Да, это приватное, только для чтения поле, а не свойств., Но если бы это было действительно свойством, то код все равно работал бы также...Или нет?
отличная иллюстрация, спасибо большое!
прям для чайников, спасибо большое
Спасибо, очень доходчиво и последовательно.
мне нравится подача и голос автора
Скидка по ссылке www.udemy.com/course/reactjs-basics-ru/?referralCode=421A5135A7F0B2690393
Скидка по ссылке www.udemy.com/course/reactjs-basics-ru/?referralCode=421A5135A7F0B2690393
Как создать WEB API, скидка на курс www.udemy.com/course/restfull-api-aspnet-core-web-api-net-7-1/?referralCode=794B09F363129D8EBEBE
Удачно с хабра зашел)
spasibo!
Скидка по ссылке www.udemy.com/course/reactjs-basics-ru/?referralCode=421A5135A7F0B2690393 Закрытая подписка на расширенную версию поддержки по ссылке www.udemy.com/course/draft/5863274/?referralCode=B2E2AB82D8B7DF157AA9
spasibo!
spasibo!
Скидка по ссылке www.udemy.com/course/reactjs-basics-ru/?referralCode=421A5135A7F0B2690393 Закрытая подписка на расширенную версию поддержки по ссылке www.udemy.com/course/draft/5863274/?referralCode=B2E2AB82D8B7DF157AA9
Spasibo!
Спасибо за видео
Какой AuthController?? Вначале курса мы создавали UsersController с совсем другим кодом, а теперь откуда то берется AuthController с новым кодом и непонятно что делать со старым. Перед этим три ролика вообще про условную установку пакетов, которые никак не используются в конечном проекте. Все разорвано, ничего не понятно. Вы если хотите чтобы покупали ваш курс, то делайте хотя бы логичные превью. А так это все вызывает только отторжение. Два часа потрачены ни на что, все равно придется искать информацию в других источниках
Полезный урок!
Полезный урок!