В этом проекте мы собираемся создать клон пользовательского интерфейса Instagram Stories с помощью Next.js и CSS попутного ветра. Клон Instagram выглядит так же, как настоящий. Он содержит аватар и его имя пользователя, а также градиентное кольцо. Для аватара мы будем использовать DaisyUI. Мы также будем использовать Fontawesome и Heroicon для добавления различных иконок. Следующий эффект точно такой же, как в реальном Instagram. Истории будут плавно прокручиваться за счет добавления пользовательской кнопки прокрутки, которая поверх всех историй, когда она начнет прокручиваться, появится кнопка прокрутки влево. При прокрутке до конца кнопка прокрутки вправо исчезнет.
Интерфейсный интерфейс Instagram-историй React NextJS с помощью TailWind CSS, часть 1
Интерфейс для Instagram-историй React NextJS с помощью TailWind CSS, часть 2
Интерфейсный интерфейс Instagram-историй React NextJS с помощью TailWind CSS, часть 3
Реакция пользовательского интерфейса Instagram-историй NextJS с помощью TailWind CSS, часть 4
Интерфейсный интерфейс Instagram-историй React NextJS с помощью TailWind CSS, часть 5
Интерфейсный интерфейс Instagram-историй React NextJS с помощью TailWind CSS, часть 6
Если вам понравилась эта история, вам также может понравиться подписка на Medium. Это всего 5 долларов в месяц (цена чашки кофе!), но это даст вам неограниченный доступ к историям, поддерживая ваших любимых писателей. Если вы зарегистрируетесь по этой ссылке, я получу небольшую комиссию. Спасибо!
Подписывайтесь на нас: YouTube, Medium, Udemy, Linkedin, Twitter, Instagram, Gumroad, Quora, Pinterest.
Присоединяйтесь к партнерам, чтобы зарабатывать деньги
